最初に完成イメージをご覧ください。「Start」ボタンをタップすると、メッセージが「停止中」から「稼働中」に変わります。それと同時に、「Start」ボタンは「Stop」ボタンに変わります。
そして、「Stop」ボタンをタップするとメッセージは「停止中」に戻り、ボタンも「Start」に戻ります。あとは繰り返しになります。
Buttonの書式には下記の2つのタイプがあります。
ボタンをタップした時の処理を先に定義するか、ボタン名を先に定義するかの違いです。
Button(action: { ボタンをタップした時の処理 }) {
Text(“ボタン名”)
}
Button(”ボタン名”) {
ボタンをタップした時の処理
}
サンプルコード
今回は、action(ボタンをタップした時の処理)を先に定義する書式を用いてサンプルコードを書きました。
今回は、ボタンをタップするごとにメッセージとボタン名が切り替わるので、①でメッセージとボタン名の変数設定をしています。
②が、Buttonの定義です。action{}内にタップされた時の処理内容(メッセージとボタン名の変数への代入)が記載されています。action{}内に、if-else文が定義できるんですね。
③でメッセージを表示しています。
コメント