Android像Flutter中的Textfield Validation？

Question

我想在TextField中实现类似Flutter的Android。

我尝试了TextField的{​​{1}}文档，并且Flutter的属性为InputDecoration，但在errorText的底部显示错误。我想在Flutter中实现类似以下的功能

Answer 1

您可以在TextFormField内使用Tooltip和自定义Stack来达到此效果。在decoration的{​​{1}}属性中，您可以使用TextFormField类的suffixIcon属性来传递错误图标。

当发生验证错误时，您可以使用InputDecoration变量来显示/隐藏工具提示消息。

bool的示例代码：

TextFormField

您可以使用 TextFormField( decoration: InputDecoration( //Set the different border properties for a custom design suffixIcon: IconButton( icon: Icon(Icons.error, color: Colors.red), onPressed: () { setState(() { showTooltip = !showTooltip; //Toggles the tooltip }); }, ), ), validator: (String value) { if(value.isEmpty) { setState(() { showTooltip = true; //Toggles the tooltip }); return ""; } } ); 将上述代码与自定义工具提示窗口小部件代码一起包装，以达到错误的工具提示效果。

下面是一个快速的示例。您可以设计自己的自定义工具提示小部件，然后在代码中使用它。

示例：

Stack

Answer 2

我认为您是在谈论ToolTip

您可以使用此library或通过Flutter doc

new Tooltip(message: "Hello ToolTip", child: new Text("Press"));

您可以使用库 super_tooltip＃

Answer 3

您可以使用叠加小部件自定义此类错误。可以使用覆盖小部件显示错误，并且可以使用TextField的inputDecoration更改错误图标。

以下是用于了解叠加小部件的链接- https://medium.com/saugo360/https-medium-com-saugo360-flutter-using-overlay-to-display-floating-widgets-2e6d0e8decb9