获取用户输入的最后一个字符

huangapple go评论76阅读模式
英文:

Flutter: get the very last character input from the user

问题

我正在使用Flutter制作一个应用程序。
我想将用户输入的最后一个字符设置为我的状态。

例如,当我输入“apple”时,我希望字符“e”成为我的最终状态。当我将光标移动到“p”和“l”之间,然后输入“x”时,我希望状态更改为“x”,内容为“appxle”。

我尝试了所有方法。我向ChatGPT和Bard提问,但他们仍然没有答案。我能想到的最好的方法是获取事件,但我从哪里获取事件呢?从一个控制器?

英文:

I am using Flutter to make an app.
I want to set the very last character from the user as my state.

For example, when I type "apple" I want the character "e" to be my final state. When I move the cursor between "p" and "l" and type "x", I want the state to change to "x" and the content is "appxle"

I tried everything. I asked ChatGPT and Bard, and still they don't have the answer. The best way I can think of is the get the event, but where can I get the event from? A controller?

答案1

得分: 1

以下是您可以使用的实现。请参阅代码中的注释。

class CharacterAtCursor extends StatefulWidget {
  const CharacterAtCursor({super.key});

  @override
  State<CharacterAtCursor> createState() => _CharacterAtCursorState();
}

class _CharacterAtCursorState extends State<CharacterAtCursor> {
  /// Listened to in order to update the UI when the text field's text and/or
  /// cursor changes.
  final _textEditingController = TextEditingController();

  @override
  void initState() {
    super.initState();

    /// We add a listener so that whenever the text field's text or cursor
    /// changes, we update the UI.
    _textEditingController.addListener(() => setState(() {}));
  }

  @override
  void dispose() {
    /// Dispose of the text editing controller.
    _textEditingController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(
          _textEditingController.text.isEmpty
              ? "Type something"
              : _getCharacterAtCursor(), // Called to update the text.
        ),
        TextField(controller: _textEditingController),
      ],
    );
  }

  /// Extracts the character that is after the cursor.
  ///
  /// Modify the index to get the character before the cursor.
  String _getCharacterAtCursor() {
    final text = _textEditingController.text;
    final selection = _textEditingController.selection;
    final offset = (selection.baseOffset).clamp(0, text.length - 1);
    return text[offset];
  }
}

这是您可以使用的实现代码。

英文:

Here is an implementation you can use. See the comments in the code.

class CharacterAtCursor extends StatefulWidget {
  const CharacterAtCursor({super.key});

  @override
  State&lt;CharacterAtCursor&gt; createState() =&gt; _CharacterAtCursorState();
}

class _CharacterAtCursorState extends State&lt;CharacterAtCursor&gt; {
  /// Listened to in order to update the UI when the text field&#39;s text and/or
  /// cursor changes.
  final _textEditingController = TextEditingController();

  @override
  void initState() {
    super.initState();

    /// We add a listener so that whenever the text field&#39;s text or cursor
    /// changes, we update the UI.
    _textEditingController.addListener(() =&gt; setState(() {}));
  }

  @override
  void dispose() {
    /// Dispose of the text editing controller.
    _textEditingController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(
          _textEditingController.text.isEmpty
              ? &quot;Type something&quot;
              : _getCharacterAtCursor(), // Called to update the text.
        ),
        TextField(controller: _textEditingController),
      ],
    );
  }

  /// Extracts the character that is after the cursor.
  ///
  /// Modify the index to get the character before the cursor.
  String _getCharacterAtCursor() {
    final text = _textEditingController.text;
    final selection = _textEditingController.selection;
    final offset = (selection.baseOffset).clamp(0, text.length - 1);
    return text[offset];
  }
}

huangapple
  • 本文由 发表于 2023年7月13日 23:05:53
  • 转载请务必保留本文链接:https://go.coder-hub.com/76680900.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定