带有长文本的Textfield，水平滚动重置要开始 - 扑响

发布于 2025-02-01 18:49:04 字数 1370 浏览 4 评论 0原文

构建一个具有特定宽度容器内文本字段的状态小部件。现在，当我在Textfield中键入长文本时，视图滚动在您键入时正确（按预期工作）。但是，当我在Textfield外面点击时，我已经不关注Textfield。当我取消关注时，如何将Textfield的视图重置回文本的开头？ IE将水平滚动移回开始？

这是Textfield小部件，

textContainer = Container(
    width: MediaQuery.of(context).size.width * 0.68,
    child: Focus(
      child: TextField(
        keyboardType: TextInputType.text,
        textCapitalization: TextCapitalization.sentences,
        onSubmitted: onSubmit,
        controller: textController,
        focusNode: widget.focusNode,
        maxLines: 1,
        autofocus: widget.isNew,
        cursorColor: Colors.white,
        style: const TextStyle(
            fontSize: 16.0,
            fontFamily: 'Inter',
            fontWeight: FontWeight.normal,
            color: Colors.white
        ),
        decoration: const InputDecoration(
          border: InputBorder.none,
        ),
        onChanged: (text) {
          Task task = taskBox.get(widget.task.id);
          task.text = text;
          taskBox.put(widget.task.id, task);
        },
      ),
      onFocusChange: (hasFocus) {
        showDeleteBtn(hasFocus);
      },
    )
);

请参阅GIF的中部，当我解开TextField时，我想将视图/滚动返回到小部件的开头。尝试重建小部件，但行不通。

原文

Building a stateful widget with a textfield wrapped within a Container of specific width. Now, when I type a long text in the textfield, the view scrolls right as you type (works as expected). But when I tap outside of the textfield, I've unfocused the textField. When I unfocus, how do I programatically reset the view of the textfield back to the beginning of the text? i.e. Move the horizontal scroll back to the beginning?

Here's the textField widget

textContainer = Container(
    width: MediaQuery.of(context).size.width * 0.68,
    child: Focus(
      child: TextField(
        keyboardType: TextInputType.text,
        textCapitalization: TextCapitalization.sentences,
        onSubmitted: onSubmit,
        controller: textController,
        focusNode: widget.focusNode,
        maxLines: 1,
        autofocus: widget.isNew,
        cursorColor: Colors.white,
        style: const TextStyle(
            fontSize: 16.0,
            fontFamily: 'Inter',
            fontWeight: FontWeight.normal,
            color: Colors.white
        ),
        decoration: const InputDecoration(
          border: InputBorder.none,
        ),
        onChanged: (text) {
          Task task = taskBox.get(widget.task.id);
          task.text = text;
          taskBox.put(widget.task.id, task);
        },
      ),
      onFocusChange: (hasFocus) {
        showDeleteBtn(hasFocus);
      },
    )
);

See the mid part of the gif, when I unfocus the textfield, I'd like to push the view/scroll back to the beginning of the widget. Tried rebuild the widget, but doesn't work.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

究竟谁懂我的在乎 2025-02-08 18:49:04

您可以使用scrollController内部textfield，而在textfiled get de not de not cops in start开始。

class _TOSState extends State<TOS> {
  late final FocusNode textInputFocusNode = FocusNode()
    ..addListener(() {
      debugPrint(textInputFocusNode.hasFocus.toString());
      if (!textInputFocusNode.hasFocus) {
        controller.jumpTo(0);
      }
    });
  ScrollController controller = ScrollController();

  @override
  void dispose() {
    textInputFocusNode.removeListener(() {});
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: GestureDetector(
      onTap: () {
        FocusScope.of(context).requestFocus();
      },
      child: Column(
        children: [
          TextField(
            scrollController: controller,
            focusNode: textInputFocusNode,
            maxLines: 1,
            decoration: const InputDecoration(
              hintText: "TYpe",
            ),
          ),
        ],
      ),
    ));
  }
}

You can use ScrollController inside TextField and while textfiled get unfocused jump to start.

class _TOSState extends State<TOS> {
  late final FocusNode textInputFocusNode = FocusNode()
    ..addListener(() {
      debugPrint(textInputFocusNode.hasFocus.toString());
      if (!textInputFocusNode.hasFocus) {
        controller.jumpTo(0);
      }
    });
  ScrollController controller = ScrollController();

  @override
  void dispose() {
    textInputFocusNode.removeListener(() {});
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: GestureDetector(
      onTap: () {
        FocusScope.of(context).requestFocus();
      },
      child: Column(
        children: [
          TextField(
            scrollController: controller,
            focusNode: textInputFocusNode,
            maxLines: 1,
            decoration: const InputDecoration(
              hintText: "TYpe",
            ),
          ),
        ],
      ),
    ));
  }
}

回复收藏 0 原文

~没有更多了~