Refactor ConditionToggle widget to display icons with corresponding conditions

This commit is contained in:
mohammad
2025-05-29 10:48:12 +03:00
parent 010960c89b
commit 0a9d53e5bd

View File

@ -12,22 +12,51 @@ class ConditionToggle extends StatelessWidget {
}); });
static const _conditions = ["<", "==", ">"]; static const _conditions = ["<", "==", ">"];
static const _icons = [
Icons.chevron_left,
Icons.drag_handle,
Icons.chevron_right
];
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ToggleButtons( final selectedIndex = _conditions.indexOf(currentCondition ?? "==");
onPressed: (index) => onChanged(_conditions[index]),
borderRadius: const BorderRadius.all(Radius.circular(8)), return Container(
selectedBorderColor: ColorsManager.primaryColorWithOpacity, height: 80,
selectedColor: Colors.white, decoration: BoxDecoration(
fillColor: ColorsManager.primaryColorWithOpacity, color: ColorsManager.grayColor,
color: ColorsManager.primaryColorWithOpacity, borderRadius: BorderRadius.circular(50),
constraints: const BoxConstraints( ),
minHeight: 40.0, clipBehavior: Clip.antiAlias,
minWidth: 40.0, child: Row(
mainAxisSize: MainAxisSize.min,
children: List.generate(_conditions.length, (index) {
final isSelected = index == selectedIndex;
return Expanded(
child: GestureDetector(
onTap: () => onChanged(_conditions[index]),
child: AnimatedContainer(
duration: const Duration(milliseconds: 180),
curve: Curves.ease,
decoration: BoxDecoration(
color: isSelected ? ColorsManager.blue1 : Colors.transparent,
),
child: Center(
child: Icon(
_icons[index],
size: 38,
color: isSelected
? ColorsManager.whiteColors
: ColorsManager.blackColor,
weight: isSelected ? 700 : 500,
),
),
),
),
);
}),
), ),
isSelected: _conditions.map((c) => c == (currentCondition ?? "==")).toList(),
children: _conditions.map((c) => Text(c)).toList(),
); );
} }
} }