flutter:当textField失去焦点时，为什么输入内容会消失

Question

我在Container中放入了一个带有clear button和hintText的textField。我希望当textField有焦点时，clear button会出现，当失去焦点时，按钮会消失。但当我收起键盘(textField失去焦点(时，输入内容和hintText都消失了。那怎么了？

Container(
width: 330,
height: 40,
alignment: Alignment.centerLeft,
child: TextField(
controller: inputController,
focusNode: focusNode,
style: MyTextStyle.level9,
keyboardType: TextInputType.number,
decoration: InputDecoration(
hintText: 'hint text',
hintStyle: MyTextStyle.grey,
border: InputBorder.none,
suffixIcon: focusNode.hasFocus ? IconButton(
icon: MyIcon.CloseIcon,
onPressed: () {
inputController.clear();
}
) : Container(),
filled: true,
),
),
decoration: BoxDecoration(
color: MyColor.MidGray,
),
),

Answer 1

用于suffixIcon的Container小部件占用了所有可用空间，使用SizedBox小部件可以很好地工作并产生预期的行为。

我用你的代码添加了一个例子：

Container(
width: 330,
height: 40,
alignment: Alignment.centerLeft,
child: TextField(
controller: inputController,
focusNode: focusNode,
style: MyTextStyle.level9,
keyboardType: TextInputType.number,
decoration: InputDecoration(
hintText: 'hint text',
hintStyle: MyTextStyle.grey,
border: InputBorder.none,
suffixIcon: focusNode.hasFocus
? IconButton(
icon: MyIcon.CloseIcon,
onPressed: () {
inputController.clear();
})
// use a SizedBox widget instead
: SizedBox.shrink(),
filled: true,
),
),
decoration: BoxDecoration(
color: MyColor.MidGray,
),
),