Flutter - showModalBottomSheet 自定义高度 和 TextField 输入框,键盘弹出的bug
2020-04-13 17:49 浏览(854

如何自定义 showModalBottomSheet   的高度

设置属性 isScrollControlled 为 true,此时 showModalBottomSheet  是全屏

在builder 中返回带高度的 SizedBox 即可自定义高度

showModalBottomSheet(
  isScrollControlled:true,
  context: context,
  backgroundColor: Colors.white.withAlpha(0),
  builder: (BuildContext context) {
 
    double height = 240;
    return SizedBox(
      child: content,
      height: height,
    );
  }
);


showModalBottomSheet 中有输入框,键盘弹出内容被遮挡的问题

在builder 中返回的组件用 AnimatedPadding 包裹即可。(参考 https://juejin.im/post/5ce02760e51d45107d7cb846

showModalBottomSheet(
  isScrollControlled:true,
  context: context,
  backgroundColor: Colors.white.withAlpha(0),
  builder: (BuildContext context) {
 
    double height = 240;
    return AnimatedPadding(
      padding: MediaQuery.of(context).viewInsets,
      duration: const Duration(milliseconds: 100),
      child: SizedBox(
        child: content,
        height: height,
      )
    );
  }
);


评论(2)

ezindo

每一个努力的人都能在岁月中破茧成蝶福彩双色球,你要相信,有一天你将破蛹而出澳洲幸运20,成长得比人们期待的还要美丽,但这个过程会很痛,会很辛苦幸运飞艇,有时候还会觉得灰心。面对着汹涌而来的现实,觉得自己渺小无力,但这也是生命的一部分。做好现在你能做的,然后,一切都会好起来。

2-25 16:03 0 回复
发布评论
回复X
聊天室(0