es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Varios columnas en contenedor

26 Jul, 2023 Programación

Estoy aprendiendo Flutter, quiero lograr este aspecto: Imagen

¿El Container solo permite un hijo? Quiero tener múltiples columnas, como en la imagen necesitaré 3 para el logo, el cuadro de texto y para los dos botones. ¿Cómo configuro esto correctamente? ¿Quizás no debería usar un container?

Widget build(BuildContext context) {
  return Container(
    child: Column(
      children: [
        Text("prueba"),
        Text("prueba")
      ]
    )
  );
}

Además, ¿qué hace este código?

const MyApp({Key? key}) : super(key: key);

No he visto eso en ninguno de los tutoriales, ¿es algún tipo de constructor?

Tags:  ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para lograr el diseño mostrado en la imagen, puedes utilizar el widget Row para crear tres columnas. Dentro de cada columna, puedes usar varios widgets para lograr la apariencia deseada, como Image.asset, Container, Text y ElevatedButton. Aquí tienes un ejemplo de cómo puedes lograr el diseño deseado:

    Widget build(BuildContext context) {
  return Row(
    children: [
      Column(
        children: [
          Image.asset('path/to/logo'),
        ],
      ),
      Column(
        children: [
          Text('Este es un título'),
          SizedBox(height: 16),
          Text('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lectus orci. Integer rhoncus, lectus sed sollicitudin vestibulum, nisl erat tristique felis, nec bibendum orci nibh in nisi.'),
          SizedBox(height: 16),
          Row(
            children: [
              ElevatedButton(onPressed: () {}, child: Text('Botón 1')),
              SizedBox(width: 16),
              ElevatedButton(onPressed: () {}, child: Text('Botón 2')),
            ],
          )
        ],
      )
    ],
  );
}

    En cuanto a la segunda pregunta, MyApp({Key? key}) : super(key: key) es un constructor para un widget MyApp. El parámetro Key es opcional y permite identificar de manera única los widgets en reconstrucciones. La parte super(key: key) llama al constructor de la superclase (StatelessWidget o StatefulWidget) con el mismo parámetro.

Comments are closed.