flutter 拍打打开作为 Package 内容物的底部片材,然后设置最大高度

gzszwxb4  于 2022-11-30  发布在  Flutter
关注(0)|答案(2)|浏览(110)

当底部表单出现时,它没有那么多的高度。但当在底部表单中单击复选框时,它将扩展到顶部,而不考虑屏幕大小。我一直在尝试做的是设置底部表单的最大高度。到目前为止,还没有找到合适的解决方案。欢迎提供任何帮助!
ps:我一直在尝试做的是打开底部工作表对话框作为 Package 内容最初。复选框被选中后,其高度应该有最大值。换句话说,我想扩大它关于底部工作表的最大高度,将给予。
参议员:
1.底部模型应打开为wrap_content
1.当点击底部表单中的项目时,底部表单的高度应更改为特定值。

ve7v8dk2

ve7v8dk21#

更新日期:

您需要使用StatefulBuilder更新底部表单的状态
下面是示例代码

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  bool setToMaxHeight = false;

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        child: const Text('showModalBottomSheet'),
        onPressed: () {
          showModalBottomSheet<void>(
            isScrollControlled: true,
            context: context,
            builder: (BuildContext context) {
              return StatefulBuilder(builder: (BuildContext context,
                  StateSetter setState) { //this
                return Container(
                  height: setToMaxHeight ? 600 : 300, //this
                  color: Colors.amber,
                  child: Center(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      mainAxisSize: MainAxisSize.min,
                      children: <Widget>[
                        Text('Max Height: ${setToMaxHeight ? 600 : 300}'),
                        const SizedBox(height: 12),
                        ElevatedButton(
                          child: const Text('Toggle BottomSheet Size'),
                          onPressed: () {
                            setState(() {
                              setToMaxHeight = !setToMaxHeight;
                            }); //this

                          },
                        ),
                        const SizedBox(height: 12),
                        ElevatedButton(
                          child: const Text('Close BottomSheet'),
                          onPressed: () => Navigator.pop(context),
                        ),
                      ],
                    ),
                  ),
                );
              });
            },
          );
        },
      ),
    );
  }
}

记下isScrollControlled属性并将其设置为true

mspsb9vt

mspsb9vt2#

对于底部图纸,需要设置图纸的高度。
和设置高度之前设置启用此选项

isScrollControlled: true,

height: MediaQuery.of(context).size.height - 100,

相关问题