FlutterTextFormField(裝飾:...,后綴:IconButton(onPressed:,));圖示按鈕onPress錯誤

我想將我的輸入型別作為密碼，所以我希望它被審查。我想使用“obscureText：true”，所以它可以作業，但是當我想將它宣告為一個函式并添加一個按鈕時，該按鈕將在您單擊時顯示密碼并在您再次單擊時隱藏。我正在嘗試添加 suffix 屬性和 IconButton(); 但它不作業。

bool hide() {
  return true;
}

@override
Widget build(BuildContext context){
  return Form(
    key: loginClass,
    ...
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 32, vertical: 8),
          child: TextFormField(
            controller: password,
            obscureText: hide(),
            decoration: const InputDecoration(
              labelText: "Password",
              hintText: "Enter your password",
              border: OutlineInputBorder(),
              icon: Icon(Icons.lock),

              // Suffix line.

              suffix: IconButton(
                icon: Icon(Icons.visibility_rounded),
                onPressed: !hide, // Error line.
              ),

            ),
            validator: (String? value) {
              if (value == null || value.isEmpty) {
                return 'Please enter your password';
              }
              return null;
            },
          ),
        ),
       ...
}

錯誤：

Performing hot restart...
Syncing files to device Android SDK built for x86...

lib/login.dart:107:31: Error: Not a constant expression.
                  onPressed: !hide,
                              ^^^^

lib/login.dart:107:31: Error: A value of type 'bool Function()' can't be assigned to a variable of type 'bool'.
                  onPressed: !hide,
                              ^

lib/login.dart:107:30: Error: The argument type 'bool' can't be assigned to the parameter type 'void Function()?'.
                  onPressed: !hide,
                             ^

Restarted application in 218ms.

我想添加一個圖示按鈕。一旦你點擊它，密碼將被顯示，但如果你再次點擊將被審查。

uj5u.com熱心網友回復：

onPressed可以是null或者是function，你不能分配!hide給它。創建一個新的狀態變數來維護 StatefulWidget 中的可見性狀態。

suffix: IconButton(
  icon: Icon(Icons.visibility_rounded),
  onPressed: () {
    setState(() {
      hideState = !hideState;
    });   
  },
),

uj5u.com熱心網友回復：

        bool hide = false;
        
        @override
        Widget build(BuildContext context){
          return Form(
            key: loginClass,
            ...
                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 32, vertical: 8),
                  child: TextFormField(
                    controller: password,
                    obscureText: hide,
                    decoration: const InputDecoration(
                      labelText: "Password",
                      hintText: "Enter your password",
                      border: OutlineInputBorder(),
                      icon: Icon(hide?Icons.lock:Icons.lock_open),
        
                      // Suffix line.
        
                      suffix: IconButton(
                        icon: Icon(Icons.visibility_rounded),
                        onPressed: (){ setState(() {hide=!hide;}); }, // You can Use like this.
                      ),
        
                    ),
                    validator: (String? value) {
                      if (value == null || value.isEmpty) {
                        return 'Please enter your password';
                      }
                      return null;
                    },
                  ),
                ),
               ...
        }


you can use like this

uj5u.com熱心網友回復：

您必須宣告一個布爾變數并根據可見性按鈕更改其值。此外，如果您不使用 BLOC 或 GETX，則必須使用有狀態小部件來獲取螢屏的更新。此外，如果您將 onPressed 函式與函式或 setState 一起分配，請不要使用 const。我已經為你做了一個示例代碼......你可以通過這個鏈接直接在瀏覽器上嘗試它：https ://zapp.run/edit/flutter-zn206ban306?entry=lib/main.dart&file=lib/main.dart

uj5u.com熱心網友回復：

suffixIcon: IconButton(
                      icon: Icon(
                          _isObscure
                              ? Icons.visibility_outlined
                              : Icons.visibility_off_outlined,
                          color: HexColor(CustomAppTheme.borderColor),
                        ),
                        onPressed: () {
                          setState(() {
                            _isObscure = !_isObscure;
                          });
                        },
                      ),

標籤：安卓扑颤振机器人

上一篇：「MySQL高級篇」MySQL鎖機制 && 事務 -- 臨鍵鎖與幻讀

下一篇：如何在LinearLayout上將TextView底部和中心水平對齊？