GridView Widget

eslemOzluk
2 min readNov 20, 2023

--

Flutter’da GridView, öğeleri tablo şeklinde göstermek için kullanılan bir grafiksel kontrol öğesidir. Bu öğeleri Flutter uygulamasında nasıl ızgara görünümünü elde edeceğiz?.

GridView, öğeleri 2 boyutlu bir dizi olarak gösteren Flutter’daki bir widget’tır (satır ve sütunlardan oluşan iki boyutlu). Adından da anlaşılacağı gibi, öğeleri bir ızgarada göstermek istendiğinde kullanılır. Bu widget, kullanıcı gereksinimlerine bağlı olarak metin, resim, simge vb. içerebilir ve bunları bir ızgara düzeninde görüntüleyebilir. Ayrıca, kaydırılabilir iki boyutlu bir widget dizisi olarak da adlandırılabilir. Kaydırılabilir olduğundan, sadece kaydırma yönünü belirleyebiliriz.

GridView çeşitli şekillerde uygulanabilir:

count() builder() custom() extent()

GridView.count() en sık kullanılanıdır çünkü burada ızgaranın boyutunu zaten biliyoruz. Geliştiricilere sabit satır ve sütun sayısını belirtme imkanı sağlar. GriedView.count() aşağıdaki özellikleri içerir:

crossAxisCount: Grid view içindeki sütun sayısını belirtmek için kullanılır. crossAxisSpacing: Çapraz eksenindeki her çocuk widget arasındaki piksel sayısını belirler.

mainAxisSpacing: Ana eksen boyunca listelenen her çocuk widget arasındaki piksel sayısını belirtir.

padding(EdgeInsetsGeometry): Tüm widget listesi etrafındaki boşluğu belirtmek için kullanılır.

scrollDirection: GridView üzerindeki öğelerin varsayılan olarak dikey olarak kaydırılıp kaydırılmayacağını belirtir.

reverse: Eğer true ise, liste ana eksen boyunca ters yönde sıralanır. physics: Kullanıcı kaydırdığında listenin sonuna veya başına geldiğinde listenin nasıl davranacağını belirler.

shrinkWrap: Eğer false ise, kaydırılabilir liste kaydırma yönünde daha fazla alan alır. Bu, bellek sızıntısını önlemek için true olarak ayarlanmalıdır.

GridView.builder() özelliği, verileri dinamik veya ihtiyaca bağlı olarak görüntülemek istediğimizde kullanılır. Başka bir deyişle, kullanıcı büyük (sonsuz) bir sayıda öğe içeren bir ızgara oluşturmak istiyorsa, GridView.builder() yapılandırıcısını ya SliverGridDelegateWithFixedCrossAxisCount ya da SliverGridDelegateWithMaxCrossAxisExtent ile kullanabilir.

Bu widget’ın yaygın özellikleri şunlardır:

itemCount: Gösterilecek veri miktarını belirtmek için kullanılır. gridDelegate: Izgara veya bölmelerini belirler. Argümanı null olmamalıdır. itemBuilder: Izgara görünümünde görüntülenecek öğeleri oluşturmak için kullanılır.

GridView.extent() özelliği ise özel boyut değerleri olan bir ızgara oluşturmak istediğimizde kullanılır. Yani her bir kutu maksimum çapraz eksen genişliğine sahiptir.

Her iki özelliği de kullanırken, itemCount gibi verilerin miktarını ve gridDelegate gibi ızgaranın şeklini belirten parametreleri kullanılır. Örneğin, itemBuilder ile her bir öğeyi oluşturur ve SliverGridDelegateWithMaxCrossAxisExtent gibi bir delegasyon tipi belirterek öğelerin nasıl görüneceğini ayarlanır. Bu özellikleri kullanarak özel ızgara düzenleri oluşturmak oldukça esnektir ve ihtiyaca yönelik çözümler sunar.

--

--