Column

Column

Column

MaterialApp({ title,theme, home: Scaffold({ appBar, body: Column( mainAxisAlignment, crossAxisAlignment, textDirection, verticalDirection, children, ), }), })

açıklama

Kolon çerçeve. children widgetleri dikeyde alt alta dizer.

konum

MaterialApp({ title,theme, home: Scaffold({ appBar, body: Column( mainAxisAlignment, crossAxisAlignment, textDirection, verticalDirection, children, ), }), })

parametreler

Column(   
      mainAxisAlignment: MainAxisAlignment.start,  // children widgetlerin içeride dikeyde nereden itiabaren konumlanmaya başlayacağini belirtir. Örmekte yukarıdan asağıya dikey hareket.              
      mainAxisSize: MainAxisSize.max,       // ana eksenin boyutu nu  belirler.Örnekte kolonlar dikeyde maxsimun esnesin.
      crossAxisAlignment: CrossAxisAlignment.center,  // cildren widgetlerin içeride dikey olarak ustuste gelen widgetlerin yatayda hangi sekilde açapraz konumlanacağını belirtir. Örnekte ayatayda merkezde konumlansın.
      textDirection, // children widgetlerin içindeki metinlerin yazı yönü nasıl olsunu belirler.
      verticalDirection: VerticalDirection.down, // child widgetlerin sıralamasını belirler.Şu soruya cevap verir:sıradaki widget nereye geçsin.Örnekte yeni gelecek child widget öncekinin arkasında sıraya geçer.
      children: const [] 
)

örnek uygulama

column-orn
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Building layouts"),
        ),
        body: myLayoutWidget(),
      ),
    );
  }
}

Widget myLayoutWidget() {
  return Column(
    children: [
      Icon(Icons.home),
      Icon(Icons.home),
      Icon(Icons.home),
      Icon(Icons.home),
    ],
  );
}

Bir cevap yazın