Flutter Widgets - Column

Das Flutter Widget - Column

Wie schon an anderer Stelle in diesem Blog geschrieben, programmiert man die grafische Oberfläche in Flutter  mit Widgets. Eines dieser Layout Widgets ist das Column Widget.

new Column(
    children: [
      new Text('Erste Linie Text'),
      new Text('Zweite Linie Text'),
      new Text('Dritte Linie Text'),
    ],
)
Dieses Widgets stellt seine "Kinder" vertikal dar, in diesem Beispiel drei Zeilen Text. Wichtig dabei ist, das dieses Widget nicht scrollt, d.h. gibt man mehr "Kinder" an, als auf dem Bildschirm dargestellt werden können, kann man nicht scrollen. Es werden einfach diejenigen angezeigt, die auf dem Bildschirm Platz haben.


Die Grundeinstellung, also ohne die Angabe von zusätzlichen Atributen, stellt die Kinder vertikal und zentriert dar. Die Breite dieser "Column" ergibt sich dabei aus ihrem breitesten Child. Zentriert heisst in diesem Zusammenhang, nicht zentriert auf den Bildschirm, sondern zentriert innerhalb der von Flutter berechneten Breite der Children.

Das Verhalten des Inhalts dieser Column, zentriert, linksbündig, rechtsbündig etc..kann ebenfalls vom Programmierer gesteuert werden:

new Column(
    crossAxisAlignment: crossAxisAlignment.start,
    children: [
      new Text('Erste Linie Text'),
      new Text('Zweite Linie Text'),
      new Text('Dritte Linie Text'),
    ],
)

In diesem Fall werden  mit crossAxisAlignment.start der Inhalt der Children linksbündig angeordnet.
Column Class