SwiftUI ile iOS Arayüz Geliştirme: İlk Ekrandan Durum Yönetimine

SwiftUI'da arayüz nasıl düşünülür?

SwiftUI, arayüzü bildirimsel olarak tanımlayan Apple çerçevesidir. Eski yaklaşımda bir düğmeye basıldığında hangi etiketin nasıl değişeceğini adım adım siz yazarsınız. SwiftUI'da ise ekranın, verinin belirli bir durumunda nasıl görünmesi gerektiğini tarif edersiniz; durum değiştiğinde sistem arayüzü yeniden hesaplar.

Bu bakışın özü şu cümledir: arayüz, durumun bir fonksiyonudur. Bir görev listesi uygulamasında "görevler dizisi" durumdur; ekrandaki liste, bu diziden üretilen bir tariftir. Diziye bir öğe eklediğinizde listeyi güncellemek için ayrı kod yazmazsınız, çerçeve farkı kendisi bulur.

Görünümler (View) küçük, birleştirilebilir parçalardır. Bir metin, bir düğme, bir liste, bir yığın birer görünümdür ve birbirinin içine yerleştirilerek ekranı oluşturur. Biçim (yazı tipi, dolgu, renk) görünüme eklenen değiştiriciler (modifier) ile verilir. Ekranı küçük görünümlere bölmek hem okunabilirliği hem yeniden kullanımı artırır.

İlk ekranı adım adım kurmak: görev listesi

Örneğin bir yapılacaklar uygulamasının listesini yazalım. Önce veri modelini tanımlayın:

struct TaskItem: Identifiable { let id = UUID() var title: String var isDone = false }

Identifiable, her öğenin kararlı bir kimliği olduğunu söyler ve listenin hangi satırın değiştiğini doğru izlemesini sağlar. Şimdi ekranı yazalım:

struct TaskListView: View { @State private var tasks = [ TaskItem(title: "Rapor taslağını hazırla"), TaskItem(title: "Toplantı notlarını paylaş") ] @State private var newTitle = ""

var body: some View { VStack { HStack { TextField("Yeni görev", text: $newTitle) Button("Ekle") { tasks.append(TaskItem(title: newTitle)) newTitle = "" } } List { ForEach($tasks) { $task in Toggle(task.title, isOn: $task.isDone) } } } } }

Bu kodda dikkat edilecek noktalar şunlardır. @State, görünümün sahip olduğu yerel durumu işaretler; değiştiğinde body yeniden hesaplanır. Dolar işaretli ifade ($newTitle) bir bağlama (Binding) verir: metin alanı bu değeri hem okur hem değiştirir. ForEach ile liste, tasks dizisinden üretilir ve her satırın anahtarı Identifiable kimliğidir. Yeni bir görev eklemek için ekranı güncelleyen hiçbir kod yoktur; dizi değişir, arayüz kendini yeniler.

Durum yönetimi: durumu doğru yerde tutmak

SwiftUI'nın en kritik becerisi durumun nerede tutulacağına karar vermektir. Temel kural: durumun tek bir sahibi olmalı, diğerleri ona bağlama ile erişmelidir.

• Yerel ve geçici durum (bir metin alanı, açılır panel): görünümün kendi @State alanında tutulur.
• Alt görünüme verilen ve orada değiştirilebilen durum: üst görünüm @State ile tutar, alt görünüme Binding olarak geçirir.
• Birden çok ekranda paylaşılan durum: ayrı bir model nesnesinde tutulur ve çevre aracılığıyla ya da parametre olarak görünümlere iletilir (örneğin EnvironmentObject). Hangi mekanizmanın güncel ve önerilen olduğu çerçevenin sürümüne göre değiştiğinden, kullandığınız Xcode sürümünün belgesine bakın.
• Kalıcı veri: görünümde değil, veri katmanında tutulur; görünüm yalnızca onu gözlemler.

Sık hata, aynı veriyi birden çok yerde ayrı kopyalar olarak tutmaktır; kopyalar ayrışır ve ekran tutarsız görünür. Tek doğruluk kaynağı ilkesi burada da geçerlidir.

Gezinme ve liste: NavigationStack ile ekranlar arası geçiş

Birden fazla ekran arasında geçiş için NavigationStack kullanılır. Listenin satırına dokunulduğunda ayrıntı ekranını açmak şöyle yazılır:

NavigationStack { List(tasks) { task in NavigationLink(task.title) { TaskDetailView(task: task) } } .navigationTitle("Görevler") }

NavigationStack, ekranları bir yığın olarak yönetir ve geri düğmesini otomatik sağlar. Veriye dayalı gezinme için hedefin bir veri değerine bağlanıp programatik olarak yığına eklenmesi de mümkündür; bu, derin bağlantı ve uygulama içi yönlendirme gibi durumlarda kullanışlıdır.

Liste performansında şu kurallar işe yarar. İlk olarak, satırların kararlı kimliğe sahip olmasıdır; kimlik her hesaplamada değişirse (örneğin her seferinde yeni UUID üretilirse) tüm satırlar baştan kurulur. Bir diğeri, satır görünümünün hafif tutulmasıdır; ağır hesaplamalar satır içinde değil, model katmanında yapılmalıdır.

Öğrenme yolu: başlangıçtan ileriye

Başlangıç aşamasında önce Swift dilinin temellerini (değişkenler, opsiyoneller, yapılar, koleksiyonlar, kapamalar) öğrenin, çünkü SwiftUI dilin özelliklerini yoğun kullanır. Ardından Xcode'un önizleme paneliyle küçük görünümler yazın: metin, görsel, düğme, yığınlar ve bunları biçimleyen değiştiriciler.

Orta aşamada durum yönetimini (yerel durum, bağlamalar, paylaşılan model) ve liste ile gezinmeyi çalışın. Küçük ama tamamlanmış bir uygulama yazmak (yapılacaklar, harcama takibi, tarif defteri) bilgiyi pekiştirmenin etkili bir yoludur.

İleri aşamada mimari ve test edilebilirlik öne çıkar: görünüm modeli kullanarak mantığı görünümden ayırmak, ağ ve veri katmanını arayüzden bağımsız kılmak, erişilebilirlik (ekran okuyucu etiketleri, yazı tipi ölçekleme), yerelleştirme ve performans ölçümü. Mevcut UIKit tabanlı bir uygulamaya SwiftUI ekranlarını kademeli olarak katmak da kurumsal projelerde yaygın bir yoldur.

Sık yapılan hatalar

• Her şeyi tek bir dev görünüme yazmak: body uzadıkça okunması ve önizlemesi zorlaşır. Mantıksal parçaları ayrı görünümlere bölün.
• Ağ isteğini ve iş mantığını görünümün içinde yazmak: Test edilemez ve yeniden kullanılamaz hale gelir. Bu işleri ayrı bir model katmanına taşıyın.
• Durumu yanlış sahipte tutmak: Alt görünümün kendi kopyasını @State yapması, üst görünümle ayrışmaya yol açar. Bağlama kullanın.
• Kararsız kimlik üretmek: Listede kimlik her hesaplamada değişirse animasyonlar bozulur ve performans düşer.
• Önizlemeyi kullanmamak: Farklı durumlar (boş liste, uzun metin, büyük yazı tipi) için önizleme yazmak, birçok hatayı çalıştırmadan yakalar.
• Çerçeve sürümlerini gözetmemek: SwiftUI hızla gelişir; kullandığınız özelliğin hedeflediğiniz iOS sürümünde bulunduğunu belgeden doğrulayın.

SwiftUI mi UIKit mi?

Ölçüt: Başlangıç hızı. SwiftUI: Daha az kodla ekran kurulur, önizleme geri bildirimi hızlıdır. UIKit: Daha fazla kurulum gerekir ama uzun yıllık olgun bir ekosistemi vardır.

Ölçüt: Kontrol düzeyi. SwiftUI: Standart bileşenlerde çok verimlidir; çok özel davranışlarda sınırlara denk gelebilir. UIKit: Alt düzey kontrol sunar.

Ölçüt: Mevcut kod. SwiftUI: Yeni projeler ve yeni ekranlar için doğal tercihtir. UIKit: Büyük mevcut uygulamalar genellikle UIKit tabanlıdır.

Bunlar birbirini dışlamaz; SwiftUI görünümleri UIKit içinde, UIKit görünümleri de SwiftUI içinde barındırılabilir. Kurumsal ekipler genellikle yeni ekranları SwiftUI ile yazıp eskileri kademeli olarak taşır.

Bu beceriyi Mindset programlarında nerede çalışırsınız?

iOS Uygulama Geliştirme (Swift) Temelleri programı, Swift dili ve Xcode ortamından sonra SwiftUI ile modern arayüz geliştirmeyi ayrı bir modül olarak işler; UIKit temellerini de kapsadığı için mevcut uygulamalarla çalışacaklara hazırlık sağlar. Swift ile İleri Seviye iOS Geliştirme (SwiftUI) programı ise görünüm modeli ve bileşim, durum yönetimi ve veri akışı, gezinme ve liste performansı, mimari ve test edilebilirlik, erişilebilirlik ve yerelleştirme konularına daha derin biçimde girer.

Mobil ekip kurmak ya da var olan geliştiricilerini iOS'a taşımak isteyen kurumlar ile iOS'a yeni geçen yazılımcılar için uygundur.