Column

Le widget Column est utilisé pour aligner ses enfants de manière verticale, les uns sous les autres. Il permet de créer des mises en page flexibles où les enfants sont empilés verticalement dans l'ordre où ils sont définis.

Voici un exemple simple d'utilisation du widget Column en Flutter :

 Column(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.center,
  children: <Widget>[
     Text('Élément 1'),
     Text('Élément 2'),
     Text('Élément 3'),
     ],
), 

Voici une description complète des propriétés les plus couramment utilisées du widget Column :

• mainAxisAlignment : Cette propriété définit comment les enfants sont alignés verticalement dans la colonne. Les valeurs possibles sont :

  • MainAxisAlignment.start : Les enfants sont alignés en haut de la colonne.

  • MainAxisAlignment.end : Les enfants sont alignés en bas de la colonne.

  • MainAxisAlignment.center : Les enfants sont centrés verticalement dans la colonne.

  • MainAxisAlignment.spaceBetween : Les enfants sont répartis de manière égale dans la colonne, avec un espace égal entre chaque enfant mais pas avant le premier ou après le dernier enfant.

  • MainAxisAlignment.spaceAround : Les enfants sont répartis de manière égale dans la colonne, avec un espace égal autour de chaque enfant.

  • MainAxisAlignment.spaceEvenly : Les enfants sont répartis de manière égale dans la colonne, avec un espace égal entre chaque enfant, y compris avant le premier et après le dernier enfant.

• crossAxisAlignment : Cette propriété définit comment les enfants sont alignés horizontalement dans la colonne. Les valeurs possibles sont :

  • CrossAxisAlignment.start : Les enfants sont alignés à gauche de la colonne.

  • CrossAxisAlignment.end : Les enfants sont alignés à droite de la colonne.

  • CrossAxisAlignment.center : Les enfants sont centrés horizontalement dans la colonne.

  • CrossAxisAlignment.stretch : Les enfants sont étirés pour remplir l'espace horizontal disponible.

  • CrossAxisAlignment.baseline : Les enfants sont alignés en fonction de leur ligne de base commune. Cette option est utile lorsque vous avez des enfants avec du texte et que vous voulez les aligner par leur ligne de base.

• mainAxisSize : Cette propriété définit la taille principale de la colonne en fonction de la taille de ses enfants ou de l'espace disponible. Les valeurs possibles sont MainAxisSize.max (la colonne occupe toute la hauteur disponible) et MainAxisSize.min (la colonne est aussi petite que possible pour contenir ses enfants).