SwiftUI: ForEach
ForEach objesi sayesinde bir objeyi birden fazla şekilde uygulama arayüzünüzde sıralayabilirsiniz.
Merhaba TurkishKit okuyucuları. Bu yazımızda, ForEach
objesinin ne olduğunu ve nasıl kullanabileceğimizi öğreneceğiz. Eğer sizler de hazırsanız başlayalım! 🤙🏻
ForEach Nedir?
ForEach
objesine göre bir dizi sağlarsınız, öğelerinizin her birini benzersiz bir şekilde nasıl tanımlayabileceğini de söylemeniz gerekebilir, böylece değerler değiştiğinde bunları nasıl güncelleyeceğini bilir. Ayrıca döngüdeki her öğe için bir görünüm oluşturmak üzere çalıştırılacak bir işlev de iletmeniz gerekir.
ForEach Fonksiyonuna Genel Bakış
Yeni bir SwiftUI projesi oluşturalım ve kodlamaya başlayalım.
body
içerisine bir Form
objesi oluşturalım. ForEach
yapımızı kullanmak için aşağıdaki kodları yazalım. Bu şekilde 100 tane Text
objesini kolayca sıralayabildik.
Form {
ForEach(0 ..< 100) {
Text("Row \($0)")
}
}
ForEach
yapısını kullanarak kolayca şu görüntüyü elde edebildik. 👇🏻
Picker ile ForEach
Picker
objesi ile uygulamanızın kullanıcılarını sadece istenilen verileri (istenilen şekilde) girmesini garanti altına almış olursunuz. Şimdi ForEach
objesini kullanalım.
body
içerisinde az önceki yaptığımız değişiklikleri silelim ve aşağıdaki özellikler tanımlayalım.
let selectWord = ["Sinan", "TurkishKit", "Janus"]
@State private var selectedName = "Sinan"
Picker
objelerimizi oluşturalım. Ardından Picker
objelerimiz içerisinde kullanacağımız ForEach
yapısı için aşağıdaki kodları yazalım.
Picker("", selection: $selectedName) {
ForEach(0 ..< selectWord.count) {
Text(self.selectWord[$0])
}
}
Bu şekilde bir basit bir Picker
objesi oluşturmuş olduk!
ForEach Yapısında Identifiable Kullanımı
Projemizin bir önceki basamaklarında hızlıca “row” oluşurmayı ve Picker
objesi ile ForEach
objesini oluşturmayı öğrendik. Şimdi gelin kod dizinimizde özel türlerimiz varsa id
sayesinde onları “benzersiz” olarak tanımlayalım. İlk yapacağımız örnekte Identifiable
olmayacak.
İlk önce “Result” adında aşağıdaki gibi bir yapı oluşturalım.
struct Result {
let id = UUID()
let score: Int
}
UUID
sayesinde id
özelliğini benzersiz (unique) bir değer olduğunu tanımladık, çünkü UUID
değeri her tanımlandığında farklı bir değer döndürür. Bu yüzden UUID
ile tanımlanan objelerin hepsinin UUID
değeri farklıdır.
Şimdi ise birden fazla Text
objesini dikey olarak sıralamak için aşağıdaki kodları yazalım.
struct ContentView: View { // MARK: - Properties
let results = [Result(score: 8), Result(score: 5), Result(score: 10)] // MARK: - UI Elements
var body: some View {
VStack {
ForEach(results, id: \.id) { result in
Text("Result: \(result.score)")
}
}
}
}
Elde ettiğimiz sonuç şu şekilde görünecek. 👇🏻
Şimdi gelin bunu Identifiable
protokolümüzü kullanarak gerçekleştirelim. En üstte bulunan Result
yapımızı Identifiable
olarak tanımlayalım.
struct Result: Identifiable { // MARK: - Properties
let id = UUID()
let score: Int
}
Ardından ForEach
objemizin içerisindeki id
parametresini silelim. Identifiable
protokolü sayesinde bir üstteki elde ettiğimiz sonucu bu şekilde elde etmiş olacağız.
Bir makalemizin daha sonuna gelmiş bulunuyoruz. Bu yazımızda ForEach
yapısını ele aldık ve hangi protokollerle ve yapılarla kullanabiliriz öğrenmiş olduk. İlerleyen zamanlarda yeni makalelerimizde görüşmek üzere, hoşça kalın! 🤙🏻