Feature -> Develop | Task-1081 Create UI Widgets Buttons

lib/vaahextendflutter/base/base_theme.dart

@@ -3,10 +3,12 @@ import 'package:flutter/material.dart';
 class BaseTheme {
   static const Map<String, MaterialColor> colors = {
     'primary': _primary,
+    'secondary': _secondary,
     'info': _info,
     'success': _success,
     'warning': _warning,
     'danger': _danger,
+    'help': _help,
     'white': _white,
     'black': _black,
   };
@@ -28,6 +30,22 @@ const MaterialColor _primary = MaterialColor(
   },
 );
 
+const MaterialColor _secondary = MaterialColor(
+  0xFF787878,
+  <int, Color>{
+    50: Color(0xFFF8F8F8),
+    100: Color(0xFFF8F8F8),
+    200: Color(0xFFF1F1F1),
+    300: Color(0xFFD6D6D6),
+    400: Color(0xFFAEAEAE),
+    500: Color(0xFF787878),
+    600: Color(0xFF675759),
+    700: Color(0xFF563C40),
+    800: Color(0xFF45262E),
+    900: Color(0xFF391723),
+  },
+);
+
 const MaterialColor _success = MaterialColor(
   0xFF4FB52D,
   <int, Color>{
@@ -92,6 +110,22 @@ const MaterialColor _danger = MaterialColor(
   },
 );
 
+const MaterialColor _help = MaterialColor(
+  0xFFBE00FF,
+  <int, Color>{
+    50: Color(0xFFFFCCFD),
+    100: Color(0xFFFFCCFD),
+    200: Color(0xFFFA99FF),
+    300: Color(0xFFED66FF),
+    400: Color(0xFFDB3FFF),
+    500: Color(0xFFBE00FF),
+    600: Color(0xFF9300DB),
+    700: Color(0xFF6E00B7),
+    800: Color(0xFF4E0093),
+    900: Color(0xFF38007A),
+  },
+);
+
 const MaterialColor _white = MaterialColor(
   0xFFFFFFFF,
   <int, Color>{

lib/vaahextendflutter/helpers/enums.dart

@@ -1 +1,3 @@
 enum InputSize { extraSmall, small, medium, large, extraLarge }
+
+enum ButtonType { primary, secondary, info, success, danger, warning, help, white }

lib/vaahextendflutter/widgets/atoms/button_checkbox.dart

@@ -0,0 +1,101 @@
+import 'package:flutter/material.dart';
+
+import '../../helpers/constants.dart';
+
+class CheckboxItem<T> {
+  final String text;
+  final bool initialValue;
+  final T data;
+
+  const CheckboxItem({
+    required this.text,
+    this.initialValue = false,
+    required this.data,
+  });
+}
+
+class ButtonCheckBox<T> extends StatefulWidget {
+  final List<CheckboxItem<T>> items;
+  final void Function(List<T>) onChanged;
+  final EdgeInsets? padding;
+
+  const ButtonCheckBox({
+    Key? key,
+    required this.items,
+    required this.onChanged,
+    this.padding,
+  }) : super(key: key);
+
+  @override
+  State<ButtonCheckBox<T>> createState() => _ButtonCheckBoxState<T>();
+}
+
+class _ButtonCheckBoxState<T> extends State<ButtonCheckBox<T>> {
+  final List<bool> _values = [];
+  final List<T> _selectedValues = [];
+
+  @override
+  void initState() {
+    assert(widget.items.isNotEmpty);
+    for (final item in widget.items) {
+      _values.add(item.initialValue);
+      if (item.initialValue) {
+        _selectedValues.add(item.data);
+      }
+    }
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Wrap(
+      children: [
+        for (int index = 0; index < widget.items.length; index++)
+          Padding(
+            padding: widget.padding ?? rightPadding8 + bottomPadding8,
+            child: InkWell(
+              onTap: () {
+                setState(() {
+                  _values[index] = !_values[index];
+                });
+                updateSelectedValues(index);
+                widget.onChanged(_selectedValues);
+              },
+              child: Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Checkbox(
+                    value: _values[index],
+                    onChanged: (value) {
+                      if (value == null) return;
+                      setState(() {
+                        _values[index] = value;
+                      });
+                      updateSelectedValues(index);
+                      widget.onChanged(_selectedValues);
+                    },
+                    materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+                    visualDensity: const VisualDensity(
+                      horizontal: VisualDensity.minimumDensity,
+                      vertical: VisualDensity.minimumDensity,
+                    ),
+                  ),
+                  Flexible(
+                    child: Text(widget.items[index].text),
+                  ),
+                ],
+              ),
+            ),
+          ),
+      ],
+    );
+  }
+
+  void updateSelectedValues(int index) {
+    if (_values[index]) {
+      _selectedValues.add(widget.items[index].data);
+    } else {
+      _selectedValues.remove(widget.items[index].data);
+    }
+  }
+}

lib/vaahextendflutter/widgets/atoms/button_radio.dart

@@ -0,0 +1,87 @@
+import 'package:flutter/material.dart';
+
+import '../../helpers/constants.dart';
+
+class RadioItem<T> {
+  final String text;
+  final T data;
+
+  const RadioItem({
+    required this.text,
+    required this.data,
+  });
+}
+
+class ButtonRadio<T> extends StatefulWidget {
+  final T? initialValue;
+  final List<RadioItem<T>> items;
+  final void Function(T) onChanged;
+  final EdgeInsets? padding;
+
+  const ButtonRadio({
+    Key? key,
+    this.initialValue,
+    required this.items,
+    required this.onChanged,
+    this.padding,
+  }) : super(key: key);
+
+  @override
+  State<ButtonRadio<T>> createState() => _ButtonRadioState<T>();
+}
+
+class _ButtonRadioState<T> extends State<ButtonRadio<T>> {
+  late T _selectedValue;
+
+  @override
+  void initState() {
+    assert(widget.items.isNotEmpty);
+    _selectedValue = widget.initialValue ?? widget.items.first.data;
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Wrap(
+      children: [
+        for (final item in widget.items)
+          Padding(
+            padding: widget.padding ?? rightPadding8 + bottomPadding8,
+            child: InkWell(
+              onTap: () {
+                setState(() {
+                  _selectedValue = item.data;
+                });
+                widget.onChanged(_selectedValue);
+              },
+              child: Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Radio<T>(
+                    value: item.data,
+                    groupValue: _selectedValue,
+                    onChanged: (T? value) {
+                      if (value != null) {
+                        setState(() {
+                          _selectedValue = value;
+                        });
+                        widget.onChanged(_selectedValue);
+                      }
+                    },
+                    materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+                    visualDensity: const VisualDensity(
+                      horizontal: VisualDensity.minimumDensity,
+                      vertical: VisualDensity.minimumDensity,
+                    ),
+                  ),
+                  Flexible(
+                    child: Text(item.text),
+                  ),
+                ],
+              ),
+            ),
+          ),
+      ],
+    );
+  }
+}