Balbas Code

SwiftUIのプロパティラッパー1

公開日: 2023-09-30 09:53:41
更新日: 2024-02-01 22:47:33

SwiftUI では、ビューの状態やデータフローを管理するためにいくつかのプロパティラッパーを提供しています。以下は、SwiftUIでよく使われるプロパティラッパーについての概要です。

1.@State



  1. ビューの内部状態を管理するためのプロパティラッパー。

  2. 値が変更されるとビューが再描画されます。

  3. 主にビューの内部でのみ使用され、外部からは変更することができません。


struct CounterView: View {
@State private var count = 0

var body: some View {
Button("Increment") {
count += 1
}
Text("\(count)")
}
}




2.@Binding



  1. データの参照を受け渡すためのプロパティラッパー。

  2. 親ビューから子ビューへのデータの受け渡しや、子ビューでの変更を親ビューに反映する際に使用されます。


 


struct ChildView: View {
@Binding var text: String

var body: some View {
TextField("Enter text", text: $text)
}
}

struct ParentView: View {
@State private var text = ""

var body: some View {
ChildView(text: $text)
Text(text)
}
}

 


 


3.@ObservedObject / @Published



  1. 外部の参照型オブジェクトの変更を監視するためのプロパティラッパー。

  2. オブジェクトはObservableObjectプロトコルに従っている必要があり、@Publishedでマークされたプロパティが変更されるとビューが再描画されます。


class DataStore: ObservableObject {
@Published var text = ""
}

struct ObservingView: View {
@ObservedObject var store: DataStore

var body: some View {
TextField("Enter text", text: $store.text)
Text(store.text)
}
}

 


使い方サンプル
・View1のボタンを押下
・Model1の値が更新され紐づく値をView1側で監視
・変更があればView1のTextの値を更新する スーパーコード


// モデルの定義
class Model1: ObservableObject {
@Published var count: Int = 0

func incrementCount() {
count += 1
}
}

// ビューの定義
struct View1: View {
@ObservedObject var model = Model1()

var body: some View {
VStack {
Text("カウント: \(model.count)")
.font(.title)

Button(action: {
model.incrementCount()
}) {
Text("カウントアップ")
.padding()
.background(Color.blue)
.foregroundColor(.white)
.cornerRadius(10)
}
}
}
}


これらのプロパティラッパーを適切に使用することで、SwiftUI のデータフローを効果的に管理することができます。