[SwiftUI]@Bindingプロパティラッパーの概要と使用法

「@Bindingプロパティラッパーとは何なのかについて知りたい」

「@Bindingプロパティラッパーの使い方を知りたい」

と言う人に向けて、この記事は書かれています。

どうも、ちょげ（@chogetarou）です。

SwiftUIでは、今までのSwiftとは異なり、プロパティラッパーによって、変数に機能を使いできるようになりました。

プロパティラッパーは、いくつかあるのですが、その１つに@Bindingがあります。

この記事では、@Bindingの概要と使用法について解説します。

概要
使用法
まとめ
SwiftUIのオススメ書籍
1. 関連

概要

@Bindingプロパティラッパーは、ビューをまたいで変数を監視したいときに使うプロパティラッパーです。

例えば、AというビューとBというビューがあったとします。

Aというビューでは、@Stateを付けて、値が変更されてないか監視している変数があるとします。

Aで＠Stateをつけて監視している変数をBのビューでも監視したいとなったとします。

この時、Aの@StateとBを繋ぐ役割を持つのが、@Bindingです。

＠Bindingを使うことで、BのビューでAの変数を監視できるようになるのです。

使用法

@Bindingは、@Stateと同じように変数の宣言時の先頭に付けることで機能を付けることが出来ます。

しかし、@Bindingは変数につけるだけでは使用することは出来ません。

別のビューの監視したい変数を、@Bindingがあるビューに画面遷移する時に、参照を渡す必要があります。

import SwiftUI

struct StateView: View {
    @State var goBinding = false
    
    var body: some View {
        ZStack {
            Button(action: { self.goBinding.toggle() }, label: {
                Text("BindingViewへ")
            })
            
            if goBinding {
                BindingView(goState: $goBinding)
            }
        }
    }
}

例えば、上記のようにStateViewのボタンが押されるとBIndingViewが表示されるコードあったとします。

import SwiftUI

struct BindingView: View {
    @Binding var goState: Bool
    
    var body: some View {
            Button(action: { self.goState.toggle() }, label: {
                Text("StateViewへ")
            })
    }
}

BindingViewでは、@Bindingを使っています。

StateViewからBindingViewを呼び出すときに、引数にgoBinding変数にドル記号を付けて、参照を渡しています。

こうする事によって、BindingViewでgoState変数の値を変えたら、StateViewのgoBinding変数が変わり、画面が再描画されるようになります。