dart - 在外面敲击时使底部工作表消失

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

调用 showBottomSheet() 显示工作表。

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.circular(20)),
          ),
        ),
      );
    },
  );
}