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.

  • es.davy.ai/
  • Programación /
  • Aplicando el color de borde lateral a TextField solo cuando está habilitado el tema oscuro.

Aplicando el color de borde lateral a TextField solo cuando está habilitado el tema oscuro.

05 Jun, 2023 Programación

Me preguntaba si existe una forma de aplicar un color específico al enabledBorder de un TextField() cuando se habilita el darkTheme. Este es mi TextField():

flutter
TextField(
obscureText: true,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Contraseña',
),
),

Sin embargo, al utilizar el siguiente código en mi tema oscuro, se aplica un color de borde a todos los enabledBorder, lo cual quiero evitar por razones obvias:

flutter
inputDecorationTheme: InputDecorationTheme(
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.grey[700]!)
)
),

También no quiero que se aplique el mismo color al usar el tema regular, por lo que no puedo aplicarlo solo al TextField(). ¿Qué puedo hacer para resolver este problema?

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para aplicar un color específico al borde habilitado (enabledBorder) de un TextField() solo cuando está habilitado el darkTheme, puede utilizar el siguiente código:

    Theme(
  data: ThemeData(
    brightness: Brightness.dark,
    inputDecorationTheme: InputDecorationTheme(
      enabledBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Colors.grey[700]!)
      ),
    ),
  ),
  child: TextField(
    obscureText: true,
    decoration: InputDecoration(
      border: OutlineInputBorder(),
      labelText: 'Contraseña',
    ),
  ),
)

    Esto creará un widget Theme y establecerá su propiedad brightness en Brightness.dark. Luego, se establece inputDecorationTheme para que solo se aplique a darkTheme. Finalmente, TextField() se envuelve dentro del widget Theme, que aplicará el tema oscuro solo a ese TextField() y sus propiedades relevantes.

    Si desea aplicar un color específico al borde habilitado de un TextField() solo cuando está habilitado el lightTheme, puede utilizar el mismo enfoque pero establecer la propiedad brightness en Brightness.light.

Comments are closed.