Flutter showModalBottomSheet改变高度

showModalBottomSheet改变高度

  • 将isScrollControlled设置为true,此时弹窗会全屏展示,再返回一个带高度的SizedBox,就可以指定弹窗的高度了
showModalBottomSheet(
        context: context,
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
                topLeft: Radius.circular(25), topRight: Radius.circular(25))),
        isScrollControlled: true,
        builder: (context) {
          ScrollController controller = ScrollController(
              initialScrollOffset: selIndex == null
                  ? 0
                  : selIndex == -1
                      ? 0
                      : selIndex * 40);
          return SizedBox(
              height: 400.h,
              child: ListView(
                  controller: controller,
                  children: list
                      ?.asMap()
                      .map((i, e) {
                        return MapEntry(
                            i,
                            LocationItems(
                              name: isList == false ? e['name'] : e,
                              isSelected: i == selIndex,
                            ));
                      })
                      .values
                      .toList() as List<Widget>));
        })
  • 如果想要自适应高度就设置isScrollControlled为true并用SingleChildScrollView嵌套Column或者用Container包裹住ListView

参考:https://blog.csdn.net/qq_28865297/article/details/104776222
https://www.jianshu.com/p/39cfc6cccc02

posted @ 2021-11-18 15:48  R1cardo  阅读(1426)  评论(0编辑  收藏  举报