时间戳

首页 > 解决方案 > 颤振：为什么当textField失去焦点时输入内容消失？

flutter - 颤振：为什么当textField失去焦点时输入内容消失？

问题描述

我把 atextField和 a放在aclear button中。我希望当有焦点时，会出现，当失去焦点时，按钮会消失。但是当我收起键盘（失去焦点）时，输入的内容就消失了。那么有什么问题呢？hintTextContainertextFieldclear buttontextFieldhintText

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,
                      ),
                    ),

标签： flutterdart

解决方案

Container您用于的小部件suffixIcon占用了所有可用空间，使用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,
        ),
      ),

推荐阅读