Add YaruRadio (#360)

* Extract tooglable generic stuff from YaruCheckbox * Add YaruRadio * Update related golden tests * Add golden and functional tests * Add missing comma * Assert value != null if toggleable is false * Resize checkradios 22px -> 20px (keep same real size)
ubuntu · Nov 3, 2022 · 06c407b · 06c407b
1 parent 766e2c3
commit 06c407b
Show file tree

Hide file tree

Showing 126 changed files with 686 additions and 340 deletions.
diff --git a/example/lib/pages/controls_page.dart b/example/lib/pages/controls_page.dart
@@ -9,30 +9,49 @@ class ControlsPage extends StatefulWidget {
 }
 
 class _ControlsPageState extends State<ControlsPage> {
-  final List<bool?> _values = [false, null, true];
+  final List<bool?> _checkboxValues = [false, null, true];
+  int? _radioValue = 1;
 
   @override
   Widget build(BuildContext context) {
     return ListView(
       padding: const EdgeInsets.all(kYaruPagePadding),
       children: [
-        for (var i = 0; i < _values.length; ++i) ...[
-          Center(
-            child: Row(
-              children: [
-                YaruCheckbox(
-                  value: _values[i],
-                  onChanged: (v) => setState(() => _values[i] = v),
-                  tristate: true,
-                ),
-                const SizedBox(width: 10),
-                YaruCheckbox(
-                  value: _values[i],
-                  onChanged: null,
-                  tristate: true,
-                )
-              ],
-            ),
+        for (var i = 0; i < _checkboxValues.length; ++i) ...[
+          Row(
+            children: [
+              YaruCheckbox(
+                value: _checkboxValues[i],
+                onChanged: (v) => setState(() => _checkboxValues[i] = v),
+                tristate: true,
+              ),
+              const SizedBox(width: 10),
+              YaruCheckbox(
+                value: _checkboxValues[i],
+                onChanged: null,
+                tristate: true,
+              )
+            ],
+          ),
+          const SizedBox(height: 10),
+        ],
+        for (var i = 0; i < 3; ++i) ...[
+          Row(
+            children: [
+              YaruRadio<int>(
+                value: i,
+                groupValue: _radioValue,
+                onChanged: (v) => setState(() => _radioValue = v),
+                toggleable: true,
+              ),
+              const SizedBox(width: 10),
+              YaruRadio<int>(
+                value: i,
+                groupValue: _radioValue,
+                onChanged: null,
+                toggleable: true,
+              ),
+            ],
           ),
           const SizedBox(height: 10),
         ],

diff --git a/example/lib/pages/radio_button_page.dart b/example/lib/pages/radio_button_page.dart
@@ -9,7 +9,7 @@ class RadioButtonPage extends StatefulWidget {
 }
 
 class _RadioButtonPageState extends State<RadioButtonPage> {
-  int _value = 0;
+  int? _value = 0;
 
   @override
   Widget build(BuildContext context) {
@@ -20,7 +20,8 @@ class _RadioButtonPageState extends State<RadioButtonPage> {
           YaruRadioButton<int>(
             value: i,
             groupValue: _value,
-            onChanged: (v) => setState(() => _value = v!),
+            onChanged: (v) => setState(() => _value = v),
+            toggleable: true,
             title: const Text('YaruRadioButton'),
           ),
           const SizedBox(height: 10),

diff --git a/lib/src/constants.dart b/lib/src/constants.dart
@@ -13,3 +13,7 @@ const kYaruButtonRadius = 6.0;
 /// The default breakpoint width [YaruMasterDetailPage] uses for switching
 /// between portrait and landscape modes.
 const kYaruMasterDetailBreakpoint = 620.0;
+
+// Used by tooglable widgets to resize the canvas on active state
+// Need to be an even number
+const kCheckRadioActiveResizeFactor = 2;