当前位置:   article > 正文

Flutter - showModalBottomSheet 自定义高度 和 TextField 输入框,键盘弹出的bug_flutter如何在键盘未弹出时获就取键盘高度

flutter如何在键盘未弹出时获就取键盘高度

如何自定义 showModalBottomSheet 的高度

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

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

showModalBottomSheet(
  isScrollControlled:true,
  context: context,
  backgroundColor: Colors.transparent,
  builder: (BuildContext context) {
  
    double height = 240;
    return SizedBox(
      child: content,
      height: height,
    );
  }
);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

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

在builder 中返回的组件用 AnimatedPadding 包裹即可。

showModalBottomSheet(
  isScrollControlled:true,
  context: context,
  backgroundColor: Colors.transparent,
  builder: (BuildContext context) {
  
    double height = 240;
    return AnimatedPadding(
      padding: MediaQuery.of(context).viewInsets,
      duration: const Duration(milliseconds: 100),
      child: SizedBox(
        child: content,
        height: height,
      )
    );
  }
);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/268682
推荐阅读
相关标签
  

闽ICP备14008679号