在用 flutter 构建的计算器中选择什么输出字段

Question

我正在制作一个计算器应用程序。我想问一下我可以使用哪个小部件来显示数字。如果我使用 Text 然后我不能用光标编辑它，如果我使用 TextField 弹出键盘。

Answer 1

我找到了一个可能适合您的 EditableText 实现。只需输入此代码：

class NoKeyboardEditableText extends EditableText {

  NoKeyboardEditableText({
    @required TextEditingController controller,
    @required TextStyle style,
    @required Color cursorColor,
    bool autofocus = false,
    Color selectionColor
  }):super(
      controller: controller,
      focusNode: NoKeyboardEditableTextFocusNode(),
      style: style,
      cursorColor: cursorColor,
      autofocus: autofocus,
      selectionColor: selectionColor,
      backgroundCursorColor: Colors.black
  );

  @override
  EditableTextState createState() {
    return NoKeyboardEditableTextState();
  }

}

class NoKeyboardEditableTextState extends EditableTextState {
  @override
  void requestKeyboard() {
    super.requestKeyboard();
    //hide keyboard
    SystemChannels.textInput.invokeMethod('TextInput.hide');
  }
}

class NoKeyboardEditableTextFocusNode extends FocusNode {
  @override
  bool consumeKeyboardToken() {
    // prevents keyboard from showing on first focus
    return false;
  }
}

这将创建一个不打开键盘的EditableText，但您仍然可以正常移动光标。要添加文本，我会结合使用 TextEditingController 的 text()、value()、selection() 方法。首先获取字段中的值，然后使用 selection() 获取光标的位置，在选择索引处输入您想要的任何文本，最后将控制器的文本设置为结果字符串。

如果有帮助请告诉我！

Answer 2

所以，你可以试试这个

TextField(showCursor: true, readOnly: true);

在用 flutter 构建的计算器中选择什么输出字段

What Output field to choose in calculator build with flutter

calculator

dart

flutter

flutter-layout