Stabilized UI elements across multiple devices

Synchronized ACs Status functionality

lib/features/shared_widgets/custom_switch.dart

@@ -1,69 +1,30 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
+import 'package:syncrow_app/features/devices/model/device_category_model.dart';
 import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
 
-class CustomSwitch extends StatefulWidget {
-  // final bool value;
-  // final ValueChanged<bool> onChanged;
+class CustomSwitch extends StatelessWidget {
+  const CustomSwitch({super.key, required this.category});
 
-  const CustomSwitch({
-    super.key,
-    // required this.value,
-    // required this.onChanged,
-  });
-
-  @override
-  _CustomSwitchState createState() => _CustomSwitchState();
-}
-
-class _CustomSwitchState extends State<CustomSwitch>
-    with SingleTickerProviderStateMixin {
-  Animation? _circleAnimation;
-  AnimationController? _animationController;
-
-  bool value = false;
-
-  void onChange(bool customValue) {
-    value = customValue;
-  }
-
-  @override
-  void initState() {
-    super.initState();
-    _animationController = AnimationController(
-        vsync: this, duration: const Duration(milliseconds: 300));
-    _circleAnimation = AlignmentTween(
-      begin: value ? Alignment.centerRight : Alignment.centerLeft,
-      end: value ? Alignment.centerLeft : Alignment.centerRight,
-    ).animate(
-      CurvedAnimation(
-        parent: _animationController!,
-        curve: Curves.linear,
-      ),
-    );
-  }
+  final DevicesCategoryModel category;
 
   @override
   Widget build(BuildContext context) {
-    return AnimatedBuilder(
-      animation: _animationController!,
-      builder: (context, child) {
+    return BlocBuilder<DevicesCubit, DevicesState>(
+      builder: (context, state) {
         return GestureDetector(
           onTap: () {
-            setState(() {
-              _animationController!.isCompleted
-                  ? _animationController!.reverse()
-                  : _animationController!.forward();
-              value ? onChange(false) : onChange(true);
-            });
+            DevicesCubit.get(context).changeCategorySwitchValue(category);
           },
           child: Container(
             width: 45.0,
             height: 28.0,
             decoration: BoxDecoration(
               borderRadius: BorderRadius.circular(24.0),
-              color: _circleAnimation!.value == Alignment.centerLeft
-                  ? Color(0xFFD9D9D9)
-                  : ColorsManager.primaryColor,
+              color: category.devicesStatus
+                  ? ColorsManager.primaryColor
+                  : const Color(0xFFD9D9D9),
             ),
             child: Center(
               child: Container(
@@ -76,16 +37,17 @@ class _CustomSwitchState extends State<CustomSwitch>
                 child: Padding(
                   padding: const EdgeInsets.all(2.0),
                   child: Container(
-                    alignment:
-                        value ? Alignment.centerRight : Alignment.centerLeft,
+                    alignment: category.devicesStatus
+                        ? Alignment.centerRight
+                        : Alignment.centerLeft,
                     child: Container(
                       width: 20.0,
                       height: 20.0,
                       decoration: BoxDecoration(
                         shape: BoxShape.circle,
-                        color: _circleAnimation!.value == Alignment.centerLeft
-                            ? Color(0xFFD9D9D9)
-                            : ColorsManager.primaryColor,
+                        color: category.devicesStatus
+                            ? ColorsManager.primaryColor
+                            : Colors.grey,
                       ),
                     ),
                   ),

lib/features/shared_widgets/devices_default_switch.dart

@@ -1,9 +1,11 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_app/features/devices/bloc/ac_cubit.dart';
 import 'package:syncrow_app/features/devices/model/ac_model.dart';
 import 'package:syncrow_app/features/shared_widgets/text_widgets/body_medium.dart';
 import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
 
-class DevicesDefaultSwitch extends StatefulWidget {
+class DevicesDefaultSwitch extends StatelessWidget {
   const DevicesDefaultSwitch({
     super.key,
     required this.model,
@@ -11,73 +13,67 @@ class DevicesDefaultSwitch extends StatefulWidget {
 
   final ACModel model;
 
-  @override
-  State<DevicesDefaultSwitch> createState() => _DevicesDefaultSwitchState();
-}
-
-class _DevicesDefaultSwitchState extends State<DevicesDefaultSwitch> {
   @override
   Widget build(BuildContext context) {
-    return Row(
-      children: <Widget>[
-        Expanded(
-          child: InkWell(
-            onTap: () {
-              setState(() {
-                // isOn = !isOn;
-                widget.model.status = !widget.model.status;
-              });
-            },
-            child: Container(
-              height: 60,
-              decoration: BoxDecoration(
-                color: widget.model.status
-                    ? ColorsManager.primaryColor
-                    : Colors.white,
-                borderRadius: const BorderRadius.only(
-                  topLeft: Radius.circular(15),
-                  bottomLeft: Radius.circular(15),
-                ),
-              ),
-              child: Center(
-                child: BodyMedium(
-                  text: "ON",
-                  fontColor: widget.model.status ? Colors.white : null,
-                  fontWeight: FontWeight.bold,
+    return BlocBuilder<AcCubit, AcState>(
+      builder: (context, state) {
+        return Row(
+          children: <Widget>[
+            Expanded(
+              child: InkWell(
+                onTap: () {
+                  AcCubit.get(context).turnACOn(model);
+                },
+                child: Container(
+                  height: 60,
+                  decoration: BoxDecoration(
+                    color: model.status
+                        ? ColorsManager.primaryColor
+                        : Colors.white,
+                    borderRadius: const BorderRadius.only(
+                      topLeft: Radius.circular(15),
+                      bottomLeft: Radius.circular(15),
+                    ),
+                  ),
+                  child: Center(
+                    child: BodyMedium(
+                      text: "ON",
+                      fontColor: model.status ? Colors.white : null,
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
                 ),
               ),
             ),
-          ),
-        ),
-        Expanded(
-          child: InkWell(
-            onTap: () {
-              setState(() {
-                widget.model.status = !widget.model.status;
-              });
-            },
-            child: Container(
-              height: 60,
-              decoration: BoxDecoration(
-                color: widget.model.status
-                    ? Colors.white
-                    : ColorsManager.primaryColor,
-                borderRadius: const BorderRadius.only(
-                  topRight: Radius.circular(15),
-                  bottomRight: Radius.circular(15),
-                ),
-              ),
-              child: Center(
-                child: BodyMedium(
-                  text: "OFF",
-                  fontColor: widget.model.status ? null : Colors.white,
-                  fontWeight: FontWeight.bold,
+            Expanded(
+              child: InkWell(
+                onTap: () {
+                  AcCubit.get(context).turnACOff(model);
+                },
+                child: Container(
+                  height: 60,
+                  decoration: BoxDecoration(
+                    color: model.status
+                        ? Colors.white
+                        : ColorsManager.primaryColor,
+                    borderRadius: const BorderRadius.only(
+                      topRight: Radius.circular(15),
+                      bottomRight: Radius.circular(15),
+                    ),
+                  ),
+                  child: Center(
+                    child: BodyMedium(
+                      text: "OFF",
+                      fontColor: model.status ? null : Colors.white,
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
                 ),
               ),
             ),
-          ),
-        ),
-      ],
+          ],
+        );
+      },
     );
   }
 }

lib/features/shared_widgets/text_widgets/body_large.dart

@@ -34,7 +34,7 @@ class BodyLarge extends StatelessWidget {
         textAlign: textAlign,
         style: style ??
             context.bodyLarge.copyWith(
-              height: height ?? 1.5,
+              height: height,
               fontWeight: fontWeight,
               color: fontColor,
               fontSize: fontSize,