Overload footer with dragOptions

assets/schema/ensemble_schema.json

@@ -4432,8 +4432,46 @@
               "description": "The header widget for the menu"
             },
             "footer": {
-              "$ref": "#/$defs/Widget",
-              "description": "The footer widget for the menu"
+              "type": "object",
+              "properties": {
+                "style": {
+                  "$ref": "#/$defs/boxStyles"
+                },
+                "dragOptions": {
+                  "type": "object",
+                  "properties": {
+                    "enable": {
+                      "type": "boolean"
+                    },
+                    "initialSize": {
+                      "type": "number",
+                      "description": "Default it 0.5 i.e 50% of screen"
+                    },
+                    "minSize": {
+                      "type": "number",
+                      "description": "Minimum size of till sheet can go. Default is 0.25 i.e 25% of screen."
+                    },
+                    "maxSize": {
+                      "type": "number",
+                      "description": "Maximum size of till sheet can go. Default is 1 i.e 100% of screen."
+                    },
+                    "span": {
+                      "type": "boolean",
+                      "description": "Whether the widget should snap between [snapSizes] when the user lifts their finger during a drag."
+                    },
+                    "spanSizes": {
+                      "type": "array",
+                      "description": "The list of number each ranging from minSize to maxSize.",
+                      "items": {
+                        "type": "number"
+                      }
+                    }
+                  }
+                },
+                "children": {
+                  "$ref": "#/$defs/Widgets"
+                }
+              }
             }
           }
         }

lib/framework/view/page.dart

@@ -10,6 +10,8 @@ import 'package:ensemble/framework/view/bottom_nav_page_view.dart';
 import 'package:ensemble/framework/view/data_scope_widget.dart';
 import 'package:ensemble/framework/view/page_group.dart';
 import 'package:ensemble/framework/widget/icon.dart' as ensemble;
+import 'package:ensemble/layout/list_view.dart' as ensemblelist;
+import 'package:ensemble/layout/grid_view.dart' as ensembleGrid;
 import 'package:ensemble/page_model.dart';
 import 'package:ensemble/screen_controller.dart';
 import 'package:ensemble/util/utils.dart';
@@ -676,13 +678,46 @@ class PageState extends State<Page>
         ..borderColor = Utils.getColor(footerStyles?['borderColor'])
         ..borderWidth = Utils.optionalInt(footerStyles?['borderWidth']);
 
+      final dragOptions = pageModel.footer?.dragOptions;
+
+      final isDraggable =
+          Utils.getBool(dragOptions?['enable'], fallback: false);
+
       return AnimatedOpacity(
         opacity: 1.0,
         duration: const Duration(milliseconds: 500),
-        child: BoxWrapper(
-          boxController: boxController,
-          widget: scopeManager.buildWidget(pageModel.footer!.children.first),
-        ),
+        child: isDraggable
+            ? DraggableScrollableSheet(
+                initialChildSize:
+                    Utils.getDouble(dragOptions?['initialSize'], fallback: 0.5),
+                minChildSize:
+                    Utils.getDouble(dragOptions?['minSize'], fallback: 0.25),
+                maxChildSize:
+                    Utils.getDouble(dragOptions?['maxSize'], fallback: 1),
+                expand: Utils.getBool(dragOptions?['expand'], fallback: false),
+                snap: Utils.getBool(dragOptions?['span'], fallback: false),
+                snapSizes: Utils.getList<double>(dragOptions?['snapSizes']),
+                builder:
+                    (BuildContext context, ScrollController scrollController) {
+                  dynamic child = scopeManager
+                      .buildWidget(pageModel.footer!.children.first);
+
+                  if (child is ensemblelist.ListView ||
+                      child is ensembleGrid.GridView) {
+                    child.setProperty("controller", scrollController);
+                  }
+
+                  return BoxWrapper(
+                    widget: child,
+                    boxController: boxController,
+                  );
+                },
+              )
+            : BoxWrapper(
+                boxController: boxController,
+                widget:
+                    scopeManager.buildWidget(pageModel.footer!.children.first),
+              ),
       );
     }
     return null;

lib/layout/grid_view.dart

@@ -74,6 +74,10 @@ class GridView extends StatefulWidget
           EnsembleAction.fromYaml(funcDefinition, initiator: this),
       'reverse': (value) =>
           _controller.reverse = Utils.getBool(value, fallback: false),
+      'scrollController': (value) {
+        if (value is! ScrollController) return null;
+        return _controller.scrollController = value;
+      },
     };
   }
 
@@ -96,6 +100,7 @@ class GridViewController extends BoxController with HasPullToRefresh {
   int selectedItemIndex = -1;
   EnsembleAction? onScrollEnd;
   bool reverse = false;
+  ScrollController? scrollController;
 
   // single number, 3 numbers (small, medium, large), or 5 numbers (xSmall, small, medium, large, xLarge)
   // min 1, max 5

lib/layout/list_view.dart

@@ -58,6 +58,10 @@ class ListView extends StatefulWidget
           EnsembleAction.fromYaml(funcDefinition, initiator: this),
       'reverse': (value) =>
           _controller.reverse = Utils.getBool(value, fallback: false),
+      'controller': (value) {
+        if (value is! ScrollController) return null;
+        return _controller.scrollController = value;
+      },
     };
   }
 
@@ -85,6 +89,7 @@ class ListViewController extends BoxLayoutController {
   EdgeInsets? separatorPadding;
   EnsembleAction? onScrollEnd;
   bool reverse = false;
+  ScrollController? scrollController;
 }
 
 class ListViewState extends WidgetState<ListView>
@@ -119,6 +124,7 @@ class ListViewState extends WidgetState<ListView>
     }
 
     Widget listView = flutter.ListView.separated(
+        controller: widget._controller.scrollController,
         padding: widget._controller.padding ?? const EdgeInsets.all(0),
         scrollDirection: Axis.vertical,
         physics: widget._controller.onPullToRefresh != null

lib/page_model.dart

@@ -172,7 +172,10 @@ class SinglePageModel extends PageModel {
       footer = Footer(
         ViewUtil.buildModels(
             viewMap['footer']['children'], customViewDefinitions),
-        Utils.getMap(viewMap['footer']['styles']),
+        Utils.getMap(
+          viewMap['footer']['styles'],
+        ),
+        Utils.getMap(viewMap['footer']['dragOptions']),
       );
     }
 
@@ -345,7 +348,8 @@ class HeaderModel {
 class Footer {
   final List<WidgetModel> children;
   final Map<String, dynamic>? styles;
-  Footer(this.children, this.styles);
+  final Map<String, dynamic>? dragOptions;
+  Footer(this.children, this.styles, this.dragOptions);
 }
 
 enum PageType { regular, modal }

lib/util/utils.dart

@@ -260,9 +260,9 @@ class Utils {
     return optionalDouble(value, min: min, max: max) ?? fallback;
   }
 
-  static List<dynamic>? getList(dynamic value) {
+  static List<T>? getList<T>(dynamic value) {
     if (value is YamlList) {
-      List<dynamic> results = [];
+      List<T> results = [];
       for (var item in value) {
         results.add(item);
       }