From 68b98929e55a41aeb769e032e8cc7de2d176fe21 Mon Sep 17 00:00:00 2001 From: "Michael W. Aziz" Date: Thu, 16 May 2024 20:51:24 +0300 Subject: [PATCH] [SYNC] Working on the checkbox toggle --- TODO.md | 3 + lib/astromic_mobile_elements.dart | 3 +- lib/src/Toggles/Checkbox/checkbox.toggle.dart | 156 ++++++++++++++++++ lib/src/Toggles/toggles.astromic.dart | 36 ++++ 4 files changed, 197 insertions(+), 1 deletion(-) create mode 100644 TODO.md create mode 100644 lib/src/Toggles/Checkbox/checkbox.toggle.dart create mode 100644 lib/src/Toggles/toggles.astromic.dart diff --git a/TODO.md b/TODO.md new file mode 100644 index 0000000..9f54fc8 --- /dev/null +++ b/TODO.md @@ -0,0 +1,3 @@ +### Chip Selector + +[-] Investigate how to detect last enabled chip and check it's status in consequent mode. diff --git a/lib/astromic_mobile_elements.dart b/lib/astromic_mobile_elements.dart index f3b3832..5c55712 100644 --- a/lib/astromic_mobile_elements.dart +++ b/lib/astromic_mobile_elements.dart @@ -4,8 +4,9 @@ library astromic_mobile_elements; export './src/Spacing/spacing.astromic.dart'; export './src/Widgets/widgets.astromic.dart'; export './src/Selectors/selectors.astromic.dart'; +export './src/Toggles/toggles.astromic.dart'; + // export './src/2.Buttons/buttons.astromic.dart'; -// export './src/4.Toggles/toggles.astromic.dart'; // export './src/5.Fields/fields.astromic.dart'; // // // export './src/styles/styles.astromic.dart'; diff --git a/lib/src/Toggles/Checkbox/checkbox.toggle.dart b/lib/src/Toggles/Checkbox/checkbox.toggle.dart new file mode 100644 index 0000000..5648187 --- /dev/null +++ b/lib/src/Toggles/Checkbox/checkbox.toggle.dart @@ -0,0 +1,156 @@ +//SECTION - Imports +// +//s1 PACKAGES +//--------------- +//s2 CORE +import 'package:flutter/material.dart'; +import 'package:flutter/scheduler.dart'; + +//s2 3RD-PARTY +// +//s1 DEPENDENCIES +//--------------- +//s2 SERVICES +//s2 MODELS +//s2 MISC +//!SECTION - Imports +// +//SECTION - Exports +//!SECTION - Exports +// +class AstromicCheckboxToggle extends StatefulWidget { + //SECTION - Widget Arguments + //s1 -- Functionality + final bool? stateVariable; + final bool? initialState; + final void Function(bool)? onStateChanged; + //s1 -- Configuration + final bool? isEnabled; + final bool? isLabelTapable; + final TextDirection? textDirection; + //s1 -- Style + final double? itemSize; + final double? labelSpacing; + // + //s1 -- Content + final Widget Function(bool isChecked, bool isEnabled, VoidCallback? onTap) itemBuilder; + final Widget Function(bool isChecked, bool isEnabled, VoidCallback? onTap)? labelBuilder; + //!SECTION + // + const AstromicCheckboxToggle( + {Key? key, + //s1 -- Functionality + this.stateVariable, + this.initialState, + this.onStateChanged, + //s1 -- Configuration + this.isEnabled = true, + this.isLabelTapable = true, + this.textDirection = TextDirection.ltr, + //s1 -- Style + this.itemSize = 24, + this.labelSpacing = 6, + //s1 -- Content + required this.itemBuilder, + this.labelBuilder}) + : super( + key: key, + ); + + @override + State createState() => _AstromicCheckboxToggleState(); +} + +class _AstromicCheckboxToggleState extends State { + // + //SECTION - State Variables + //s1 --Controllers + //s1 --Controllers + // + //s1 --State + late bool isChecked; + //s1 --State + // + //s1 --Constants + //s1 --Constants + //!SECTION + + @override + void initState() { + super.initState(); + // + //SECTION - State Variables initializations & Listeners + //s1 --Controllers & Listeners + //s1 --Controllers & Listeners + // + //s1 --State + + isChecked = widget.initialState ?? widget.stateVariable ?? false; + //s1 --State + // + //s1 --Late & Async Initializers + //s1 --Late & Async Initializers + //!SECTION + } + + @override + void didChangeDependencies() { + super.didChangeDependencies(); + // + //SECTION - State Variables initializations & Listeners + //s1 --State + //s1 --State + //!SECTION + } + //SECTION - Stateless functions + //!SECTION + + //SECTION - Action Callbacks + _onTap() { + setState(() { + isChecked = !isChecked; + if (widget.onStateChanged != null) widget.onStateChanged!(isChecked); + }); + } + //!SECTION + + @override + Widget build(BuildContext context) { + //SECTION - Build Setup + //s1 -Values + if (widget.stateVariable != null) { + SchedulerBinding.instance.addPostFrameCallback((timeStamp) { + isChecked = widget.stateVariable!; + }); + } + //double w = MediaQuery.of(context).size.width; + //double h = MediaQuery.of(context).size.height; + //s1 -Values + // + //s1 -Widgets + //s1 -Widgets + //!SECTION + + //SECTION - Build Return + return Directionality( + textDirection: widget.textDirection!, + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + //S1 -- Item + SizedBox( + width: widget.itemSize, + height: widget.itemSize, + child: widget.itemBuilder(isChecked, widget.isEnabled!, _onTap), + ), + //S1 -- Label Spacing + if (widget.labelBuilder != null) SizedBox(width: widget.labelSpacing), + //S1 -- Label + if (widget.labelBuilder != null) widget.labelBuilder!(isChecked, widget.isEnabled!, _onTap), + ], + ), + ); + + //!SECTION + } +} diff --git a/lib/src/Toggles/toggles.astromic.dart b/lib/src/Toggles/toggles.astromic.dart new file mode 100644 index 0000000..2ac2e4f --- /dev/null +++ b/lib/src/Toggles/toggles.astromic.dart @@ -0,0 +1,36 @@ +//s2 Core Packages Imports +import 'package:flutter/widgets.dart'; +import 'Checkbox/checkbox.toggle.dart'; + +class AstromicToggles { + //S1 -- Checkbox + static Widget checkBox({ + // + bool? stateVariable, + bool? initialState, + void Function(bool)? onStateChanged, + // + bool? isEnabled, + bool? isLabelTapable, + TextDirection? textDirection, + // + double? itemSize, + double? labelSpacing, + // + // + required Widget Function(bool isChecked, bool isEnabled, VoidCallback? onTap) itemBuilder, + Widget Function(bool isChecked, bool isEnabled, VoidCallback? onTap)? labelBuilder, + }) => + AstromicCheckboxToggle( + stateVariable: stateVariable, + initialState: initialState, + onStateChanged: onStateChanged, + isEnabled: isEnabled, + isLabelTapable: isLabelTapable, + textDirection: textDirection, + itemSize: itemSize, + labelSpacing: labelSpacing, + itemBuilder: itemBuilder, + labelBuilder: labelBuilder, + ); +}