flutter 如何冻结文本字段中的标签？

idfiyjo8 于 2023-02-13 发布在 Flutter

关注(0)|答案(3)|浏览(125)

我在文本字段的左上角有一个标签，我希望用户总是能看到这个提示（之后他填写了表单），但是当我点击的时候它就消失了。

@override
  Widget build(BuildContext context) {
    return TextField(
        decoration: InputDecoration(
            floatingLabelBehavior: FloatingLabelBehavior.never,
            label: Align(
                alignment: Alignment.topLeft,
                child: Text(
                  _text,
                  textAlign: TextAlign.left,
                  style: const TextStyle(fontSize: 15),
                )),
            focusedBorder: const OutlineInputBorder(
                borderSide: BorderSide(color: Colors.black),
                borderRadius: BorderRadius.all(Radius.circular(10))),
            enabledBorder: const OutlineInputBorder(
              borderSide: BorderSide(color: Colors.black),
              borderRadius: BorderRadius.all(Radius.circular(10)),
            )));
  }

flutter

来源：https://stackoverflow.com/questions/75403830/how-to-freeze-label-in-textfield

3条答案

按热度按时间

j13ufse21#

您可以通过使用InputDecoration类中的hintText属性实现此行为。hintText属性提供了一个文本提示，当输入字段为空时，该文本提示将显示在输入字段中。用户开始键入时，提示文本将立即消失，如果文本字段为空，提示文本将重新显示。以下是更新后的代码：

@override
Widget build(BuildContext context) {
  return TextField(
    decoration: InputDecoration(
      hintText: _text,
      floatingLabelBehavior: FloatingLabelBehavior.never,
      focusedBorder: const OutlineInputBorder(
        borderSide: BorderSide(color: Colors.black),
        borderRadius: BorderRadius.all(Radius.circular(10))
      ),
      enabledBorder: const OutlineInputBorder(
        borderSide: BorderSide(color: Colors.black),
        borderRadius: BorderRadius.all(Radius.circular(10)),
      )
    ),
  );
}

赞(0）回复(0）举报 2023-02-13

dfuffjeb2#

使用InputDecoration上的labelText属性的material design suggest。也许你已经尝试过并忽略了它...但我还是要检查一下以防万一...你试过吗？
这将是典型的结果：