>我正在尝试在 Flutter 中的画布上添加一个可编辑的文本框,一旦选择,它就会调出键盘。
我正在使用自定义画家将文本打印到画布上(如下面的代码所示(。是否可以使此文本可编辑,或在画布上以特定偏移量添加文本输入元素?
import 'package:flutter/material.dart' as Material;
class CanvasPainter extends Material.ChangeNotifier implements Material.CustomPainter {
..
void paint(Canvas canvas, Size size) {
Material.TextSpan textSpan = new Material.TextSpan(style: new material.TextStyle(color: new Maaterial.Color.fromRGBO(r, g, b, 1.0), fontSize: font.fontSize.toDouble(), fontFamily: 'Roboto'),text: "Hello there");
Material.TextPainter tp = new Material.TextPainter( text: textSpan, textAlign: TextAlign.left, textDirection: TextDirection.ltr, textScaleFactor: ratio);
tp.layout();
tp.paint(canvas, new Offset(50.0,50.0));
}
}
不是最好的解决方案,但我可以用OverlayEntry解决类似的问题。
步骤:
- 创建一个OverlayEntry,使用FocusNode和TextEditController在其中放置一个(隐藏的(TextField。
- 添加覆盖条目后,请求焦点在焦点节点上,因此键盘将打开。
- 在文本字段中添加一个onChanged,并以某种方式(例如valueNotifier(在文本更改时通知画家。
- 在 TextPainer 中使用 TextEditController.text 值