Flutter多行TextField光标被键盘遮挡，如何实现光标始终显示在键盘上方？

这个场景我太熟悉了，多行输入时光标跑到键盘下面确实影响体验，给你几个实用的解决思路，结合你的代码来调整：

方法一：动态设置scrollPadding+焦点监听 #

你代码里已经用到了scrollPadding，但可以改成跟随键盘高度动态调整，让滚动的底部内边距刚好避开键盘。同时监听焦点变化，确保获得焦点时光标自动滚动到可视区域：

1. 先修改TextField的scrollPadding：

scrollPadding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom + 20),

这里MediaQuery.of(context).viewInsets.bottom就是当前键盘的高度，加20是留一点缓冲空间。

2. 在页面的initState里给focusNode添加监听，确保获得焦点后自动滚动到光标位置：

@override
void initState() {
  super.initState();
  textFocusNode.addListener(() {
    if (textFocusNode.hasFocus) {
      // 延迟执行，确保键盘已经完全弹出
      WidgetsBinding.instance.addPostFrameCallback((_) {
        // 强制更新光标选中状态，触发滚动
        textController.selection = TextSelection.fromPosition(
          TextPosition(offset: textController.text.length),
        );
        // 或者直接调用Scrollable的方法确保光标可见
        Scrollable.ensureVisible(
          context,
          duration: const Duration(milliseconds: 300),
          curve: Curves.easeOut,
        );
      });
    }
  });
}

方法二：用SingleChildScrollView包裹输入容器 #

如果你的输入区域所在的父组件没有滚动能力，把整个Container放到SingleChildScrollView里，这样键盘弹出时，整个页面可以滚动，自然就能让光标保持在键盘上方：

修改后的代码结构：

SingleChildScrollView(
  child: Container( 
    padding: EdgeInsets.symmetric(horizontal: 10), 
    width: width, 
    margin: EdgeInsets.fromLTRB(0, 0, 0, 10), 
    child: Material( 
      color: Colors.white, 
      borderRadius: BorderRadius.circular(20.0), 
      elevation: 12.0, 
      child: Padding( 
        padding: const EdgeInsets.symmetric( 
          horizontal: 20.0, 
          vertical: 10.0), 
        child: TextField( 
          focusNode: textFocusNode, 
          controller: textController, 
          decoration: InputDecoration.collapsed( 
            hintText: '', 
            hintStyle: TextStyle(fontSize: 20), 
            focusColor: Colors.black, 
          ), 
          scrollPadding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom + 20),
          keyboardType: TextInputType.multiline, 
          cursorColor: Colors.black, 
          maxLines: null, 
        ), 
      ), 
    ), 
  ),
)

额外注意点 #

• 确保你的输入页面是放在Scaffold的body里，Scaffold会自动处理键盘弹出时的布局偏移，这是基础前提。
• 如果你的页面有自定义的底部导航栏或者其他固定元素，可能需要额外调整viewInsets的计算，但上面的方法已经覆盖大部分常规场景。

内容的提问来源于stack exchange，提问作者Sedzani Ramathaga