返回

您还缺一个高逼格的TextField

Android

Flutter TextField 高度设置

Flutter TextField 的高度可以通过 height 属性设置。height 属性的单位是逻辑像素(logical pixels),因此您可以在任何设备上设置相同的 TextField 高度。

TextField(
  height: 50.0,
)

Flutter TextField 背景色设置

Flutter TextField 的背景色可以通过 decoration 属性的 color 属性设置。color 属性的类型是 Color,您可以使用任何您喜欢的颜色。

TextField(
  decoration: InputDecoration(
    color: Colors.blue,
  ),
)

Flutter TextField 其他样式设置

除了高度和背景色之外,Flutter TextField 还可以设置其他样式,比如边框颜色、边框宽度、字体颜色、字体大小等。这些样式都可以通过 decoration 属性设置。

TextField(
  decoration: InputDecoration(
    border: OutlineInputBorder(
      borderSide: BorderSide(
        color: Colors.red,
        width: 2.0,
      ),
    ),
    fillColor: Colors.green,
    filled: true,
    hintStyle: TextStyle(
      color: Colors.grey,
      fontSize: 16.0,
    ),
  ),
)

Flutter TextField 使用技巧

在使用 Flutter TextField 时,需要注意以下几点:

  • 如果您想在 TextField 中显示提示文本,可以使用 hintText 属性。
  • 如果您想在 TextField 中显示错误信息,可以使用 errorText 属性。
  • 如果您想禁用 TextField,可以使用 enabled 属性。
  • 如果您想让 TextField 自动获取焦点,可以使用 autofocus 属性。

总结

Flutter TextField 是一个非常强大的组件,可以用于构建各种各样的文本输入框。通过设置 height、color 等属性,您可以自定义 TextField 的样式,使其更加符合您的需求。希望本文对您有所帮助。