Artık SwiftUI bize göz kırpmışken bir yandan da kenardan kenardan SwiftUI’a yanaşayım dedim. SwiftUI ile ilgili List bileşeninden başlayarak öğrendikçe notlarımı sizlerle paylaşacağım.
List{
// Listenecek Bileşenler
}
En basit hali ile yukarıdaki gibi tanıyabilirsiniz List bileşenini. Bir çok farklı kullanımı mevcut elbette. Tabi ki içerisinde bazı View’lar olması gerekiyor. Örneğin text bileşeni ile kullanalım.
List {
Text("deneme1")
Text("deneme2")
Text("deneme3")
Text("deneme4")
Text("deneme5")
}
Yukarıdaki kod bize görseldeki gibi bir görüntüyü çıkaracaktır. Sadece görseldeki gibi Text() bileşeni ile değil, farklı bileşenleri de barındırabiliyor List() bileşeni. Aşağıda bir kaç örnek daha paylaşacağım.
Farklı Bileşenlerin List İçerisinde Kullanımı
Bir başka yazıda ZStack, HStack ve VStack kullanımlarından bahsedeceğim. Aslında ilk bahsetmem gereken konu buydu. Fakat hızlı öğrenilecek konular olduğu için örneklerin içinde görebilirsiniz kullanımlarını. Ben şimdilik öncelik verme gereği duymadım.
List {
HStack{
Image("avatar").resizable()
.frame(width: 25, height: 25, alignment: .center)
Text("Deneme 2")
}
HStack{
Image("avatar").resizable()
.frame(width: 25, height: 25, alignment: .center)
Text("Deneme 2")
}
}
Yukarıdaki örnekte gördüğünüz gibi HStack bileşenlerin yanyana gelmesini sağlıyor. Yatay bir düzlem oluşturuyor. Örnekte Image() kullanımı da yukarıda gördüğünüz gibi.
Dilediğiniz gibi SwiftUI içerisinde kullanılabilen bir çok bileşeni List içerisinde kullanabilirsiniz.
List İçerisinde Array Listeleme
List hepimiz için ForEach döngüsü ile aynı şekilde, aşağıdaki gibi kullanımı da mevcuttur. 3 elemandan oluşan bir arkadaşlar dizisi tanımlayalım.
var arkadaslar = ["Fatma","Emine","Deniz"]
Sonrasında List içerisinde arkadaşlarımızı az önceki kodu güncelleyerek listeleyelim.
List(arkadaslar, id: \.self) { arkadas in
HStack{
Image("avatar").resizable()
.frame(width: 25, height: 25, alignment: .center)
Text(arkadas)
}
}
Bu örnekte de text alanları arkadaş isimleri ile değişmektedir.