Allow resizing schedule settings

lib/ui/views/schedule_view.dart

@@ -76,6 +76,11 @@ class _ScheduleViewState extends State<ScheduleView>
       ViewModelBuilder<ScheduleViewModel>.reactive(
         viewModelBuilder: () => ScheduleViewModel(
             intl: AppIntl.of(context)!, initialSelectedDate: widget.initialDay),
+        onModelReady: (model) {
+          if (model.settings.isEmpty) {
+            model.loadSettings();
+          }
+        },
         builder: (context, model, child) => BaseScaffold(
             isLoading: model.busy(model.isLoadingEvents),
             isInteractionLimitedWhileLoading: false,
@@ -511,14 +516,11 @@ class _ScheduleViewState extends State<ScheduleView>
             onPressed: () async {
               _analyticsService.logEvent(tag, "Settings clicked");
               await showModalBottomSheet(
-                  isDismissible: true,
-                  enableDrag: true,
-                  isScrollControlled: true,
-                  context: context,
                   shape: const RoundedRectangleBorder(
-                      borderRadius: BorderRadius.only(
-                          topLeft: Radius.circular(10),
-                          topRight: Radius.circular(10))),
+                      borderRadius:
+                          BorderRadius.vertical(top: Radius.circular(10))),
+                  context: context,
+                  isScrollControlled: true,
                   builder: (context) => const ScheduleSettings());
               model.loadSettings();
             }));

lib/ui/widgets/schedule_settings.dart

@@ -27,65 +27,80 @@ class _ScheduleSettingsState extends State<ScheduleSettings> {
 
   @override
   Widget build(BuildContext context) => ViewModelBuilder.reactive(
-        viewModelBuilder: () => ScheduleSettingsViewModel(),
-        builder: (context, model, child) => SizedBox(
-          height: MediaQuery.of(context).size.height * 0.50,
-          child: Column(
-            children: [
-              if (widget.showHandle)
-                Container(
-                  decoration: BoxDecoration(
-                      color: Utils.getColorByBrightness(
-                          context,
-                          AppTheme.lightThemeBackground,
-                          AppTheme.darkThemeBackground),
-                      borderRadius: const BorderRadius.only(
-                        topLeft: Radius.circular(40.0),
-                        topRight: Radius.circular(40.0),
-                      )),
-                  child: Center(
-                    child: Padding(
-                      padding: const EdgeInsets.only(top: 8.0),
-                      child: Container(
-                        height: 5,
-                        width: 50,
-                        decoration: const BoxDecoration(
-                            color: Colors.grey,
-                            borderRadius:
-                                BorderRadius.all(Radius.circular(8.0))),
+      viewModelBuilder: () => ScheduleSettingsViewModel(),
+      builder: (context, model, child) => ClipRRect(
+            borderRadius: const BorderRadius.vertical(top: Radius.circular(10)),
+            child: DraggableScrollableSheet(
+                maxChildSize: 0.85,
+                minChildSize: 0.5,
+                initialChildSize: 0.55,
+                expand: false,
+                snap: true,
+                snapSizes: const [
+                  0.55,
+                  0.85,
+                ],
+                builder: (context, ScrollController scrollController) {
+                  return Column(children: [
+                    if (widget.showHandle)
+                      Container(
+                        decoration: BoxDecoration(
+                          color: Utils.getColorByBrightness(
+                              context,
+                              AppTheme.lightThemeBackground,
+                              AppTheme.darkThemeBackground),
+                        ),
+                        child: Center(
+                          child: Padding(
+                            padding: const EdgeInsets.only(top: 8.0),
+                            child: Container(
+                              height: 5,
+                              width: 50,
+                              decoration: const BoxDecoration(
+                                  color: Colors.grey,
+                                  borderRadius:
+                                      BorderRadius.all(Radius.circular(8.0))),
+                            ),
+                          ),
+                        ),
+                      ),
+                    Container(
+                      width: MediaQuery.of(context).size.width,
+                      decoration: BoxDecoration(
+                        color: Utils.getColorByBrightness(
+                            context,
+                            AppTheme.lightThemeBackground,
+                            AppTheme.darkThemeBackground),
+                      ),
+                      child: Center(
+                        child: Padding(
+                            padding: const EdgeInsets.symmetric(vertical: 20),
+                            child: Text(
+                                AppIntl.of(context)!.schedule_settings_title,
+                                style: Theme.of(context).textTheme.headline6)),
                       ),
                     ),
-                  ),
-                ),
-              Container(
-                width: MediaQuery.of(context).size.width,
-                decoration: BoxDecoration(
-                  color: Utils.getColorByBrightness(
-                      context,
-                      AppTheme.lightThemeBackground,
-                      AppTheme.darkThemeBackground),
-                ),
-                child: Center(
-                  child: Padding(
-                      padding: const EdgeInsets.fromLTRB(15, 20, 20, 20),
-                      child: Text(AppIntl.of(context)!.schedule_settings_title,
-                          style: Theme.of(context).textTheme.headline6)),
-                ),
-              ),
-              Expanded(
-                child: ListTileTheme(
-                  selectedColor: Theme.of(context).textTheme.bodyText1!.color,
-                  child: ListView(
-                    key: const ValueKey("SettingsScrollingArea"),
-                    children: _buildSettings(
-                        context, model! as ScheduleSettingsViewModel),
-                  ),
-                ),
-              ),
-            ],
-          ),
-        ),
-      );
+                    Expanded(
+                      child: ListTileTheme(
+                        selectedColor:
+                            Theme.of(context).textTheme.bodyText1!.color,
+                        child: Card(
+                          margin: EdgeInsets.zero,
+                          elevation: 0,
+                          shape: const RoundedRectangleBorder(),
+                          color: Colors.transparent,
+                          child: ListView(
+                            controller: scrollController,
+                            key: const ValueKey("SettingsScrollingArea"),
+                            children: _buildSettings(
+                                context, model! as ScheduleSettingsViewModel),
+                          ),
+                        ),
+                      ),
+                    )
+                  ]);
+                }),
+          ));
 
   List<Widget> _buildSettings(
       BuildContext context, ScheduleSettingsViewModel model) {

pubspec.yaml

@@ -5,7 +5,7 @@ description: The 4th generation of ÉTSMobile, the main gateway between the Éco
 # pub.dev using `pub publish`. This is preferred for private packages.
 publish_to: 'none' # Remove this line if you wish to publish to pub.dev
 
-version: 4.34.0+1
+version: 4.35.0+1
 
 environment:
   sdk: ">=2.12.0 <3.0.0"

test/ui/widgets/schedule_settings_test.dart

@@ -98,6 +98,7 @@ void main() {
         expect(
             find.byWidgetPredicate((widget) =>
                 widget is Container &&
+                widget.decoration is BoxDecoration &&
                 (widget.decoration! as BoxDecoration).color == Colors.grey),
             findsOneWidget,
             reason: "The handle should be grey");
@@ -171,6 +172,20 @@ void main() {
             isA<Switch>().having((source) => source.value, 'value', isTrue),
             reason:
                 "the settings says that the showTodayBtn is enabled, the UI should reflet that.");
+
+        const screenHeight = 600;
+
+        final draggableScrollableSheetFinder =
+            find.byType(DraggableScrollableSheet);
+        expect(draggableScrollableSheetFinder, findsOneWidget);
+
+        final Size initialSize = tester.getSize(draggableScrollableSheetFinder);
+        expect(initialSize.height, 0.55 * screenHeight);
+
+        await tester.fling(
+            find.byType(ListView), const Offset(0.0, -4000.0), 400.0);
+        final Size maxSize = tester.getSize(draggableScrollableSheetFinder);
+        expect(maxSize.height, 0.85 * screenHeight);
       });
 
       testWidgets("Without handle", (WidgetTester tester) async {
@@ -184,6 +199,7 @@ void main() {
         expect(
             find.byWidgetPredicate((widget) =>
                 widget is Container &&
+                widget.decoration is BoxDecoration &&
                 (widget.decoration! as BoxDecoration).color == Colors.grey),
             findsNothing,
             reason: "There should not have a handle.");
@@ -256,6 +272,20 @@ void main() {
             isA<Switch>().having((source) => source.value, 'value', isTrue),
             reason:
                 "the settings says that the showTodayBtn is enabled, the UI should reflet that.");
+
+        const screenHeight = 600;
+
+        final draggableScrollableSheetFinder =
+            find.byType(DraggableScrollableSheet);
+        expect(draggableScrollableSheetFinder, findsOneWidget);
+
+        final Size initialSize = tester.getSize(draggableScrollableSheetFinder);
+        expect(initialSize.height, 0.55 * screenHeight);
+
+        await tester.fling(
+            find.byType(ListView), const Offset(0.0, -4000.0), 400.0);
+        final Size maxSize = tester.getSize(draggableScrollableSheetFinder);
+        expect(maxSize.height, 0.85 * screenHeight);
       });
     });
 
@@ -400,9 +430,8 @@ void main() {
             ListTile, intl.schedule_settings_show_today_btn_pref,
             skipOffstage: false);
 
-        expect(find.byType(Switch, skipOffstage: false), findsOneWidget);
-        // Currently the await tester.tap on a switch in a tile isn't working. Workaround:
-        (find.byType(Switch, skipOffstage: false).evaluate().single.widget
+        expect(find.byType(Switch, skipOffstage: false), findsNWidgets(2));
+        (find.byType(Switch, skipOffstage: false).evaluate().first.widget
                 as Switch)
             .onChanged!(false);