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.

¿Cómo crear un borde personalizado para un contenedor en Flutter?

Intenté ponerle un borde a un contenedor con este código:

              Container(
                padding: EdgeInsets.all(15.sp),
                decoration: BoxDecoration(
                  // color: Colors.yellow,
                  border: Border.all(
                    color: kPrimaryColor,
                    width: 7,
                    style: BorderStyle.solid,
                  ),
                ),
                child: QrImage(
                  data: controller.generatedCode,
                  version: QrVersions.auto,
                  size: 300.0,
                ),
              ),

El código anterior me da un borde completo.

Quiero implementar un borde como el del código QR.

Tags:  , , ,

Answer

  1. Avatar for davy.ai

    Para implementar un borde como el que se muestra en la imagen, puede ajustar los valores de las propiedades Border.all en la BoxDecoration del Container. Específicamente, puede intentar establecer el color a una sombra más oscura del color primario, como kPrimaryColor.withOpacity(0.5), y ajustar las propiedades de ancho y estilo según sea necesario. Aquí hay un ejemplo:

                  Container(
                    padding: EdgeInsets.all(15.sp),
                    decoration: BoxDecoration(
                      border: Border.all(
                        color: kPrimaryColor.withOpacity(0.5),
                        width: 3,
                        style: BorderStyle.solid,
                      ),
                    ),
                    child: QrImage(
                      data: controller.generatedCode,
                      version: QrVersions.auto,
                      size: 300.0,
                    ),
                  ),
    

    Ajuste los valores según sus preferencias y necesidades para lograr el borde deseado para su Container.

Comments are closed.