5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Flutter入門 条件が適合するまでButtonを無効化する

Last updated at Posted at 2022-09-24

この記事のゴール

条件が適合するまでボタンを無効化できるようになる。

例)ログインされるまで無効化する
ログインさせるときなどに、この部分を満たしてからじゃないとボタンを押して欲しくない!という事、多々ありますよね。
そんな時にはこうしましょう!

ElevatedButton(
    onPressed: (条件)
        ? (){ マッチした時の処理 }
        : null, // マッチしなかった時の処理
    child: Text("送信する", style: TextStyle( fontWeight: FontWeight.bold ))
)

onPressedの中で条件を分岐し、マッチしない場合にはnullを入れてあげるとボタンが無効化されます。

具体例は以下です!
参考になれば幸いです。

ElevatedButton(
    onPressed: (user != null)
        ? (){ print(user?.uid); }
        : null, // マッチしなかった時の処理
    child: Text("送信する", style: TextStyle( fontWeight: FontWeight.bold ))

ここでは、ユーザーがnullではない場合にはボタンを押せるようにしています。

ちなみに、ここで条件分岐に使われているのは三項演算子というものです。
使い方は以下です。

(条件) ? マッチした時の処理 : マッチしなかった時の処理
(example =< 3) ? print("exampleは3以下です"); : print("条件を満たしていません");

今回は以上です。

5
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?