Selam! Sizlere iOS ve macOS üzerinde kullanıcı arayüzleri oluşturmaya yönelik bir çerçeve olan   bahsetmek istiyorum. Programlamaya bildirimsel bir yaklaşım kullandığı için kullanımı çok uygundur. SwiftUI ile arayüzünüzün ne yapması ve nasıl görünmesi gerektiğini tanımlayabilirsiniz; gerisini çerçeve halledecektir. SwiftUI'dan  SwiftUI'nin temel unsurlarından biri özellik sarmalayıcıların kullanılmasıdır. Bunlar, özellikler için ek mantık sağlamanıza olanak tanıyan işlevsel öğelerdir.  SwiftUI'nin  beş ana özellik sarmalayıcısı vardır:   @Durum   @Bağlama   @ObservedObject   @StateObject   @EnvironmentObject  Gelişim aşamasında en iyi arkadaşlarınız olacaklar.   @Durum    değiştirilebilecek özellikler oluşturmanıza ve gerekirse bu değişikliklere göre arayüzü güncellemenize olanak tanır. Örneğin, basıldığında rengi değişen bir düğme oluşturmak istiyorsanız, rengi depolamak ve düğmeye eklemek için bir @State değişkeni oluşturabilirsiniz: @State,   struct MyButton: View { @State var buttonColor = Color.blue var body: some View { Button("Press me!") { buttonColor = Color.red } .background(buttonColor) } }  @Bağlama      Genellikle SwiftUI'da bir değeri bir görünümden diğerine aktarmak ve bunların birbirleriyle etkileşime girmesine olanak sağlamak için kullanılır. Örneğin, biri metin alanına sahip, diğeri düğmeli olmak üzere iki görünümümüz olduğunu hayal edin. Kullanıcı butona bastığında metin alanının güncellenmesini istiyoruz. Bunu yapmak için @Binding'i kullanabiliriz: @Binding, kodun bir bölümünde depolanan bir değeri kodun başka bir bölümünde kullanmanıza olanak tanır.   struct ContentView: View { @State private var text = "" var body: some View { VStack { TextField("Enter text", text: $text) Button("Update text") { text = "New text" } SecondView(text: $text) } } } struct SecondView: View { @Binding var text: String var body: some View { Text(text) } }  Bu örnekte   , değeri   (   bulunan)   (   bulunan) geçirmek için kullanılır, böylece kullanıcı düğmeye bastığında metin alanı güncellenir ve yeni metni görüntüler. @Binding $text'ten ContentView'da metne SecondView'da   @ObservedObject      özellikleri işaretlemek için kullanılır   Bu özellik sarmalayıcı,   uygun olan nesnedeki değişikliklere abone olur ve veriler değiştiyse arayüzün ilgili bölümlerini otomatik olarak günceller. İşte   kullanımına ilişkin kısa bir örnek: @ObservedObject, gözlemlenen ve dış veri değişikliklerine bağlı olarak değişebilecek . ObservableObject protokolüne @ObservedObject   class UserData: ObservableObject { @Published var name = "John" } struct ContentView: View { @ObservedObject var userData = UserData() var body: some View { VStack { Text("Hello, \(userData.name)!") TextField("Enter your name", text: $userData.name) } } }  Bu örnekte, @Published adını içeren UserData adında bir sınıf oluşturuyoruz. ContentView yapısında   userData.name değerini bir metin alanında görüntülüyor ve ekrana çıktısını veriyoruz. @ObservedObject kullanarak UserData tipinde userData adında bir özellik oluşturuyoruz.  Kullanıcı     özelliği   Bu, arayüzü güncellemek için kendi kodumuza ihtiyacımız olmadığı ve SwiftUI'nin bunu bizim için yapmasına izin verdiğimiz anlamına gelir. metin alanındaki değeri değiştirdiğinde, name @Published kullanılarak yayınlanıp gözlemlendiğinden, SwiftUI arayüzün ilgili bölümünü otomatik olarak günceller.    Bilmiyorsanız @Published, Combine çerçevesinden bir sınıf veya yapı özelliğine eklenebilen ve o özelliğin değerindeki değişikliklere ilişkin bildirimleri o özelliğe abone olan herkese otomatik olarak gönderen bir özellik sarmalayıcıdır. . Başka bir deyişle, değişiklikler açısından izlenebilecek özellikler için yardımcı bir özelliktir. Not:   @StateObject      Bu, nesnenin görünüm var olduğu sürece saklandığı ve onunla birlikte yok edildiği anlamına gelir. Genellikle   kullanılması, yalnızca bir görünüm için değil, birden   görünüm için gerekli olan sınıf nesneleri için daha pratiktir   Örneğin: @StateObject, bir sınıf nesnesini başlatmak ve onu SwiftUI'deki görünüm durumunda saklamak için kullanılan bir özellik sarmalayıcıdır. @StateObject'in çok .   class UserData: ObservableObject { @Published var name = "John" @Published var age = 30 } struct ContentView: View { @StateObject var userData = UserData() var body: some View { NavigationView { VStack { Text("Name: \(userData.name)") Text("Age: \(userData.age)") NavigationLink( destination: ProfileView(userData: userData), label: { Text("Edit Profile") }) } .navigationTitle("Home") } } } struct ProfileView: View { @ObservedObject var userData: UserData var body: some View { Form { TextField("Name", text: $userData.name) Stepper("Age: \(userData.age)", value: $userData.age) } .navigationTitle("Profile") } }  Bu örnekte   , birden çok görünümde kullanılabilecek çeşitli özellikleri içeren bir sınıfın nesnesidir. Sınıf,   ve   ile kullanılabilmesi için   olarak işaretlenmiştir. UserData @StateObject @ObservedObject ObservableObject    farklı görünümler arasındaki geçişler arasındaki durumu kaydetmek için   kullanarak yeni bir   nesnesi oluşturuyoruz. Bu durumda   , kullanıcı verilerini görüntüler, görselleştirir ve kullanıcı verilerini düzenlemek için kullanılabilecek başka bir görünüme   bağlantı içerir. ContentView'da, @StateObject'i UserData ContentView (ProfileView)    , kullanıcı verilerini değiştirmek için   kullanarak aynı   nesnesine erişim sağlıyoruz. Kullanıcı verileri değiştirdiğinde, aynı   nesnesi kullanıldığı için veriler   otomatik olarak güncellenir. ProfileView'da @ObservedObject'i UserData UserData ContentView'da    Bir sınıf nesnesindeki değişiklikleri tek bir görünümden gözlemlemeniz gerekiyorsa @ObservedObject'i ve birden fazla görünümün görüntülenmesini etkileyen bir sınıf nesnesinin durumunu kaydetmeniz gerekiyorsa @StateObject'i kullanın. Not:   Birden fazla görünümde ihtiyaç duyulan bir nesne için @StateObject yerine @ObservedObject kullanırsanız, her görünüm nesnenin kendi örneğine sahip olur ve bu da görünümler arasındaki veri senkronizasyonunda sorunlara yol açabilir. Bu nedenle bu durumda @StateObject kullanmak daha iyidir.   @EnvironmentObject      SwiftUI hiyerarşisindeki Ortam kapsayıcısına ait herhangi bir görünümden (örneğin, Sahne, Görünüm, Uygulama vb.) veri nesnesine erişime izin verir. Örneğin, bir görev listesi yönetimi uygulamamız olduğunu düşünün. Görevlerin bir listesini ve yeni görevler oluşturma yeteneğini içeren bir kök   sahip olabiliriz. Bunun için görevlerin listesini görüntüleyen ayrı bir   görünümü ve yeni görevler eklemek için bir düğme oluşturuyoruz. Yeni bir görev ekledikten sonra kullanıcının görev ekleme ekranına yönlendirilmesi gerekiyor, böylece ayrı bir   görünümü oluşturuyoruz. @EnvironmentObject, veri nesnelerini SwiftUI görünüm hiyerarşisi aracılığıyla iletmek için kullanılan bir özellik sarmalayıcıdır. ContentView'a TaskListView AddTaskView    nesnesini her üç görünüme de geçirmek için, bunun örneğini   oluşturabilir ve ardından bunu hem   hem de   parametre olarak iletebiliriz. Ancak, daha fazla iç içe görünüm eklemeye karar verirsek,   birçok ara görünümden geçirmemiz gerekeceğinden, bu bir sorun haline gelebilir. UserManager ContentView'da TaskListView AddTaskView'a UserManager'ı  Bunun yerine,   görünüm hiyerarşisinde aşağıya aktarmak için   kullanabiliriz. Bu şekilde,   erişmesi gereken tüm görünümler, onu basitçe bir   olarak ilan edebilir ve gerektiğinde kullanabilir. UserManager'ı @EnvironmentObject'i UserManager'a @EnvironmentObject   struct TaskManagerApp: App { @StateObject var userManager = UserManager() var body: some Scene { WindowGroup { ContentView() .environmentObject(userManager) } } } struct ContentView: View { var body: some View { NavigationView { TaskListView() } } } struct TaskListView: View { @EnvironmentObject var userManager: UserManager var body: some View { List(userManager.tasks) { task in TaskRow(task: task) } .navigationBarTitle("Tasks") .navigationBarItems(trailing: Button(action: { // Navigate to AddTaskView }) { Image(systemName: "plus") } ) } } struct AddTaskView: View { @EnvironmentObject var userManager: UserManager var body: some View { // Add new task using userManager } }  Böylece, artık   nesnesi   aracılığıyla otomatik olarak   ve   aktarılacaktır.   durumunu bir görünümde değiştirebileceğimizi ve değişikliklerin otomatik olarak diğer görünüme yansıtılacağını unutmayın.  UserManager @EnvironmentObject TaskListView AddTaskView'e UserManager'ın  Makale temel SwiftUI özellik paketleyicilerini kapsıyordu:  @State, @Binding, @ObservedObject, @StateObject, @EnvironmentObject.  Bu özellik sarmalayıcılar, SwiftUI'de uygulama durumuyla çalışmanın temelini oluşturur. SwiftUI ile uygulamalar geliştirmek için gerekli olan temel özellik paketleyicilerinin parmaklarınızın ucunda olması için bu makaleyi bir yardımcı sayfa olarak kullanın. Bu bilgiyi uygulayarak, dinamik olarak değişen durumlarla daha karmaşık kullanıcı arayüzleri oluşturabilecek ve modellerinizdeki verileri SwiftUI'ye entegre edebileceksiniz.

The code in this story is for educational purposes. The readers are solely responsible for whatever they build with it.

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

Read My Stories

Bu ses hikayenin orijinal dilinde üretilmiştir!

SwiftUI'nin 5 Ana Özellik Paketleyicisi ve Bunların Etkili Bir Şekilde Kullanılması

About Author

YORUMLAR

ETİKETLERİ ASIN

BU YAZI

Related Stories

Floki'den Valhalla Hindistan'ın Sri Lanka Turuna Yardımcı Sponsor Olarak Katıldı

Forumlardan Feed'lere: Sosyal Medya Algoritmaları Dijital Etkileşimi Nasıl Şekillendiriyor

HackerNoon Yazma Yarışmasını mı Kazanmak İstiyorsunuz? İşte #crypto-api Yarışması Kazananlarının Önerileri

Bu 18 Geliştirici Aracıyla Üretkenliğinizi Artırın 🚀🔥

Floki'den Valhalla Hindistan'ın Sri Lanka Turuna Yardımcı Sponsor Olarak Katıldı

Forumlardan Feed'lere: Sosyal Medya Algoritmaları Dijital Etkileşimi Nasıl Şekillendiriyor

HackerNoon Yazma Yarışmasını mı Kazanmak İstiyorsunuz? İşte #crypto-api Yarışması Kazananlarının Önerileri

Bu 18 Geliştirici Aracıyla Üretkenliğinizi Artırın 🚀🔥

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps