2

Al compilar mi app sale ese warning dentro del container. me han dicho que use el widget expanded envolviendo el contenedor y no funciona.

introducir la descripción de la imagen aquí

 return Container(
  width: 500.0,
  height: 600.0,
  margin: const EdgeInsets.symmetric(horizontal: 5.0),
  decoration: BoxDecoration(
    borderRadius: const BorderRadius.all(Radius.circular(8.0)),
    color: color,
    boxShadow: const [
      BoxShadow(
        color: Colors.black,
        blurRadius: 0.0,
        spreadRadius: 0.0,
        offset: Offset(0.0, 0.0), // shadow direction: bottom right
      )
    ],
  ),
  child: Container(
    margin: const EdgeInsets.symmetric(horizontal: 15.0, vertical: 20.0),
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          margin: const EdgeInsets.only(top: 11.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Image.asset(
                logo,
                width: 50,
                height: 50,
              ),
              const Icon(Icons.favorite, color: Colors.red),
            ],
          ),
        ),
        const SizedBox(
          height: 10,
        ),
        Text(
          companyname,
          style: const TextStyle(
              fontSize: 12,
              fontWeight: FontWeight.bold,
              color: Colors.white),
        ),
        Text(
          role,
          style: const TextStyle(
              fontSize: 20,
              fontWeight: FontWeight.bold,
              color: Colors.white),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            const Icon(
              Icons.location_on,
              color: Colors.white,
              size: 15,
            ),
            Text(
              region,
              style: const TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.bold,
                  color: Colors.white),
            ),
          ],
        ),
      ],
    ),
  ),
);

} }

2 respuestas 2

3

Estas trabajando con un contenedor de tamaño fijo, si la informacion es variable a lo mejor no siempre se va ver bien, podrias cambiar a un wrap de esta forma .

return Container(
    width: 500.0,
    height: 600.0,
    child: Wrap(
      children: [
        Container()
      ],
    )
);
1
  • 1
    funciono muchas gracias <3 (y)
    – mauricio
    Commented el 25 jul. 2022 a las 21:13
1

Lo que está pasando es que estás dando medidas en pixeles dentro de la columna que están sobrepasando los límites de tu Container, entonces es claro que si tienes un vaso de agua de 200ml y le pones 250ml de una coquita parte de va a derramar.

Esto si se puede seleccionar con Expanded y Flexibles, pero te recomiendo por lo que veo de tu aplicación que empieces a usar un ListView o un CustomScrollView para que no tengas estos errores de medidas relativas.

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      debugShowCheckedModeBanner: false,
      home: const Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  const MyWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 500.0,
      height: 200.0,
      margin: const EdgeInsets.symmetric(horizontal: 5.0),
      decoration: const BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(8.0)),
        color: Colors.purpleAccent,
        boxShadow: [
          BoxShadow(
            color: Colors.black,
            blurRadius: 0.0,
            spreadRadius: 0.0,
            offset: Offset(0.0, 0.0), // shadow direction: bottom right
          )
        ],
      ),
      child: Container(
        margin: const EdgeInsets.symmetric(horizontal: 15.0, vertical: 20.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Expanded(
              flex: 5,
              child: Container(
                margin: const EdgeInsets.only(top: 11.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Image.network(
                      'https://images.unsplash.com/photo-1616436348354-77e70e18226e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=764&q=80',
                      width: 50,
                      height: 50,
                    ),
                    const Flexible(child: Icon(Icons.favorite, color: Colors.red)),
                  ],
                ),
              ),
            ),
            const SizedBox(
              height: 10,
            ),
            const Expanded(
              flex: 2,
              child: Text(
                'Netflix',
                style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, color: Colors.white),
              ),
            ),
            const Expanded(
              flex: 3,
              child: Text(
                'Front end',
                style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Colors.white),
              ),
            ),
            const Spacer(),
            Expanded(
              flex: 2,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: const [
                  Icon(
                    Icons.location_on,
                    color: Colors.white,
                    size: 15,
                  ),
                  Text(
                    'Mexico',
                    style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, color: Colors.white),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
1
  • siempre ayudando compa.
    – mauricio
    Commented el 25 jul. 2022 a las 21:42

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.