【Flutter】TextFormFieldでのパスワードの表示/非表示ができないです

実現したいこと

よくあるパスワード入力時の表示/非表示をIconButtonを押すことで変化させたいのですが、サイトを真似しただけだと初期状態(非表示)から表示状態へ移行できません。
簡単なソースなのですが、原因がわからずこちらで質問させていただきました。
どうすれば、表示/非表示をIconButtonを押すことで変化させることができるのでしょうか。

該当のソースコード

Dart

1/// bool _isObscure = true;と上で定義しています。2 child: TextFormField(3 obscureText: _isObscure,4 decoration: InputDecoration(5 suffixIcon: _isObscure != true6 ? IconButton(7 icon: const Icon(Icons.visibility),8 onPressed: () {9 setState(() {10 _isObscure = !_isObscure;11 });12 },13 )14 : IconButton(15 icon: const Icon(Icons.visibility_off),16 onPressed: () {17 setState(() {18 _isObscure = !_isObscure;19 });20 },21 ),22 23///ここから下は関係ないかもしれません24 fillColor: Colors.white,25 filled: true,26 focusedBorder: OutlineInputBorder(27 borderRadius: BorderRadius.only(28 topLeft: Radius.circular(15),29 topRight: Radius.circular(15),30 bottomLeft: Radius.circular(15),31 bottomRight: Radius.circular(15),32 ),33 borderSide: const BorderSide(34 color: Colors.black,35 width: 0.0006,36 ),37 ),38 enabledBorder: OutlineInputBorder(39 borderRadius: BorderRadius.only(40 topLeft: Radius.circular(15),41 topRight: Radius.circular(15),42 bottomLeft: Radius.circular(15),43 bottomRight: Radius.circular(15),44 ),45 borderSide: BorderSide(46 color: Colors.black,47 width: 0.0006,48 ),49 ),50 ),51 ),

補足情報(FW/ツールのバージョンなど)

[✓] Flutter (Channel stable, 3.3.10, on macOS 13.1 22C65 darwin-arm, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 14.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] VS Code (version 1.73.0)
[✓] Connected device (3 available)
[✓] HTTP Host Availability

コメントを投稿

0 コメント