light switch

code refactor

lib/features/devices/bloc/lights/lights_cubit.dart

@@ -8,6 +8,11 @@ class LightsCubit extends Cubit<LightsState> {
 
   static LightsCubit get(context) => BlocProvider.of(context);
 
+  toggleLight(LightModel light) {
+    light.status != null ? light.status = !light.status! : light.status = true;
+    emit(LightToggled(light));
+  }
+
   int getBrightness(LightModel light) {
     return light.brightness.toInt();
   }

lib/features/devices/bloc/lights/lights_state.dart

@@ -19,3 +19,9 @@ class LightBrightnessChanged extends LightsState {
 
   LightBrightnessChanged(this.brightness);
 }
+
+class LightToggled extends LightsState {
+  final LightModel light;
+
+  LightToggled(this.light);
+}

lib/features/devices/view/widgets/devices_categories_view.dart

@@ -1,4 +1,6 @@
+import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
 import 'package:syncrow_app/features/devices/view/widgets/devices_mode_tab.dart';
 import 'package:syncrow_app/features/devices/view/widgets/switches.dart';
 import 'package:syncrow_app/features/shared_widgets/text_widgets/title_medium.dart';
@@ -15,6 +17,7 @@ class DevicesCategoriesView extends StatelessWidget {
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
         Expanded(
+          flex: 3,
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
@@ -30,7 +33,7 @@ class DevicesCategoriesView extends StatelessWidget {
           ),
         ),
         Expanded(
-          flex: 3,
+          flex: 11,
           child: SingleChildScrollView(
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,

lib/features/devices/view/widgets/devices_view_body.dart

@@ -9,10 +9,6 @@ import '../../bloc/devices_cubit.dart';
 import 'switches.dart';
 
 class DevicesViewBody extends StatelessWidget {
-  const DevicesViewBody({
-    super.key,
-  });
-
   @override
   Widget build(BuildContext context) {
     return BlocProvider(
@@ -24,10 +20,12 @@ class DevicesViewBody extends StatelessWidget {
           return state is DevicesLoading
               ? const Center(child: CircularProgressIndicator())
               : Column(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                   children: [
                     SizedBox(
                       width: MediaQuery.sizeOf(context).width,
-                      height: MediaQuery.sizeOf(context).height - 252,
+                      height: MediaQuery.sizeOf(context).height -
+                          MediaQuery.sizeOf(context).height * .3,
                       child: PageView(
                         controller: pageController,
                         children: const [
@@ -112,11 +110,25 @@ class DevicesViewBody extends StatelessWidget {
                     SmoothPageIndicator(
                         controller: pageController,
                         count: 3,
-                        effect: const WormEffect()),
+                        effect: const WormEffect(
+                          dotHeight: 8,
+                          dotWidth: 8,
+                        ),
+                        onDotClicked: (index) {
+                          pageController.animateToPage(
+                            index,
+                            duration: const Duration(milliseconds: 300),
+                            curve: Curves.ease,
+                          );
+                        }),
                   ],
                 );
         },
       ),
     );
   }
+
+  const DevicesViewBody({
+    super.key,
+  });
 }

lib/features/devices/view/widgets/lights/light_brightness.dart

@@ -33,7 +33,7 @@ class LightBrightness extends StatelessWidget {
               ),
               AnimatedPositioned(
                 left: 0,
-                duration: const Duration(milliseconds: 50),
+                duration: const Duration(milliseconds: 0),
                 child: Container(
                   height: 60,
                   width: (MediaQuery.of(context).size.width - 30) *

lib/features/devices/view/widgets/lights/light_interface.dart

@@ -1,8 +1,13 @@
-import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter/widgets.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_app/features/devices/bloc/lights/lights_cubit.dart';
 import 'package:syncrow_app/features/devices/model/light_model.dart';
-import 'package:syncrow_app/features/shared_widgets/default_container.dart';
+import 'package:syncrow_app/features/shared_widgets/text_widgets/body_large.dart';
+import 'package:syncrow_app/utils/context_extension.dart';
+import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
+import 'package:syncrow_app/utils/resource_manager/strings_manager.dart';
+
+import '../../../../shared_widgets/default_container.dart';
 
 class LightInterface extends StatelessWidget {
   const LightInterface({super.key, required this.light});
@@ -11,34 +16,84 @@ class LightInterface extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return SingleChildScrollView(
+    return BlocBuilder<LightsCubit, LightsState>(
-      child: Column(
+      builder: (context, state) {
-        crossAxisAlignment: CrossAxisAlignment.stretch,
+        return SingleChildScrollView(
-        children: [
+          child: Column(
-          const SizedBox(height: 20),
+            crossAxisAlignment: CrossAxisAlignment.stretch,
-          Container(
+            children: [
-            constraints: const BoxConstraints(
+              const SizedBox(height: 70),
-              maxHeight: 65,
+              Container(
-            ),
+                constraints: const BoxConstraints(
-            margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                  maxHeight: 65,
-            child: const DefaultContainer(child: SizedBox.expand()),
+                ),
+                margin:
+                    const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                child: DefaultContainer(
+                    child: SizedBox.expand(
+                  child: Padding(
+                    padding: const EdgeInsets.symmetric(horizontal: 15),
+                    child: Row(
+                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                      children: [
+                        BodyLarge(
+                          text: light.status ?? false
+                              ? StringsManager.on
+                              : StringsManager.off,
+                          style: context.bodyLarge
+                              .copyWith(color: Colors.grey, fontSize: 24),
+                        ),
+                        Container(
+                          width: 35,
+                          decoration: ShapeDecoration(
+                            color: light.status ?? false
+                                ? ColorsManager.primaryWithOpacity
+                                : Colors.grey,
+                            shape: const CircleBorder(),
+                          ),
+                          child: Center(
+                            child: IconButton(
+                              style: ButtonStyle(
+                                padding: MaterialStateProperty.all(
+                                  const EdgeInsets.all(0),
+                                ),
+                                iconSize: MaterialStateProperty.all(25),
+                              ),
+                              onPressed: () {
+                                LightsCubit.get(context).toggleLight(light);
+                              },
+                              icon: const Icon(
+                                Icons.power_settings_new,
+                                color: Colors.white,
+                              ),
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                )),
+              ),
+              const DefaultContainer(
+                boxConstraints: BoxConstraints(
+                  maxHeight: 310,
+                ),
+                margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                child: SizedBox.expand(
+                  child: Center(child: Text("Light Controls")),
+                ),
+              ),
+              const DefaultContainer(
+                boxConstraints: BoxConstraints(
+                  maxHeight: 65,
+                ),
+                margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                child: Center(child: Text("Timer")),
+              ),
+            ],
           ),
-          Container(
+        );
-            constraints: const BoxConstraints(
+      },
-              maxHeight: 310,
-            ),
-            margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-            child: const SizedBox.expand(),
-          ),
-          Container(
-            constraints: const BoxConstraints(
-              maxHeight: 65,
-            ),
-            margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-            child: const SizedBox.expand(),
-          ),
-        ],
-      ),
     );
   }
 }

lib/features/devices/view/widgets/lights/lights_view.dart

@@ -19,49 +19,53 @@ class LightsView extends StatelessWidget {
   Widget build(BuildContext context) {
     return BlocProvider(
       create: (context) => LightsCubit(),
-      child: BlocBuilder<LightsCubit, LightsState>(
+      child: BlocBuilder<DevicesCubit, DevicesState>(
         builder: (context, state) {
-          LightModel? selectedLight;
+          return BlocBuilder<LightsCubit, LightsState>(
-          if (DevicesCubit.get(context).getSelectedDevice() is LightModel) {
+            builder: (context, state) {
-            selectedLight =
+              LightModel? selectedLight;
-                DevicesCubit.get(context).getSelectedDevice() as LightModel;
+              if (DevicesCubit.get(context).getSelectedDevice() is LightModel) {
-          }
+                selectedLight =
-          List<LightModel> lights = [];
+                    DevicesCubit.get(context).getSelectedDevice() as LightModel;
-          for (var device in DevicesCubit.categories[1].devices) {
+              }
-            if (device is LightModel) {
+              List<LightModel> lights = [];
-              lights.add(device);
+              for (var device in DevicesCubit.categories[1].devices) {
-            }
+                if (device is LightModel) {
-          }
+                  lights.add(device);
-          return AnnotatedRegion(
+                }
-            value: SystemUiOverlayStyle(
+              }
-              statusBarColor: ColorsManager.primaryColor.withOpacity(0.5),
+              return AnnotatedRegion(
-              statusBarIconBrightness: Brightness.light,
+                value: SystemUiOverlayStyle(
-            ),
+                  statusBarColor: ColorsManager.primaryColor.withOpacity(0.5),
-            child: SafeArea(
+                  statusBarIconBrightness: Brightness.light,
-              child: Scaffold(
-                backgroundColor: ColorsManager.backgroundColor,
-                extendBodyBehindAppBar: true,
-                extendBody: true,
-                appBar: const DefaultAppBar(),
-                body: Container(
-                  width: MediaQuery.sizeOf(context).width,
-                  height: MediaQuery.sizeOf(context).height,
-                  decoration: const BoxDecoration(
-                    image: DecorationImage(
-                      image: AssetImage(
-                        Assets.imagesBackground,
-                      ),
-                      fit: BoxFit.cover,
-                      opacity: 0.4,
-                    ),
-                  ),
-                  child: selectedLight != null
-                      ? LightInterface(light: selectedLight)
-                      : LightsViewList(lights: lights),
                 ),
-                bottomNavigationBar: const DefaultNavBar(),
+                child: SafeArea(
-              ),
+                  child: Scaffold(
-            ),
+                    backgroundColor: ColorsManager.backgroundColor,
+                    extendBodyBehindAppBar: true,
+                    extendBody: true,
+                    appBar: const DefaultAppBar(),
+                    body: Container(
+                      width: MediaQuery.sizeOf(context).width,
+                      height: MediaQuery.sizeOf(context).height,
+                      decoration: const BoxDecoration(
+                        image: DecorationImage(
+                          image: AssetImage(
+                            Assets.imagesBackground,
+                          ),
+                          fit: BoxFit.cover,
+                          opacity: 0.4,
+                        ),
+                      ),
+                      child: selectedLight != null
+                          ? LightInterface(light: selectedLight)
+                          : LightsViewList(lights: lights),
+                    ),
+                    bottomNavigationBar: const DefaultNavBar(),
+                  ),
+                ),
+              );
+            },
           );
         },
       ),

lib/features/shared_widgets/default_container.dart

@@ -7,12 +7,15 @@ class DefaultContainer extends StatelessWidget {
     this.height,
     this.width,
     this.color,
+    this.boxConstraints,
+    this.margin,
   });
 
   final double? height;
   final double? width;
   final Widget child;
-
+  final BoxConstraints? boxConstraints;
+  final EdgeInsets? margin;
   final Color? color;
 
   @override
@@ -20,6 +23,8 @@ class DefaultContainer extends StatelessWidget {
     return Container(
       height: height,
       width: width,
+      margin: margin,
+      constraints: boxConstraints,
       decoration: BoxDecoration(
         color: color ?? Colors.white,
         borderRadius: BorderRadius.circular(20),

lib/utils/resource_manager/color_manager.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 abstract class ColorsManager {
   static const Color textPrimaryColor = Color(0xFF5D5D5D);
   static const Color primaryColor = Color(0xFF0030CB);
+  static Color primaryWithOpacity = const Color(0xFF023DFE).withOpacity(0.6);
   static const Color onPrimaryColor = Colors.white;
   static const Color secondaryColor = Color(0xFF023DFE);
   static const Color onSecondaryColor = Color(0xFF023DFE);