Flutter输入时如何让BottomSheet显示在键盘上方

要让BottomSheet在弹出键盘时自动上移并支持滚动，只需做两处修改：

1. 开启BottomSheet的滚动控制 #

调用showModalBottomSheet时，添加isScrollControlled: true参数，让BottomSheet能根据键盘高度自适应调整尺寸：

floatingActionButton: FloatingActionButton(
  onPressed: (){
    showModalBottomSheet<void>(
      context: context,
      isScrollControlled: true, // 新增该参数
      builder: (context){
        return EntryForm();
      });
  },
  child: Icon(Icons.add),
),

2. 给滚动视图添加键盘内边距 #

在EntryForm的SingleChildScrollView中，通过MediaQuery获取键盘高度并设置底部内边距，确保输入框不被遮挡，同时支持内容滚动：

class _EntryFormState extends State<EntryForm> {
  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      padding: EdgeInsets.only(
        bottom: MediaQuery.of(context).viewInsets.bottom, // 新增底部内边距
      ),
      child: Column(
        children: [
          TextField(),
          TextField(),
          ElevatedButton(onPressed: (){}, child: Text('Save Record'))
        ],
      ),
    );
  }
}

修改完成后，点击TextField唤起键盘时，BottomSheet会自动上移适配键盘高度，内容也能通过滚动查看完整区域。

内容的提问来源于stack exchange，提问作者Irfan Ganatra