SwiftUI ile @State kullanımı

Merhabalar bu yazımda SwiftUI ile birlikte kullandığımız @State ön eki alan değişkenlerin ne işe yaradığını ve ne için kullanmamız gerektiğini sizlerle paylaşacağım.

SwiftUI ile ve Combine Framework ile birlikte kullandığımız ve örneklerini paylaştığım @ işareti ile kullanılan @propertyWrapper bulunmakta. Bunlardan biri olan @State sayfa içerisinde SwiftUI yapısı gereği, objelere bağlamamız gereken değişkenler için kullanılmakta. Yani UI işlemlerde @State ön ekli değişkeninin değerini değiştiğimiz zaman otomatik olarak değiştiğini anlayarak Main Thread üzerinden bağlı olan UI objesini otomatik olarak güncellemeye yaramakta.

Aşağıda yazdığım örnek ile kullanımını görebilirsiniz. Bundan önceki yazılarımdaki örneklerimde bolca kullanmıştım.

struct ContentView:View {

    @State var nameFieldText:String = ""
    @State var loginButtonState:Bool = false

    var body: some View {
        VStack {
            TextField("Nick:", text: $nameFieldText)
            Button(action: {
                self.loginButtonState = !self.nameFieldText.isEmpty
            }) {
                Text("Login")
            }.sheet(isPresented: $loginButtonState) {
                LoginView()
            }
        }
    }
}

struct LoginView:View {
    
    @Environment(\.presentationMode) var presentationMode
    
    var body: some View {
        Button(action: {
            self.presentationMode.wrappedValue.dismiss()
        }) {
            Text("Logout")
        }
    }
}

Burada öğreneceğiniz @State kullanımının yanı sıra present ile farklı bir sayfaya giderek dismiss işlemi gerçekleştirmek.

Bunun dışında custom view sınıflarına @State gönderecekseniz ve bunu sınıf içerisinde kullanmanız için oluşturacağınız değişken @Binding olması gerekir.

struct ContentView:View {
    
    @State var stateButton:Bool = true
    
    var body: some View {
        CustomButton(isSubscribe: $stateButton)
    }
}

struct CustomButton:View {
    
    @Binding var isSubscribe:Bool
    
    var body: some View {
        Button(action: {
            self.isSubscribe.toggle()
        }) {
            Text(isSubscribe ? "Open" : "Close")
        }
    }
}