Column


Column es un widget que muestra sus hijos en una matriz vertical.

Para hacer que un hijo se expanda para llenar el espacio vertical disponible, envuelva al hijo en un widget Expanded.

El widget de la columna no se desplaza (y en general se considera un error tener más hijos en una columna de los que caben en el espacio disponible). Si tiene una línea de widgets y desea que se desplacen si no hay suficiente espacio, considere usar un ListView.

Si lo que busca es una versión horizontal de la Columna, vea Fila (Row)

Column(
  children: <Widget>[
    Text('Mi linea de texto 1'),
    Text('aprendiendo en Flutter-es.com'),
    Container(color: Colors.orange,),
  ],
)

El código de ejemplo, crea una columna de 3 elementos, 2 lineas de texto, y un tercer Container de fondo naranja que se Expande para ocupar el resto del espacio disponible en la columna.

Propiedades

Algunas de las propiedades más importantes de un Column son:

  • childrenList<Widget>, La lista de widgets que se alinearán dentro de  esta columna.
  • crossAxisAlignmentCrossAxisAlignment, Como se alinean los hijos a lo largo del eje transversal.
  • directionAxis, La dirección a utilizar como eje principal.
  • mainAxisAlignment → MainAxisAlignment, Como se alinean los hijos a lo largo del eje principal.
  • mainAxisSize → MainAxisSize, Cuanto espacio en el eje principal será ocupado, puedes utilizar MainAxisSize.min para que la columna ocupe solo el espacio de los hijos, o MainAxisSize.max (default) que hace que la columna se adapte al espacio disponible verticalmente.
  • textDirection → TextDirection, Determina el orden de colocar a los hijos horizontalmente y cómo interpretar el inicio y el final en la dirección horizontal.

Este widget no puede faltar en tus aplicaciones, ya que habrá algín momento en el que deberás colocar widgets ordenados uno bajo el otro.

 

Hasta la próxima! 😀


Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *