Flutter点击显示密码图标视图无变化的问题解决求助

问题核心是状态变化未触发UI重建——Flutter是状态驱动的UI框架，仅修改变量值不会自动更新界面，必须通过setState()通知框架重新渲染相关组件。

修复步骤： #

1. 确保当前组件是StatefulWidget（如果是StatelessWidget，需改为StatefulWidget，因为要维护可变状态）
2. 在suffixIcon的onTap回调中，用setState()包裹变量修改逻辑

修改后的代码： #

TextFormField(
  controller: _passwordController,
  keyboardType: TextInputType.visiblePassword,
  obscureText: SeePassword,
  decoration: InputDecoration(
    filled: true,
    fillColor: Color.fromARGB(255, 232, 232, 232),
    contentPadding: EdgeInsets.symmetric(vertical: 15),
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(20),
    ),
    prefixIcon: Icon(Icons.lock, size: 20),
    suffixIcon: GestureDetector(
      child: SeePassword ? Icon(Icons.remove_red_eye) : Icon(Icons.highlight_off_sharp),
      onTap: () {
        setState(() { // 新增setState包裹状态修改
          SeePassword = !SeePassword;
        });
        print(SeePassword);
      },
    ),
  ),
  style: TextStyle(fontSize: 20, fontFamily: "Roboto Regular"),
),

额外建议： #

按照Dart命名规范，变量名建议使用小驼峰格式，比如将SeePassword改为seePassword，提升代码可读性。

内容的提问来源于stack exchange，提问作者Emir Bolat