Flutter TextFormField中的水平滚动在文本输入时抖动

我有一个电子邮件输入文本字段，当我写的文本超过此输入的宽度时，其余文本不可见。在我输入这个文本表单字段时，是否有一个水平滚动条

下图描述了我想要的行为

编辑：我的代码

容器(
宽度：270，
身高：42，
子项：新建TextFormField(
验证程序：（val）=>val.isEmpty？“输入电子邮件”：null，
装饰：新的输入装饰(
图标：图标(
Icons.email_概述，
),
labelText:“电子邮件”，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（25.0），
borderSide:新的borderSide（），
),
),
键盘类型：TextInputType.emailAddress，
一旦更改：（val）{
设置状态（（）=>email=val）；
},
),
),

这是当我键入的文本超出TextFormField的宽度时发生的情况

---

有两种方法可以做到这一点：

您可以将isDense属性添加到TextFormField，在这种情况下，您的代码如下所示：

容器(
宽度：270，
身高：42，
子项：TextFormField(
textAlignVertical:textAlignVertical.center，
验证程序：（val）=>val！.isEmpty？“输入电子邮件”：null，
装饰：新的输入装饰(
是的，
图标：图标(
Icons.email_概述，
),
labelText:“电子邮件”，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（25.0），
borderSide:新的borderSide（），
),
),
键盘类型：TextInputType.emailAddress，
一旦更改：（val）{
设置状态（（）=>email=val）；
},
),
),

这在一定程度上解决了这个问题，但是如果字体延伸得更低（如逗号、分号等）仍然被剪掉的话。下一种方法解决了这一问题：

使用contentPadding属性，因为如果检查源代码，isDense只需修改contentPadding属性的值。这是isDense背后的一些实际代码：

if（装饰！.filled==true）{//filled==null与filled==false相同
contentPadding=decorationContentPadding？？（decorations）
？LTRB（12.0,8.0,12.0,8.0）的常数边集
：LTRB（12.0,12.0,12.0,12.0,12.0）的常数边集；
}否则{
//非左或右填充未填充的下划线边框
//是向后兼容性的一个小让步。这消除了
//#13734引入了最显著的布局变化。
contentPadding=decorationContentPadding？？（decorations）
？LTRB（0.0,8.0,0.0,8.0）的常数边集
：LTRB（0.0,12.0,0.0,12.0）的常数边集；
}

正如您所看到的，flatter在幕后所做的一切就是根据您传递的参数为参数指定硬编码值。在您的情况下，最好的配置似乎是：

容器(
宽度：270，
身高：42，
子项：TextFormField(
textAlignVertical:textAlignVertical.center，
验证程序：（val）=>val！.isEmpty？“输入电子邮件”：null，
装饰：输入装饰(
contentPadding:EdgeInsets.fromLTRB（12.0,8.0,12.0,8.0），
图标：图标(
Icons.email_概述，
),
labelText:“电子邮件”，
边框：新大纲输入边框(
边界半径：新边界半径。圆形（25.0），
borderSide:新的borderSide（），
),
),
键盘类型：TextInputType.emailAddress，
一旦更改：（val）{
设置状态（（）=>email=val）；
},
),
),

---

上面的代码修复了您的问题，但如果字体高度发生变化，可能会产生更多问题。

您将获得什么类型的输出？因为您想要实现的是

TextFormField（）

的默认行为，如果您想查看隐藏内容，可以向右滚动查看您以前键入的内容。因此，当我开始键入超出宽度的内容时，文本不再可见。您能以某种方式显示它吗？当然，我将添加一些图像从

Container（）中删除您的高度属性它导致了问题