DropdownButtonの有効・無効をuserがtoggleで切り替える

大きな目標

userの入力する情報によってデータベースを構築する

中期的な目標

userの負担を減らしつつも、誤入力、重複入力を防ぐUIをつくる

今日の目標

DropdownButtonの有効・無効をuserが切り替える

-　表記揺れを防ぐためDropdownButtonを使う
-　入力は必須ではないため、DropdownButtonはdefaultで無効とする
-　入力を希望するuserが切り替えボタンを押すことでDropdownButtonが有効になる

 var isDisabled = true;  //切り替えを設定
 
 String? isSelectedDay = 'No-Day';　//無効時に選択される初期値・保存しない
 
 List<String> days = <String>[
'No-Day',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
'Sunday',
  ];  //ButtonItem
  

@override
***

                    //切り替えボタン
                    Padding(
                       padding: const EdgeInsets.fromLTRB(20, 20, 20, 0),
                       child: OutlinedButton(
                         onPressed: () {
                           setState(toggleButton);
                           },
                           child: const Text('Add "Day of the week" ?'),
                           ),
                        ),
                    //三項演算子で切り替え
                    Padding(
                      padding: const EdgeInsets.all(20.0),
                      child: Container(
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(15.0),
                          color: const Color(0x99e6e6fa),
                        ),
                        child: DropdownButton<String>(
                          value: isSelectedDay,
                          alignment: Alignment.center,
                          dropdownColor: const Color(0xCCe6e6fa),
                          borderRadius: BorderRadius.circular(15.0),
                          onChanged: isDisabled
                              ? null
                              : (String? value) {
                            setState(() {
                              isSelectedDay = value;
                            });
                          },
                          items: days.map<DropdownMenuItem<String>>(
                                  (String value) {
                                return DropdownMenuItem<String>(
                                  value: value,
                                  child: Text(
                                      style:
                                      SpaceTimeTheme.textTheme.bodyMedium,
                                      value),
                                );
                              }).toList(),
                        ),
                      ),
                    ),

***

//切り替え関数
  void toggleButton(){
    isDisabled = !isDisabled;
  }

• 切り替えボタンなので、複数回タッチすると有効←→無効を行ったり来たりします。
• 状況に応じてデータベースに入れるか入れないかの条件分岐はまた別のお話。

この手間が有効か、はたまた逆効果かは、不明です。

とりあえず、一つの書き方の記録として。