Browse Source

[infra_ui][overlay] Implement list overlay

Jaylen Bian 3 years ago
parent
commit
051240a2fb

+ 3 - 0
app_flowy/packages/flowy_infra_ui/lib/basis.dart

@@ -3,3 +3,6 @@ import 'package:flutter/material.dart';
 // MARK: - Shared Builder
 
 typedef WidgetBuilder = Widget Function();
+
+typedef IndexedCallback = void Function(int index);
+typedef IndexedValueCallback<T> = void Function(T value, int index);

+ 99 - 0
app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart

@@ -0,0 +1,99 @@
+import 'package:flowy_infra_ui/flowy_infra_ui_web.dart';
+import 'package:flutter/material.dart';
+
+class ListOverlay extends StatelessWidget {
+  const ListOverlay({
+    Key? key,
+    required this.itemBuilder,
+    this.itemCount,
+    this.controller,
+    this.maxWidth = double.infinity,
+    this.maxHeight = double.infinity,
+  }) : super(key: key);
+
+  final IndexedWidgetBuilder itemBuilder;
+  final int? itemCount;
+  final ScrollController? controller;
+  final double maxWidth;
+  final double maxHeight;
+
+  static void showWithAnchor(
+    BuildContext context, {
+    required String identifier,
+    required IndexedWidgetBuilder itemBuilder,
+    int? itemCount,
+    ScrollController? controller,
+    double maxWidth = double.infinity,
+    double maxHeight = double.infinity,
+    required BuildContext anchorContext,
+    AnchorDirection? anchorDirection,
+    FlowyOverlayDelegate? delegate,
+    OverlapBehaviour? overlapBehaviour,
+  }) {
+    FlowyOverlay.of(context).insertWithAnchor(
+      widget: ListOverlay(
+        itemBuilder: itemBuilder,
+        itemCount: itemCount,
+        controller: controller,
+        maxWidth: maxWidth,
+        maxHeight: maxHeight,
+      ),
+      identifier: identifier,
+      anchorContext: anchorContext,
+      anchorDirection: anchorDirection,
+      delegate: delegate,
+      overlapBehaviour: overlapBehaviour,
+    );
+  }
+
+  static void showWithRect(
+    BuildContext context, {
+    required BuildContext anchorContext,
+    required String identifier,
+    required IndexedWidgetBuilder itemBuilder,
+    int? itemCount,
+    ScrollController? controller,
+    double maxWidth = double.infinity,
+    double maxHeight = double.infinity,
+    required Offset anchorPosition,
+    required Size anchorSize,
+    AnchorDirection? anchorDirection,
+    FlowyOverlayDelegate? delegate,
+    OverlapBehaviour? overlapBehaviour,
+  }) {
+    FlowyOverlay.of(context).insertWithRect(
+      widget: ListOverlay(
+        itemBuilder: itemBuilder,
+        itemCount: itemCount,
+        controller: controller,
+        maxWidth: maxWidth,
+        maxHeight: maxHeight,
+      ),
+      identifier: identifier,
+      anchorPosition: anchorPosition,
+      anchorSize: anchorSize,
+      anchorDirection: anchorDirection,
+      delegate: delegate,
+      overlapBehaviour: overlapBehaviour,
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      constraints: BoxConstraints.tight(Size(maxWidth, maxHeight)),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: const BorderRadius.all(Radius.circular(6)),
+        boxShadow: [
+          BoxShadow(color: Colors.black.withOpacity(0.1), spreadRadius: 1, blurRadius: 20.0),
+        ],
+      ),
+      child: ListView.builder(
+        shrinkWrap: true,
+        itemBuilder: itemBuilder,
+        itemCount: itemCount,
+      ),
+    );
+  }
+}