【SwiftUI】ボタンのアクションで乱数を作成しテキストで表示する方法

ボタンをタップするたびに乱数を作成し、その結果をテキストに表示する方法を紹介します。

使用するパーツはTextとButtonのみですので簡単に試していただけるかと思います。
順を追って説明しますので、早速やっていきましょう。

ボタンに乱数を作成するアクションを設定
変数を用意して乱数を代入し画面に表示する
まとめ
SwiftUI勉強中の方へ

ボタンに乱数を作成するアクションを設定

まずはボタンを追加してアクションに乱数を作成するアクションを設定します。
その結果はprint()を使用してデバッグしてみます。

struct ContentView: View {
    var body: some View {
        VStack {
            Button(action: {
                let num = Int.random(in: 0...100)
                print(num)
            }) {
                Text("乱数表示")
                    .font(.title)
                    .bold()
                    .padding()
                    .foregroundColor(Color.white)
                    .background(Color.blue)
            }
        }
    }
}

シミュレータの「乱数表示」ボタンを押すと下の画像の赤枠部分に乱数が表示されます。

変数を用意して乱数を代入し画面に表示する

Viewの中で変数を用意します。
@Stateを使用することで変数の値を変更可能にすることができます。

変数の値をTextで表示します。

ボタンのアクションを少し変更します。
ボタンを押した際に作成していた乱数を変更可能にした変数に代入します。

struct ContentView: View {
    @State var num:Int = 0

    var body: some View {
        VStack {
            Text("\(num)")
                .font(.title)
            Button(action: {
                num = Int.random(in: 0...100)
            }) {
                Text("乱数表示")
                    .font(.title)
                    .bold()
                    .padding()
                    .foregroundColor(Color.white)
                    .background(Color.blue)
            }
        }
    }
}