![見出し画像](https://assets.st-note.com/production/uploads/images/45181327/rectangle_large_type_2_bd7608147352e841653ca8ae02befb89.png?width=1200)
SwiftUIで行こう!- @Binding。
@Bindingを考えます。
メインViewがありそこに別Viewとして組み込む場合に使う別Viewの機能を常時監視、実行できるようにするものです。
メインViewで何らかの操作をして別Viewで定義指定いる機能を実行させる場合に@Bindingをつけた変数を別Viewを実装しておくことで別ViewをメインViewに組み込み引数でメインViewのデータを渡した場合に有効となります。
別Viewの構造体の機能をメインViewでも使えるようにするためには別Viewの変数は@Bindingをつけることが必要で、その構造体の引数として受けたデータをメインViewに反映できるようになります。メインViewで渡す引数は"$"をつける必要があります。
コードは以下
import SwiftUI
struct ContentView: View {
@State var isOn2:Bool = false
var body: some View {
LightBulb(isOn: $isOn2)
}
}
struct LightBulb:View {
@Binding var isOn:Bool
var body: some View{
Group {
if isOn{
Image(systemName: "lightbulb.fill")
.font(.largeTitle)
}else{
Image(systemName: "lightbulb")
.font(.largeTitle)
}
}.onTapGesture(perform: {
isOn.toggle()
})
}
}
struct LightBulb:View {}を作りそれをstruct ContentView: View {}に入れ込んで動作させています。
LightBulbで@Bindingをつけて変数を宣言することで、ContentViewで使う時に引数で受けた時に、LightBulbでのViewの操作、この場合だとタップジェスチャーによりタップすればTrue,Falseを入れ替える動作を伝えます。
でもこれは@Bindingを@Stateでやり直しても同じこと、画像の入れ替えができます。
では、背面の色を変化させる仕組みを作ります。
VStack{
LightBulb(isOn: isOn2)
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(isOn2 ? Color.black : Color.white)
.edgesIgnoringSafeArea(.all)
としてやり先ほどやってみた@Bindingを@Stateでやり変えてみます。動作が違っているのが確認できると思います。Viewの背景が@Stateでは変化しません。@Bimdingをつけてやると背景も変化します。View内で定義してそれを引数でデータの受け渡しする場合には@Bindingを使い受けわたすことができる状態にしないといけません。
ContentViewにサブのViewを埋め込んでそのView内で変数を使用する場合に使います。
動画で紹介されています。
この記事が気に入ったらサポートをしてみませんか?