Question

我的页面底下是纸。我想在单击它时将其关闭，如何实现？

我正在这样做：

return new Directionality(
  textDirection: TextDirection.rtl,
  child: new Theme(
    data: theme,
    child: new Scaffold(
      bottomSheet: Container(
        height: MediaQuery.of(context).size.height / 3 + 35,
        color:
            Color(0x00737373), // This line set the transparent background
        child: Padding(
          padding: EdgeInsets.only(right: 10.0, left: 10.0),
          child: Container(
              height: double.infinity,
              width: double.infinity,
              decoration: BoxDecoration(
                  color: Color(0xcc2BA04F),
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(16.0),
                      topRight: Radius.circular(16.0))),
              child: ....
              )),
        ),
      ),
      body: 
        ...

如果我在底页外面触摸，默认情况下不会关闭。在外部点击时如何使其消失？

Answer 1

这里是执行此操作的示例。

void showBottomSheet() {
  showModalBottomSheet(
              context: context,
              builder: (context) {
                return Container(
                  height: MediaQuery.of(context).size.height / 3 + 35,
                  color: Color(0x00737373), // This line set the transparent background
                  child: Padding(
                      padding: EdgeInsets.only(right: 10.0, left: 10.0),
                      child: Container(
                        height: double.infinity,
                        width: double.infinity,
                        decoration: BoxDecoration(
                            color: Color(0xcc2BA04F), borderRadius: BorderRadius.only(topLeft: Radius.circular(16.0), topRight: Radius.circular(16.0))),
                      )),
                );
              });
}

这样打开页面时，您可以打开底部的纸

Timer.run(() {
  showBottomSheet();
}

您还可以使用addPostFrameCallback中的WidgetsBinding来执行此操作。

在底部轻敲时使底部消失

1 个答案: