Row

Un widget que muestra a sus hijos en una matriz horizontal.

Para hacer que un child se expanda para llenar el espacio horizontal disponible, envuélvalo en un widget expanded.

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

Para una variante vertical, vea Column.

Si solo tiene un hijo, considere usar Align o Center para colocar al hijo.

Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              IconButton(
                icon: Icon(Icons.thumb_up),
                color: Colors.green,
                onPressed: (){},
              ),
              RaisedButton(
                child: Text("Botón"),
                onPressed: () {},
              ),
              FittedBox(
                fit: BoxFit.contain, // otherwise the logo will be tiny
                child: const FlutterLogo(),
              ),
            ],
          )
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'ZimbronApps Ejemplo',
      debugShowCheckedModeBanner: false,
      home: MiHome(),
    );
  }
}

class MiHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Row'),
      ),
      body: Center(
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              IconButton(
                icon: Icon(Icons.thumb_up),
                color: Colors.green,
                onPressed: (){},
              ),
              RaisedButton(
                child: Text("Botón"),
                onPressed: () {},
              ),
              FittedBox(
                fit: BoxFit.contain,
                child: const FlutterLogo(),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

El resultado del ejemplo anterior sería el siguiente:

Como podemos observar es una lista de widgets acomodados de manera horizontal, con la propiedad de alineamiento principal (MainAxisAlignment) como MainAxisAlignment.spaceEvenly, lo que agrega espacios entre los hijos del Row.

Esto es todo por hoy,

Saludos y hasta la próxima

Sobre Gustavo Zimbrón 188 artículos
Apasionado por la programación y la tecnología, me gustan los retos y aprender siempre cosas nuevas.
Subscribe
Notify of
guest

0 Comentarios
Oldest
Newest Most Voted
Inline Feedbacks
View all comments