如何在 Flutter 中更新 ModalBottomSheet 的状态

发布于06月11日

这段代码非常简单:显示一个模式的底部板材，当用户单击按钮时，板材的高度会增加10.

但什么都没发生.实际上，只有当用户用手指"滑动"底部的工作表时，它才会更新其大小(我相信滑动会导致工作表上的内部setState).

我的问题是:如何调用ModalBottomSheet的更新状态？

showModalBottomSheet(
    context: context,
    builder: (context) {
      return Container(
        height: heightOfModalBottomSheet,
        child: RaisedButton(

            onPressed: () {
              setState(() {
                heightOfModalBottomSheet += 10;
              });

            }),
      );
    });

推荐答案

你也许可以使用ScaffoldState路中的showBottomSheet路.阅读更多关于这个展会底单的here多篇文章.

这将显示BottomSheet并返回控制器PersistentBottomSheetController.使用此控制器，您可以调用controller.SetState((){})，它将重新呈现BottomSheet.

下面是一个例子

PersistentBottomSheetController _controller; // <------ Instance variable
final _scaffoldKey = GlobalKey<ScaffoldState>(); // <---- Another instance variable
.
.
.
void _incrementBottomSheet(){
    _controller.setState(
        (){
            heightOfModalBottomSheet += 10;
        }
    )
}
.
void _createBottomSheet() async{
  _controller = await _scaffoldKey.currentState.showBottomSheet(
        context: context,
        builder: (context) {
           return Container(
               height: heightOfModalBottomSheet,
               child: RaisedButton(
               onPressed: () {
                  _incrementBottomSheet()
              }),
         );
      });
}