Fix: broken pop dialog (#293)

* fix: broken pop dialog In `feedback-widget`, replaced the wrap around the `theme` with an Overlay widget instead of the `navigation`. The Navigation widget intercept the back action in general app navigation and prevent dialogs from popping * fix: feedback-builder request a navigator ancestor Wrap the feedback-builder with a Navigation ancestor to avoid error * example: add buttons to open dialog in example Add two buttons to open a test alert-dialog. - The first one in the base screen to handle the `normal` flow of navigation and test the open/close option with back action - The second one in the custom-feedback to test the behavior of open a dialog with a custom navigator
ueman · Apr 18, 2024 · 394ee5b · 394ee5b
1 parent f159819
commit 394ee5b
Show file tree

Hide file tree

Showing 4 changed files with 208 additions and 166 deletions.
diff --git a/feedback/example/lib/custom_feedback.dart b/feedback/example/lib/custom_feedback.dart
@@ -90,22 +90,41 @@ class _CustomFeedbackFormState extends State<CustomFeedbackForm> {
                         child: Text('*'),
                       ),
                       Flexible(
-                        child: DropdownButton<FeedbackType>(
-                          value: _customFeedback.feedbackType,
-                          items: FeedbackType.values
-                              .map(
-                                (type) => DropdownMenuItem<FeedbackType>(
-                                  value: type,
-                                  child: Text(type
-                                      .toString()
-                                      .split('.')
-                                      .last
-                                      .replaceAll('_', ' ')),
-                                ),
-                              )
-                              .toList(),
-                          onChanged: (feedbackType) => setState(() =>
-                              _customFeedback.feedbackType = feedbackType),
+                        child: Row(
+                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                          children: [
+                            DropdownButton<FeedbackType>(
+                              value: _customFeedback.feedbackType,
+                              items: FeedbackType.values
+                                  .map(
+                                    (type) => DropdownMenuItem<FeedbackType>(
+                                      value: type,
+                                      child: Text(type
+                                          .toString()
+                                          .split('.')
+                                          .last
+                                          .replaceAll('_', ' ')),
+                                    ),
+                                  )
+                                  .toList(),
+                              onChanged: (feedbackType) => setState(() =>
+                                  _customFeedback.feedbackType = feedbackType),
+                            ),
+                            ElevatedButton(
+                              child: const Text('Open Dialog #2'),
+                              onPressed: () {
+                                showDialog<dynamic>(
+                                  context: context,
+                                  builder: (_) {
+                                    return AlertDialog(
+                                      title: const Text("Dialog #2"),
+                                      content: Container(),
+                                    );
+                                  },
+                                );
+                              },
+                            ),
+                          ],
                         ),
                       ),
                     ],

diff --git a/feedback/example/lib/main.dart b/feedback/example/lib/main.dart
@@ -92,11 +92,10 @@ class MyHomePage extends StatelessWidget {
         child: Container(color: Colors.blue),
       ),
       body: Padding(
-        padding: const EdgeInsets.all(24),
+        padding: const EdgeInsets.symmetric(horizontal: 24.0, vertical: 12.0),
         child: SingleChildScrollView(
           child: Column(
             children: <Widget>[
-              const SizedBox(height: 10),
               const MarkdownBody(
                 data: '# How does it work?\n'
                     '1. Just press the `Provide feedback` button.\n'
@@ -189,6 +188,21 @@ class MyHomePage extends StatelessWidget {
                   launchUrl(Uri.parse('https://pub.dev/packages/feedback'));
                 },
               ),
+              const SizedBox(height: 10),
+              ElevatedButton(
+                child: const Text('Open Dialog #1'),
+                onPressed: () {
+                  showDialog<dynamic>(
+                    context: context,
+                    builder: (_) {
+                      return AlertDialog(
+                        title: const Text("Dialog #1"),
+                        content: Container(),
+                      );
+                    },
+                  );
+                },
+              ),
             ],
           ),
         ),

diff --git a/feedback/lib/src/feedback_bottom_sheet.dart b/feedback/lib/src/feedback_bottom_sheet.dart
@@ -3,7 +3,6 @@
 import 'package:feedback/src/better_feedback.dart';
 import 'package:feedback/src/theme/feedback_theme.dart';
 import 'package:feedback/src/utilities/back_button_interceptor.dart';
-
 import 'package:flutter/material.dart';
 
 /// Shows the text input in which the user can describe his feedback.
@@ -39,7 +38,17 @@ class FeedbackBottomSheet extends StatelessWidget {
           color: FeedbackTheme.of(context).feedbackSheetColor,
           // Pass a null scroll controller because the sheet is not drag
           // enabled.
-          child: feedbackBuilder(context, onSubmit, null),
+          child: Navigator(
+            onGenerateRoute: (_) {
+              return MaterialPageRoute<void>(
+                builder: (_) => feedbackBuilder(
+                  context,
+                  onSubmit,
+                  null,
+                ),
+              );
+            },
+          ),
         ),
       ),
     );
@@ -122,10 +131,16 @@ class _DraggableFeedbackSheetState extends State<_DraggableFeedbackSheet> {
                   color: FeedbackTheme.of(context).feedbackSheetColor,
                   // A `ListView` makes the content here disappear.
                   child: DefaultTextEditingShortcuts(
-                    child: widget.feedbackBuilder(
-                      context,
-                      widget.onSubmit,
-                      scrollController,
+                    child: Navigator(
+                      onGenerateRoute: (_) {
+                        return MaterialPageRoute<void>(
+                          builder: (_) => widget.feedbackBuilder(
+                            context,
+                            widget.onSubmit,
+                            scrollController,
+                          ),
+                        );
+                      },
                     ),
                   ),
                 ),