Stabilized UI elements across multiple devices

Synchronized ACs Status functionality
This commit is contained in:
Mohammad Salameh
2024-02-28 12:22:45 +03:00
parent 4c27cce519
commit 3fabd41e72
63 changed files with 432 additions and 384 deletions

View File

@ -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,
),
),
),