I am developing a mobile application with Flutter. I added a TextFormField to my app like this:

When I click on the icon, the process is running in the back-end. But there is not change in the view.

My codes:

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: () {
        SeePassword = !SeePassword;
        print(SeePassword);
      },
    ),
  ),
  style: TextStyle(fontSize: 20, fontFamily: "Roboto Regular"),
),

How can I solve the problem? Thanks for help.

CodePudding user response：

onTap is missing setState to update the ui

onTap: () {
  setState((){
    SeePassword = !SeePassword;
  });
},