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.

Problema de borde del campo de texto en Flutter.

21 Jul, 2023 Programación

He utilizado la decoración de borde del componente OutlinedInput, pero al aumentar el borderRadius, también aumenta el espacio entre el labelText y el borde del contorno. Por favor, ayúdenme, ya que soy principiante en Flutter.

Enlace de imágenes:
https://drive.google.com/drive/folders/1037ezMhxWYjPY7IfMv4w-nxaaE7c_HAN?usp=sharing

Aquí está mi código:

TextField(
  decoration: InputDecoration(
    fillColor: Colors.white,
    filled: true,
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(45),
      borderSide: BorderSide(color: Colors.grey),
    ),
    labelText: 'Email',
  ),
),
Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Aumentar la propiedad borderRadius del OutlineInputBorder sin duda aumentará el espacio entre el labelText y el borde del contorno. Puedes intentar reducir la propiedad contentPadding del InputDecoration para acercar el labelText al campo de entrada.

    Aquí tienes un fragmento de código actualizado con contentPadding agregado:

    TextField(
  decoration: InputDecoration(
    fillColor: Colors.white,
    filled: true,
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(45),
      borderSide: BorderSide(color: Colors.grey),
    ),
    labelText: 'Email',
    contentPadding: EdgeInsets.fromLTRB(20, 12, 20, 12), // Ajusta esto según sea necesario
  ),
),

    ¡Espero que esto sea útil! Avísame si tienes alguna otra pregunta.

Comments are closed.