SwiftUI: ForEach

ForEach objesi sayesinde bir objeyi birden fazla şekilde uygulama arayüzünüzde sıralayabilirsiniz.

Sinan Ulusan
TurkishKit
3 min readFeb 16, 2021

--

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! 🤙🏻

Bizi daha yakından takip etmek istiyorsanız, sosyal medya hesaplarımıza aşağıdan ulaşabilirsiniz!

Twitter | Instagram | Facebook

--

--