Flutter, Google tarafından geliştirilen açık kaynaklı bir mobil uygulama geliştirme çerçevesidir. Flutter, performansı yüksek, hızlı ve güzel uygulamalar oluşturmak için kullanılabilecek birçok widget’ı içerir. Bu widget’lar arasında, uygulama arayüzünde dikey bir sıralama yapmak için kullanılan Column widget’ı bulunur.

Flutter Column Widget Nedir?

Flutter’da Column widget’ı, dikey bir düzen sağlamak için kullanılır. Column widget’ı, altında sıralanan çocuk widget’ları olan dikey bir widget’lardan oluşur. Column widget’ı, dikey olarak alt alta sıralanan ve ayrı ayrı sıralanabilen widget’lar içerebilir.

Column widget’ı, altında sıralanan her bir widget’ın genişliğini alır ve genişliği en geniş olan widget’a uyacak şekilde boyutlandırır. Bu, farklı genişliklerdeki widget’lar arasında eşit bir boşluk bırakarak dikey olarak hizalama sağlar. Column widget’ı, diğer widget’larla birlikte kullanılarak daha karmaşık arayüzler oluşturulabilir.

Flutter Column Widget Özellikleri Nelerdir?

Column widget’ı, altında sıralanan widget’ların hizalama, genişlik ve diğer özelliklerini kontrol etmek için birçok özellik sunar. Bazı önemli özellikler şunlardır:

1. mainAxisAlignment: Dikey olarak hizalamayı kontrol etmek için kullanılır. Column widget’ı altında sıralanan widget’ların başlangıç, orta veya sona hizalanmasını sağlar.
2. crossAxisAlignment: Dikey eksende sıralanmış widget’ların yatay hizalamasını kontrol etmek için kullanılır. Column widget’ı altında sıralanan widget’ların sol, orta veya sağa hizalanmasını sağlar.
3. mainAxisSize: Column widget’ının boyutunu kontrol etmek için kullanılır. Column widget’ının içeriği boyunca genişleme veya daralma özelliğini kontrol eder.
4. children: Column widget’ı altında sıralanan widget’ları içeren bir liste.

Flutter Column Widget Kullanımı

Flutter Column widget’ı, dikey olarak sıralanan widget’lar için çok kullanışlıdır. Örneğin, bir liste veya form elemanları gibi dikey düzenler oluşturmak için kullanılabilir.

Örneğin, bir Column widget’ı kullanarak basit bir dikey düzen oluşturabiliriz:

Column(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.center,
  children: <Widget>[
    Text('Merhaba'),
    Text('Flutter'),
    Text('Dünya!'),
  ],
),

Yukarıdaki kodda, Column widget’ı üç farklı Text widget’ını içerir. mainAxisAlignment ve crossAxisAlignment özellikleri, widget’ların dikey ve yatay hizalamasını kontrol eder. mainAxisAlignment özelliği, widget’ları dikey olarak hizalar ve alt alta yerleştirme imkanı verir