Flutter底部彈窗及修改彈窗最大高度

在Flutter中,想要實現底部彈窗只需要調用這個方法:

showModalBottomSheet(context: null, builder: null)

具體使用方法:

showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return Container(
            color: Colors.transparent,
            height: 120,
            child: new Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                new ListTile(
                  title: Text('拍照'),
                  onTap: () {
                    _takePhoto();
                    Navigator.pop(context);
                  },
                ),
                new ListTile(
                  title: Text('從相冊中選擇'),
                  onTap: () {
                    _openGallery();
                    Navigator.pop(context);
                  },
                ),
              ],
            ),
          );
        });

在build方法中可以自己隨意編寫ui,但是flutter默認在底部彈窗最大高度做了限制,不能超過屏幕高度的9/16。具體可以在源碼中看出:

@override
  BoxConstraints getConstraintsForChild(BoxConstraints constraints) {
    return BoxConstraints(
      minWidth: constraints.maxWidth,
      maxWidth: constraints.maxWidth,
      minHeight: 0.0,
      maxHeight: constraints.maxHeight * 9.0 / 16.0,
    );
  }

所以如果想要突破這個限制的高度,可以直接修改源碼:

maxHeight: constraints.maxHeight

歡迎新人大佬進羣交流指導:187670882

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章