颤动-插入文本时,文本字段内容不会自动滚动文本、字段、内容

2023-09-03 09:36:27 作者:你用黄瓜当神器

各位!当我正常使用键盘输入时,当内容宽度超过TextField的宽度时,内容会自动滚动到末尾;但当我使用TextEditingController为TextField设置内容时,当内容超过TextField的宽度时,内容不会自动滚动到末尾。

代码显示如下

class _TextFieldPageState extends State<TextFieldPage> {
  final TextEditingController _controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('TextField content not scroll'),
      ),
      body: Center(
        child: Column(
          children: [
            SizedBox(
              width: 100,
              child: TextField(
                controller: _controller,
                maxLines: 1,
              ),
            ),
            ElevatedButton(
                onPressed: () {
                  // insert 'Flutter'
                  _controller.text += 'Flutter';
                  // change cursor position to end
                  _controller.selection = TextSelection(
                    baseOffset: _controller.text.length,
                    extentOffset: _controller.text.length,
                  );
                },
                child: Text('insert text'))
          ],
        ),
      ),
    );
  }
}
连文本框都不会用,还敢说自己是Word高手

键盘输入:

TextEditingController设置文本:

如何在使用控制器插入文本时使Textfield的内容自动滚动到末尾?谢谢!

推荐答案

这种方式对我很管用。将onPressed的函数更改为:

ElevatedButton(
              onPressed: () async {
                // insert 'Flutter'

                _editingController.text += 'Flutter1';
                await Future.delayed(Duration(milliseconds: 10));
                _scrollController
                    .jumpTo(_scrollController.position.maxScrollExtent);
                print("Jumpted");
                _focusNode.unfocus();
                await Future.delayed(Duration(milliseconds: 10));
                _focusNode.requestFocus();
              },
              child: Text('insert text'),
            )

并将文本字段设置为:

TextField(
                controller: _editingController,
                focusNode: _focusNode,
                scrollController: _scrollController,
                maxLines: 1,
              )

要知道的主要内容是,Textfield有另一个名为ScrollControllerlink的控制器,可用于实现您所寻求的结果。

ps:不要忘记声明Scroll和Focus变量

 final TextEditingController _editingController = TextEditingController();
  final ScrollController _scrollController = ScrollController();
  final FocusNode _focusNode = FocusNode();