Merge pull request #15 from robiness/adjust-bool-buttons

Adjust bool buttons
robiness · Jun 26, 2023 · bfb8a7b · bfb8a7b
2 parents ab4381b + eabb36a
commit bfb8a7b
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 33 deletions.
diff --git a/lib/src/field_configurators/bool_field_configurator.dart b/lib/src/field_configurators/bool_field_configurator.dart
@@ -1,5 +1,4 @@
-
-import 'package:flutter/widgets.dart';
+import 'package:flutter/material.dart';
 import 'package:stage_craft/src/field_configurators/field_configurator.dart';
 
 class BoolFieldConfiguratorNullable extends FieldConfigurator<bool?> {
@@ -47,26 +46,28 @@ class BoolFieldConfigurationWidget extends ConfigurationWidget<bool?> {
       mainAxisSize: MainAxisSize.min,
       children: [
         Expanded(
-          child: _ToggleButton(
+          child: BoolButton(
             isSelected: value == true,
             onTap: () => updateValue(true),
-            label: 'True',
+            label: 'true',
           ),
         ),
+        const SizedBox(width: 4),
         Expanded(
-          child: _ToggleButton(
+          child: BoolButton(
             isSelected: value == false,
             onTap: () => updateValue(false),
-            label: 'False',
+            label: 'false',
           ),
         ),
       ],
     );
   }
 }
 
-class _ToggleButton extends StatelessWidget {
-  const _ToggleButton({
+class BoolButton extends StatefulWidget {
+  const BoolButton({
+    super.key,
     required this.isSelected,
     required this.onTap,
     required this.label,
@@ -77,35 +78,35 @@ class _ToggleButton extends StatelessWidget {
   final String label;
 
   @override
-  Widget build(BuildContext context) {
-    bool isHovered = false;
+  State<BoolButton> createState() => _BoolButtonState();
+}
 
-    final fillColor = () {
-      if (isSelected) {
-        return const Color(0xFF195E96);
-      }
-      return isHovered ? const Color(0xFF195E96).withOpacity(0.3) : const Color(0x00000000);
-    }();
+class _BoolButtonState extends State<BoolButton> {
+  bool _isHovering = false;
 
+  @override
+  Widget build(BuildContext context) {
     return MouseRegion(
-      onEnter: (event) {
-        isHovered = true;
-      },
-      onExit: (event) {
-        isHovered = false;
-      },
-      cursor: SystemMouseCursors.click,
+      onEnter: (_) => setState(() => _isHovering = true),
+      onExit: (_) => setState(() => _isHovering = false),
+      cursor: widget.isSelected ? SystemMouseCursors.basic : SystemMouseCursors.click,
       child: GestureDetector(
-        onTap: onTap,
-        child: AnimatedContainer(
-          duration: const Duration(milliseconds: 200),
+        onTap: widget.onTap,
+        child: Container(
           decoration: BoxDecoration(
-            color: fillColor,
+            color: widget.isSelected || _isHovering ? Colors.blue.withOpacity(0.2) : Colors.transparent,
+            borderRadius: BorderRadius.circular(2),
+            border: Border.all(
+              color: widget.isSelected ? Colors.blue : Colors.grey,
+            ),
           ),
-          child: Center(
-            child: Padding(
-              padding: const EdgeInsets.symmetric(vertical: 8.0),
-              child: Text(label),
+          child: Padding(
+            padding: const EdgeInsets.all(4.0),
+            child: Center(
+              child: Text(
+                widget.label,
+                style: TextStyle(color: widget.isSelected ? Colors.blue : Colors.grey),
+              ),
             ),
           ),
         ),

diff --git a/lib/src/widgets/stage_craft.dart b/lib/src/widgets/stage_craft.dart
@@ -43,8 +43,11 @@ class StageCraft extends StatelessWidget {
           stageController: stageController,
           settings: settings,
         ),
-        ConfigurationBar(
-          controller: stageController,
+        Align(
+          alignment: Alignment.topCenter,
+          child: ConfigurationBar(
+            controller: stageController,
+          ),
         ),
       ],
     );