Flutter 使用 EditableText

Question

我正在尝试了解如何在 Flutter 中使用 TextEditor。

我有“卡片编辑器”(基本上我希望能够处理相当于一段文字的内容)

new EditableText(
                    autofocus: true,
                    maxLines: null,
                    backgroundCursorColor: Colors.amber,
                    cursorColor: Colors.green,
                    style: TextStyle(),
                    focusNode:  FocusNode(),
                    controller: controller,
                    onSubmitted: (val) {
                      _addCard(val);
                      Navigator.pop(context);
                    },
                  )

我根据 TextField 的示例改编了它。

但是我有几个问题。

首先，当我输入时它似乎没有显示任何内容。光标移动，但看不到任何文本。当没有明确的风格时，这是默认的吗？

其次，如何触发提交？使用 TextField，CR/Enter 按钮可以执行此操作。显然，我明白为什么您不一定想要使用 EditableText，但是我应该怎么做呢？

第三，我需要能够将默认文本放入此小部件中。我尝试向 EditableText 添加一个“值”属性，但这似乎不对。有什么方法可以做到这一点？

Answer 1

• 来自 TextField class - material library - Dart API :

  EditableText, which is the raw text editing control at the heart of a TextField. The EditableText widget is rarely used directly unless you are implementing an entirely different design language, such as Cupertino.

• 这里有一个 TextField 的例子，来 self 的应用 flutter listview CRUD app using nonsecure rest api

  class _TaskEditPageWidgetState extends State<TaskEditPageWidget> {
  TextEditingController _noteController;
  
  @override
  void initState() {
      super.initState();
      _noteController = TextEditingController.fromValue(
      TextEditingValue(
          text: widget.taskOpj.note,
      ),
      );
  }
  
  @override
  void dispose() {
      _noteController.dispose();
      super.dispose();
  }
  
  @override
  Widget build(BuildContext context) {
      return Scaffold(
      appBar: _appBar(),
      body: _body(),
      );
  }
  
  Widget _appBar() {
      return AppBar(
      title: new Text("Edit Task"),
      actions: <Widget>[
          new IconButton(
          icon: new Icon(Icons.save),
          onPressed: _save,
          ),
      ],
      );
  }
  
  Widget _body() {
      return SingleChildScrollView(
      child: Column(
          children: <Widget>[
          Text("Note:"),
          TextField(
              decoration: InputDecoration(border: InputBorder.none),
              autofocus: true,
              keyboardType: TextInputType.multiline,
              maxLines: null,
              controller: _noteController),
          ],
      ),
      );
  }
  
  Future _save() async {
      widget.taskOpj.note = _noteController.text;
      await Tasks.updateTask(widget.taskOpj);
      widget.notifyParent();
      Navigator.pop(context);
  }
  }