You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

升级Flutter 3.10后:键盘弹出页面不滚动/ResizeToAvoidBottomInset失效

Flutter 3.10.0 + Dart 3 Android 键盘弹出时页面无法滚动的解决方案

以下是针对该问题的几种可行修复方案,按优先级尝试:

1. 修正滚动视图与Scaffold的嵌套逻辑

确保SingleChildScrollView作为Scaffold的直接body,且移除子组件中强制占满空间的Expanded/Flexible(这类组件会导致滚动视图无法正确计算可滚动区域):

Scaffold(
  resizeToAvoidBottomInset: true,
  body: SingleChildScrollView(
    child: Column(
      children: [
        // 页面内容(包含文本框等组件)
        TextField(decoration: InputDecoration(hintText: "测试输入框")),
        // 避免使用Expanded/Flexible包裹子项
      ],
    ),
  ),
)

2. 手动处理键盘Insets

通过MediaQuery监听键盘高度,动态调整滚动视图的底部内边距,确保文本框不会被键盘遮挡且可滚动:

final bottomInset = MediaQuery.of(context).viewInsets.bottom;

return Scaffold(
  body: SingleChildScrollView(
    padding: EdgeInsets.only(bottom: bottomInset),
    child: // 页面内容
  ),
);

如果需要平滑过渡效果,可改用AnimatedPadding:

AnimatedPadding(
  padding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom),
  duration: const Duration(milliseconds: 120),
  child: SingleChildScrollView(
    child: // 页面内容
  ),
)

3. 调整Android原生配置

在android/app/src/main/AndroidManifest.xml的activity标签中添加窗口软键盘模式配置,强制系统调整窗口大小:

<activity
    android:name=".MainActivity"
    android:windowSoftInputMode="adjustResize">
</activity>

同时确保android/app/build.gradle中的compileSdkVersion和targetSdkVersion升级到33及以上,匹配Flutter 3.10的Android兼容性要求。

4. 排查嵌套滚动冲突

若页面存在多层滚动组件嵌套(如ListView嵌套在SingleChildScrollView内),会导致滚动逻辑冲突。此时需将内部滚动组件替换为Column,或改用CustomScrollView统一管理滚动区域。

内容的提问来源于stack exchange,提问作者Adarsh Vijayan P

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.21 15:17:10