如何防止TextField小部件的光标抖动? -颤抖

时间:2020-04-10 17:42:36

标签: flutter flutter-animation

https://imgur.com/X2gEMqO

观看视频,了解我在说什么⤴

在我开始制作自定义小部件之前,我想看看是否有人知道用香草Flutter解决此问题的方法。似乎与TextEditingController有关,但我不确定。

当TextField设置为居中或右对齐时,它似乎工作得很好,但是在左/起始/对齐时,它似乎总是有轻微的抖动。

提前谢谢! 〜我也可以将其发布到Github存储库中


编辑:您可以看到仅当光标移到文本字段的左侧时才会抖动。当它在字符串中移动时,它根本不会抖动。我正在模拟iPhone 11上进行测试

1 个答案:

答案 0 :(得分:4)

这个问题有两个部分。首先,无论出于何种原因,text_field.dart的cursorOffset的x值均为负。

这会导致光标卡在容器中,从而使宽度看起来很奇怪。其次,TextStyle.height属性使光标跳转。

由于Pavel,我想出了解决方法!

文本字段-字体大小50.0 /高度1.30
https://imgur.com/gallery/G9bkcIf

文本字段-字体大小20.0 /高度1.30
https://imgur.com/gallery/x7a5nzM


修复光标偏移

  1. cursorOffset值存储在text_field.dart文件中。在 为了对其进行编辑,您可能应该创建一个副本 要自定义的text_field.dart文件。 Here's how to do that, 尽管您可能会通过Google找到更好的答案

  2. 一旦您准备好文件即可编辑,请导航至cursorOffsetTargetPlatform.iOS之内。如果它应该在924-ish附近 您的文件未修改。

  3. 分别将Offset(...)的值更改为0和0(x,y),或者 任何您认为合适的东西。

  4. 如果正确复制了text_field.dart文件,则应该 立即工作!

修复光标跳转

  1. 此修补程序的工作量要少得多。只需将TextStyle小部件添加到 TextField小部件的style:属性。

  2. 然后,只需填写您的height小部件的TextStyle属性 无论你怎么想!我发现1.3是一个很好的中位数,但选择 您的fontSize的最佳高度。 Here's some information on height:


与此有关的Github问题

https://github.com/flutter/flutter/issues/31661