flutter - 如何制作具有 2 个提示文本的 TextField？

Question

我有来自 Figma 的文本字段的用户界面。

有 2 个提示文本，其中第一个提示文本位于文本字段的开头，另一个位于末尾。

可以看出，尾随是提示文本，当用户输入数字时会消失。

如果您有任何想法，请分享如何制作这种文本字段）

Answer 1

尝试这个：

TextField(
  textAlign: TextAlign.end,
  decoration: InputDecoration(
    prefixIcon: Padding(
        padding: EdgeInsets.all(15), child: Text('Prefix')),
    border: OutlineInputBorder(),
    hintText: "Cym",
  ),
),

Answer 2

您可以只使用尾随作为提示，并且您可以使用 onChanged 方法来处理更改。就像您将管理输入行为的文本一样。例如，如果输入为空，那么您的文本将类似于“A”，如果您输入某些内容，则文本将被更改。

TextFormField(
                decoration: InputDecoration(
                    suffix: Text(text)
                ),
                onChanged: (value) {
                  // handle or change your text here
                  if(value.isEmpty){
                    setState(() { text = "A"});
                  }
                  else{
                    setState(() { myState = "any text"});
                  }
                },
              )