user-interface - 在颤振中，我们如何使验证错误消息看起来很漂亮

Question

我正在申请。我分享的登录页面的用户界面。在此我使用了验证，因此它在 textformfield 下方以红色显示验证消息，但它看起来非常难看。有什么方法可以让这个验证错误消息在屏幕上看起来非常好，就像我们在本地使用不同的库一样？

Answer 1

您可以通过InputDecoration小部件自定义表单中的文本字段装饰，如下例所示：

您的TextFormField小部件：

TextFormField(
  controller: controller,
  decoration: InputDecoration(
    labelText: "Example",
    labelStyle: TextStyle(color: Colors.black),
    errorStyle: TextStyle(color: Colors.red),
    errorBorder: OutlineInputBorder(
      borderSide: BorderSide(color: Colors.red),  
    ),
  ),
  validator: (value) {
    if (value == null || value == '') {
      return "Error";
    }
  },
)

特别是您可以看到这两个属性：

• errorBorder 属性
• errorStyle 属性