Mobile Application Interface Development Study for Smart Homes

We wanted to do a case study with Flutter.

This study is a mobile management panel study of a Smart Home or Workplace system.

A smart home system can be designed using different communication protocols. We have previously made applications related to Bluetooth and WiFi communication on our site. Those studies can be examined from the links below.

Link: Controlling 8 LEDs with Android phone

Our Mobile Interface design consists of 9 widgets. Bluetooth or wifi connection codes that we have previously made can also be added to these codes.

Flutter-Dart codes are below:

import 'package:flutter/material.dart';
import 'dart:math';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
       home: Scaffold(
         appBar: AppBar(
           title: Text('Smart Home Management V1.1'),
         ),
         body: SmartHomeUI(),
       ),
     );
   }
}
class SmartHomeUI extends StatefulWidget {
   @override
   _SmartHomeUIState createState() => _SmartHomeUIState();
}
class _SmartHomeUIState extends State<SmartHomeUI> {
   bool lamp1Status = false;
   bool lamp2Status = false;
   bool lamp3Status = false;
   bool lamp4Status = false;
   double lamp1Brightness = 0.0;
   double lamp2Brightness = 0.0;
   double lamp3Brightness = 0.0;
   double lamp4Brightness = 0.0;
   double tempValue = Random().nextInt(70).toDouble();
   double humdValue = Random().nextInt(70).toDouble();
   double windValue = Random().nextInt(70).toDouble();
   @override
   Widget build(BuildContext context) {
     return SingleChildScrollView(
       child: Center(
         child: Column(
           mainAxisAlignment: MainAxisAlignment.start,
           children: <Widget>[
             buildSwitchTile("lamp1", lamp1Status),
             buildSwitchTile("lamp2", lamp2Status),
             buildSwitchTile("lamp3", lamp3Status),
             buildSwitchTile("lamp4", lamp4Status),
             buildSlider("lamp1", lamp1Brightness),
             buildSlider("lamp2", lamp2Brightness),
             buildSlider("lamp3", lamp3Brightness),
             buildSlider("lamp4", lamp4Brightness),
             SizedBox(height: 20), // Add space between
             buildSensorWidget("Temp", tempValue),
             buildSensorWidget("Humd", humdValue),
             buildSensorWidget("Wind", windValue),
           ],
         ),
       ),
     );
   }
   Widget buildSwitchTile(String name, bool status) {
     IconData iconData = status ? Icons.brightness_1 : Icons.brightness_1_outlined;
     Color iconColor = status ? Colors.blue : Colors.grey;
     return ListTile(
       leading: Icon(
         iconData,
         color: iconColor,
         size:24.0,
       ),
       title: Text(name),
       trailing: Switch(
         value: status,
         onChanged: (value) {
           setState(() {
             if (name == "lamp1") {
               lamp1Status = value;
             } else if (name == "lamp2") {
               lamp2Status = value;
             } else if (name == "lamp3") {
               lamp3Status = value;
             } else if (name == "lamp4") {
               lamp4Status = value;
             }
           });
         },
         activeTrackColor: Colors.blue,
         activeColor: Colors.blue,
         inactiveThumbColor: Colors.grey,
         inactiveTrackColor: Colors.grey,
       ),
     );
   }
   Widget buildSlider(String name, double brightness) {
     return ListTile(
       title: Text("$name Brightness"),
       subtitle: Slider(
         value: brightness,
         min:0,
         max: 100,
         onChanged: (value) {
           setState(() {
             if (name == "lamp1") {
               lamp1Brightness = value;
             } else if (name == "lamp2") {
               lamp2Brightness = value;
             } else if (name == "lamp3") {
               lamp3Brightness = value;
             } else if (name == "lamp4") {
               lamp4Brightness = value;
             }
           });
         },
       ),
     );
   }
   Widget buildSensorWidget(String name, double value) {
     return ListTile(
       title: Text("$name: $value"), // Shows random value
       subtitle: LinearProgressIndicator(
         value: value / 45.0, // normalize the value between 0 and 45
         valueColor: AlwaysStoppedAnimation<Color>(Colors.orangeAccent),
         backgroundColor: Colors.grey,
       ),
     );
   }
}