颤动动态文本方向性问题答案

【问题标题】：flutter dynamic text directionality issue颤动动态文本方向性问题
【发布时间】：2020-07-29 19:05:55
【问题描述】：

重现错误的代码：

class TestWidget extends StatefulWidget {
  @override
  _TestWidgetState createState() => _TestWidgetState();
}

class _TestWidgetState extends State<TestWidget> {
  bool isRtl = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Directionality(
              child: TextField(),
              textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,
            ),
            RaisedButton(
              child: Text('click me!'),
              onPressed: () => setState(() => isRtl = !isRtl),
            ),
          ],
        ),
      ),
    );
  }
}

重现步骤：

在文本字段中输入“某事”
删除它#它工作正常
点击按钮
在文本字段中输入“سلام دنیا”
尝试删除它#查看错误！

是否有解决此错误的方法或修复方法？

【问题讨论】：

对我来说很好用，错误是什么？
@Mobina 你用的是什么版本的颤振？
我在1.17.5 。
我也在 1.17.5 稳定版，但它对我来说有问题！
设备/模拟器可能有问题？考虑在其他设备上尝试。

标签： flutter text direction

【解决方案1】：

解决方案 1. 在TextField 中将minLines 设置为1 并将maxLines 设置为null：

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Directionality(
              child: TextField(
                minLines: 1, // this is new
                maxLines: null, // this is new
              ),
              textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,
            ),
            RaisedButton(
              child: Text('click me!'),
              onPressed: () => setState(() => isRtl = !isRtl),
            ),
          ],
        ),
      ),
    );
  }

解决方案 2. 删除在 rtl 中点击空格键时插入的多余字符：

  TextEditingController _textEditingController = TextEditingController();
  var isRtl = false;
  var _text = '';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Directionality(
              textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,
              child: TextFormField(
                onChanged: (val) {
                  if (val.codeUnitAt(val.length - 1) == 8207 ||
                      val.codeUnitAt(val.length - 1) == 8206) {
                    setState(() {
                      _text = val.replaceAll(String.fromCharCode(8207), '');
                      _text = _text.replaceAll(String.fromCharCode(8206), '');
                      _textEditingController =
                      new TextEditingController.fromValue(
                          new TextEditingValue(
                              text: _text,
                              selection: new TextSelection.collapsed(
                                  offset: _text.length)));
                    });
                  }
                  else {
                    setState(() {
                      _text = val;
                    });
                  }
                },
                controller: _textEditingController,
              ),
            ),
            RaisedButton(
              child: Text('click me!'),
              onPressed: () => setState(() {
                isRtl = !isRtl;
              }),
            ),
          ],
        ),
      ),
    );
  }

【讨论】：

感谢您的回答。它可以工作，但我需要将 maxLines 设置为 1！有没有其他解决方案？
我认为除了为文本字段创建一个新类之外没有其他解决方案。如果可以解决问题，您还可以将 maxLines 设置为 2。 @AmirHosseinMohammadzadeh
max line 必须是 1.. 你能告诉我更多关于为文本字段创建一个新类的意思吗？
我添加了另一个解决方案。这有点乱，但它有效。看看这个。 @AmirHosseinMohammadzadeh
太棒了！谢谢你的好回答。它仍然有一个小错误。如果你长按键盘上的删除按钮，你会意识到这一点。我稍微更改了您的答案，并将其发布。再次感谢。

【解决方案2】：

我稍微改了一下@Mobina的回答：

  TextEditingController _textEditingController = TextEditingController();
  var isRtl = false;
  var _text = '';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Directionality(
              textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,
              child: TextFormField(
                onChanged: (val) {
                  if (val.codeUnitAt(val.length - 1) == 8207 ||
                      val.codeUnitAt(val.length - 1) == 8206) {
                    setState(() {
                      _text = val.replaceAll(String.fromCharCode(8207), '');
                      _text = _text.replaceAll(String.fromCharCode(8206), '');
                      _textEditingController.value = TextEditingValue(
                        text: _text,
                        selection: TextSelection.collapsed(offset: _text.length),
                      ); //changed here!
                    });
                  }
                  else {
                    setState(() {
                      _text = val;
                    });
                  }
                },
                controller: _textEditingController,
              ),
            ),
            RaisedButton(
              child: Text('click me!'),
              onPressed: () => setState(() {
                isRtl = !isRtl;
              }),
            ),
          ],
        ),
      ),
    );
  }

【讨论】：