SwiftUIの基本を身につけたい方はこちら

【SwiftUI】@StateObjectの使い方を徹底解説

この記事では、@StateObjectの使い方について解説していきたいと思います。

@StateObjectステイトオブジェクトとは?

この@StateObjectを理解するには、まず、@ObservedObjectを理解する必要があります。

@ObservedObjectは、Viewが再描画する度にインスタンスを再生成しますが、@StateObjectは、Viewが再描画しても値を保持します。このようにライフサイクルが違うだけで、使い方は、@ObservedObjectと変わりません。

使い方

@StateObjectと@ObservedObjectとの違いを理解するために、簡単なプログラムを書いてみましょう。

以下のコードを貼り付けて動作確認してみてください。

class Fruits: ObservableObject {
    @Published var price = 100
}

struct ContentView: View {
    @State var redraw = true
    
    var body: some View {
        VStack {
            ObservedObjectView()
            StateObjectView()
            
            Button(redraw ? "再描画":"再描画") {
                redraw.toggle()
            }
            .buttonStyle(.borderedProminent)
        }
    }
}

struct ObservedObjectView: View {
    @ObservedObject var fruits = Fruits()
    
    var body: some View {
        VStack {
            Text("@ObservedObjectの値:\(fruits.price)")
            Button("10円値上げする") {
                fruits.price += 10
            }
        }
        .padding()
    }
}

struct StateObjectView: View {
    @StateObject var fruits = Fruits()
    
    var body: some View {
        VStack {
            Text("@StateObjectの値:\(fruits.price)")
            Button("10円値上げする") {
                fruits.price += 10
            }
        }
        .padding()
    }
}

動作確認すると、再描画を押したときに、@ObservedObjectで書いたpriceはリセットされます。それに対して、@StateObjectで書いたpriceはリセットされずに値を保持します。

まとめ

このように初期化されるタイミングで、@ObservedObjectと@StateObjectを使い分けていきましょう。

評価