flutter - 显示 Bottom Sheet 时，有没有办法在屏幕上保持事件的 GestureDetector？

Question

我正在使用 GetX显示 bottomSheet 的包。

我希望用户能够在我的 Bottom Sheet 打开时点击屏幕，如下图所示。

我该怎么做？

Answer 1

答案是否

---

为什么？

根据 the Flutter documentation :

A modal bottom sheet is an alternative to a menu or a dialog and prevents the user from interacting with the rest of the app.

Bottom Sheet 单的主要目的是防止用户与应用的其余部分进行交互。

---

我们如何克服这个问题？

使用 persistent bottom sheet ，即使用 showBottomSheet。

A closely related widget is a persistent bottom sheet, which shows information that supplements the primary content of the app without preventing the user from interacting with the app.

输出:

代码:

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: showSheet(),
      ),
    );
  }
}

class showSheet extends StatefulWidget {
  const showSheet({Key? key}) : super(key: key);

  @override
  State<showSheet> createState() => _showSheetState();
}

class _showSheetState extends State<showSheet> {
  void displayPersistentBottomSheet() {
    Scaffold.of(context).showBottomSheet<void>((BuildContext context) {
      return Container(
        color: Colors.amber,
        height: 200,   // 👈 Change this according to your need
        child: const Center(child: Text("Image Filter Here")),
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: FilledButton(
        onPressed: displayPersistentBottomSheet,
        child: const Text(
          'Draggable Widget Here',
          style: TextStyle(color: Colors.white),
        ),
      ),
    );
  }
}

---

可以用Getx完成吗？

很遗憾不，因为getx 仅支持bottomShet，它是Modal Bottom Sheet 的替代品 并且没有任何替代方法可以替代持久性 Bottom Sheet 。