PAINTROID-639 Make tool options disappear when tapping the tool

Fix some issues from CR
Catrobat · Jan 16, 2024 · 0418ca3 · 0418ca3
1 parent f3bd8c3
commit 0418ca3
Show file tree

Hide file tree

Showing 8 changed files with 222 additions and 217 deletions.
diff --git a/lib/ui/drawing_space/bottom_nav_bar.dart b/lib/ui/drawing_space/bottom_nav_bar.dart
@@ -2,8 +2,9 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:paintroid/core/app_localizations.dart';
 import 'package:paintroid/tool/tool.dart';
+import 'package:paintroid/ui/drawing_space/bottom_nav_bar_items.dart';
+import 'package:paintroid/ui/drawing_space/tool_options_visibility_state_provider.dart';
 import 'package:paintroid/ui/drawing_space/tools_bottom_sheet.dart';
-import 'package:paintroid/ui/drawing_space/tool_options_provider.dart';
 import 'package:paintroid/ui/shared/bottom_nav_bar_icon.dart';
 import 'package:paintroid/ui/styles.dart';
 
@@ -12,7 +13,8 @@ class BottomNavBar extends ConsumerWidget {
 
   const BottomNavBar({Key? key}) : super(key: key);
 
-  void _onNavigationItemSelected(int index, BuildContext context, WidgetRef ref) {
+  void _onNavigationItemSelected(
+      int index, BuildContext context, WidgetRef ref) {
     BottomNavBarItem item = BottomNavBarItem.values[index];
     switch (item) {
       case BottomNavBarItem.TOOLS:
@@ -26,9 +28,22 @@ class BottomNavBar extends ConsumerWidget {
     }
   }
 
+  void showToolBottomSheet(BuildContext context) {
+    showModalBottomSheet(
+      context: context,
+      builder: (BuildContext context) => const SizedBox(
+        height: 270,
+        child: ToolsBottomSheet(),
+      ),
+    );
+  }
+
+  void handleToolOptionsVisibility(WidgetRef ref) {
+    ref.read(toolOptionsVisibilityStateProvider.notifier).toggleVisibility();
+  }
+
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-
     final localizations = AppLocalizations.of(context);
     return NavigationBarTheme(
       data: WidgetThemes.bottomNavBarThemeData,
@@ -74,25 +89,4 @@ class BottomNavBar extends ConsumerWidget {
       ),
     );
   }
-
-  void showToolBottomSheet(BuildContext context) {
-    showModalBottomSheet(
-      context: context,
-      builder: (BuildContext context) => const SizedBox(
-        height: 270,
-        child: ToolsBottomSheet(),
-      ),
-    );
-  }
-
-  void handleToolOptionsVisibility(WidgetRef ref) {
-    ref.read(toolOptionsProvider.notifier).toggleVisibility();
-  }
 }
-
-enum BottomNavBarItem {
-  TOOLS,
-  CURRENT_TOOL,
-  COLOR,
-  LAYERS,
-}
diff --git a/lib/ui/drawing_space/bottom_nav_bar_items.dart b/lib/ui/drawing_space/bottom_nav_bar_items.dart
@@ -0,0 +1,6 @@
+enum BottomNavBarItem {
+  TOOLS,
+  CURRENT_TOOL,
+  COLOR,
+  LAYERS,
+}
diff --git a/lib/ui/drawing_space/tool_option.dart b/lib/ui/drawing_space/tool_option.dart
@@ -0,0 +1,28 @@
+import 'package:flutter/material.dart';
+
+class ToolOption extends StatelessWidget {
+  final bool isIgnoring;
+  final double opacity;
+  final Widget child;
+  final Duration duration;
+
+  const ToolOption({
+    Key? key,
+    required this.isIgnoring,
+    required this.opacity,
+    required this.child,
+    this.duration = const Duration(milliseconds: 300),
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return IgnorePointer(
+      ignoring: isIgnoring,
+      child: AnimatedOpacity(
+        opacity: opacity,
+        duration: duration,
+        child: child,
+      ),
+    );
+  }
+}
diff --git a/lib/ui/drawing_space/tool_options.dart b/lib/ui/drawing_space/tool_options.dart
@@ -1,59 +1,40 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:paintroid/tool/src/toolbox/toolbox_state_provider.dart';
-import 'package:paintroid/ui/drawing_space/stroke_cap_tool_option.dart';
-import 'package:paintroid/ui/drawing_space/tool_options_provider.dart';
-import 'package:paintroid/ui/drawing_space/stroke_width_tool_option.dart';
-
-import 'package:paintroid/tool/src/tool_types.dart';
+import 'package:paintroid/tool/tool.dart';
+import 'package:paintroid/ui/drawing_space/tool_option.dart';
+import 'package:paintroid/ui/drawing_space/tool_options_config.dart';
+import 'package:paintroid/ui/drawing_space/tool_options_visibility_state_provider.dart';
 
 class ToolOptions extends ConsumerWidget {
   const ToolOptions({super.key});
-  final animationDuration = const Duration(milliseconds: 300);
   final maxOpacity = 1.0;
   final minOpacity = 0.0;
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    var options = getToolOptions(context, ref);
-    return  Padding(
-      padding: const EdgeInsets.all(8),
-      child: options,
-    );
-  }
-
-  Column getToolOptions(BuildContext context, WidgetRef ref) {
-    var tool = ref.watch(toolBoxStateProvider).currentTool;
-    switch (tool.type) {
-      case ToolType.BRUSH:
-      case ToolType.ERASER:
-        return defaultToolOptions(context, ref);
-      default:
-        return const Column();
-    }
-  }
-
-  Column defaultToolOptions(BuildContext context, WidgetRef ref) {
-    bool visible = ref.watch(toolOptionsProvider);
-    var opacity = visible ? maxOpacity : minOpacity;
-    var isIgnoring = !visible;
+    bool visible = ref.watch(toolOptionsVisibilityStateProvider);
 
-    return Column(
-      children: [
-        buildToolOption(isIgnoring, opacity, const StrokeWidthToolOption()),
-        const Spacer(),
-        buildToolOption(isIgnoring, opacity, const StrokeCapToolOption()),
-      ],
+    var currentToolType = ref.watch(
+      toolBoxStateProvider.select((value) => value.currentToolType),
     );
-  }
 
-  Widget buildToolOption(bool isIgnoring, double opacity, Widget child) {
-    return IgnorePointer(
-      ignoring: isIgnoring,
-      child: AnimatedOpacity(
-        opacity: opacity,
-        duration: animationDuration,
-        child: child,
+    List<Widget> toolSpecificOptions =
+        ToolOptionsConfig().getToolSpecificOptions(currentToolType);
+
+    return Padding(
+      padding: const EdgeInsets.all(8),
+      child: Column(
+        children: [
+          for (Widget option in toolSpecificOptions)
+            if (option is Spacer)
+              const Spacer()
+            else
+              ToolOption(
+                isIgnoring: !visible,
+                opacity: visible ? maxOpacity : minOpacity,
+                child: option,
+              ),
+        ],
       ),
     );
   }

diff --git a/lib/ui/drawing_space/tool_options_config.dart b/lib/ui/drawing_space/tool_options_config.dart
@@ -0,0 +1,30 @@
+import 'package:flutter/cupertino.dart';
+import 'package:paintroid/tool/src/tool_types.dart';
+import 'package:paintroid/ui/drawing_space/stroke_cap_tool_option.dart';
+import 'package:paintroid/ui/drawing_space/stroke_width_tool_option.dart';
+
+class ToolOptionsConfig {
+  static final ToolOptionsConfig _instance = ToolOptionsConfig._internal();
+
+  factory ToolOptionsConfig() {
+    return _instance;
+  }
+
+  ToolOptionsConfig._internal();
+
+  List<Widget> getToolSpecificOptions(ToolType toolType) {
+    switch (toolType) {
+      case ToolType.BRUSH:
+      case ToolType.ERASER:
+        return _defaultOptions;
+      default:
+        return [];
+    }
+  }
+
+  final List<Widget> _defaultOptions = [
+    const StrokeWidthToolOption(),
+    const Spacer(),
+    const StrokeCapToolOption(),
+  ];
+}
diff --git a/.../drawing_space/tool_options_provider.dart → ...ol_options_visibility_state_provider.dart b/.../drawing_space/tool_options_provider.dart → ...ol_options_visibility_state_provider.dart
@@ -1,9 +1,9 @@
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 
-part 'tool_options_provider.g.dart';
+part 'tool_options_visibility_state_provider.g.dart';
 
 @riverpod
-class ToolOptions extends _$ToolOptions {
+class ToolOptionsVisibilityState extends _$ToolOptionsVisibilityState {
   void toggleVisibility() {
     state = !state;
   }