SwiftUI: Binding ve State
Binding ve State, SwiftUI içerisinde yoğun kullanılan veri yapılarıdır. Bu veri yapılarını örneklerle öğrenelim!
Merhaba TurkishKit okuyucuları!👋 Bu yazımızda @Binding ve @State kavramlarına değineceğiz ama ilk önce Property Wrapper kavramını öğrenmeliyiz. Hadi hiç vakit kaybetmeden başlayalım.🤟
Yazar Önerisi!😉
SwiftUI serisinin diğer yazılarını okumanızı öneririz! Seriye buraya tıklayarak ulaşabilirsiniz.
Property Wrapper
Swift 5.1 ile gelen bu yapı ile değişkenlere ön ek olarak eklediğiniz @property tanımları ile değişkeni temizleme veya değişkene yeni değer atama… vb. işlemleri için bir fonksiyon yazmadan değişken oluşturulduğu anda istediğiniz işlemi gerçekleştirebiliyorsunuz. SwiftUI ile birlikte aktif olarak kullanılan bu yapı bizlere oldukça okunaklı ve etkileşimli yapılar oluşturmamızı sağlıyor. Buraya kadar kafanız çok karıştı değil mi?🥶Endişelenmeyin, şimdi inceleyeceğimiz örnek ile çok rahat anlayacaksınız.😉
Hadi Bir Örnek İnceleyelim!
Bu örneğimizde neler oluyor bir inceleyelim. @UpperCase olarak tanımlanan değişkenler, içerisindeki yazıları otomatik olarak büyük harf yapar. Bu gibi yapıları kullanmamız kod okunabilirliği açısından oldukça yararlı olacaktır.
Şimdi gelin SwiftUI kütüphanesinin “Property Wrapper” yapılarını inceleyelim.
- @State: Sadece tanımlandığı “View” nesnesi içinde kullanılan ön ektir. Değeri değiştiğinde, değerin bağlı olduğu “View” nesnelerini günceller.
- @Binding: “@State” ön eki tanımlandığı “View” nesnesi içinde kullanılıyor demiştik. Bu “@State” değişkeni tanımlandığı “View” nesnesinden değilde başka bir “View” nesnesinden ulaşmamız gerektiğinde kullanacağımız ön ektir.
@State
Şimdi @state ve @binding kavramlarını daha iyi anlamak için örnek bir uygulama yapacağız. İlk olarak Xcode uygulaması üzerinden bir SwiftUI projesi oluşturuyoruz.
Projemizi oluşturduktan sonra aşağıdaki kodları yazıyoruz.
Kodları yazdıysak artık projemizi çalıştırabiliriz. Şimdi buton üzerine tıklayalım. Böylece buton içerisindeki aksiyon parametresinde bulunan “self.text” değişkenine hangi değeri girersek o değerin ekranda göründüğünü göreceğiz.
@Binding
Şimdi ise bir @binding örneği yapalım. Az önceki projemizi hiç kapatmadan içerisine yeni bir “SwiftUI View” dosyası açarak devam ediyoruz. Yeni dosyamıza “SecondView” adını verelim.(Dilerseniz istediğiniz bir adıda verebilirsiniz)
Aşağıdaki kodları kullanarak ikinci sayfamızı kodlamaya başlayalım.
“SecondView” sayfamızı kodlamaya devam edelim.
Fark ettiğimiz üzere “Preview” penceresinde yazdığımız kodların çıktısını göremiyoruz. Endişelenmeyin bir yanlışlık yapmadık. SecondView(show: .constant(true)) yaparsak kodumuzun çıktısı görünecektir. Bu “show” değişkenine, başlangıç değeri vermemizi sağlıyor.
“ContentView” yani ilk başta kodlama yaptığımız sayfaya geri dönelim ve kodlamaya devam edelim.
İki sayfa arasında bir fark var. Fark ettiniz mi ? 🤔
“ContentView” sayfasında “show” değişkenini @State ile tanımladık.
“SecondView” sayfasında ise “show” değişkenini @Binding ile tanımladık.
Bunun sebebi şu; “ContentView” sayfasından “SecondView” sayfasındaki “show” değişkenine müdahale edip ikinci sayfayı ekranda gösterebilmek için @Binding ön ekini kullandık. Eğer @Binding ön ekini @State ön eki ile değiştirirsek “SecondView” sayfası açılmayacaktır.
Şimdi ise @Binding ile “SecondView” sayfasındaki soyadı değiştirelim.
“SecondView” sayfasındaki “secondText” değişkenini “@Binding var secondText: String” olarak değiştirelim.
Şimdi bir de “ContentView” sayfamızda da değişiklikler yapalım. “SecondView” sayfasında yaptığımız değişiklikten dolayı Xcode uygulaması bizi uyarıyor ve bir parametreyi düzeltmemizi istiyor.
@State ön eki ile yeni bir değişken oluşturalım. Ardından yeni bir buton nesnesi koyalım ve bu buton üzerine basıldığında “SecondView” sayfasındaki “secondText” değeri değişsin.
Uygulamayı Test Edelim
Artık uygulamamızı bitirdik. Şimdi ise en eğlenceli kısmına geldik. Uygulamamızı “Play” ikonlu butona tıklayıp çalıştıralım ve test edelim.
Bir yazımızın daha sonuna geldik. Bu yazımızda SwiftUI içerisinde sıkça kullanılan @Binding
ve @State
ön eklerini ele aldık. Anlamadığınız herhangi bir yer olursa sosyal medya hesaplarımız üzerinden bizimle iletişime geçebilirsiniz. Bir sonraki yazımızda görüşmek dileğiyle!🤗
Swift Öğrenin. Uygulama Geliştirin. Sınırların Ötesine Geçin.
Hem kod yazmaya yeni başlayanların hem de profesyonellerin rahatlıkla takip edebilecekleri 40 saatlik videolu eğitim ile Swift programlama dilini derinlemesine keşfedin. Eğitim boyunca karşılaşacağınız problemleri birebir online görüşmelerde çözün.