web-dev-qa-db-fra.com

Comment changer la couleur de soulignement de textField?

Je suis nouveau sur Flutter & Dart. Actuellement, l’utiliser dans un de mes projets personnels. 

 enter image description here

Dans l'ensemble de ma forme, le soulignement de textField est affiché en bleu. Je veux changer cela en une autre couleur. Le morceau de code que j'utilise est comme ...

new TextField(
  controller: this._emailController,
  decoration: new InputDecoration(
      hintText: "Enter your email",
      labelText: "Email",
      labelStyle: new TextStyle(
          color: const Color(0xFF424242)
      )
  ),

),

Impossible de comprendre comment y parvenir. 

Note: Je sais qu'il y a une question similaire ici Changer le soulignement de TextField dans Flutter . Mais, là aussi, cela n’a pas été complètement résolu. En outre, un lien supplémentaire qui ressemble au mien ici Modification de la couleur de la ligne de fond de EditText avec appcompat v7 , mais qui appartient au développement Android en utilisant Java et non en Dart (flutter), que j'utilise pour le développement de mon application Android . Alors, s'il vous plaît ne vous laissez pas troubler par ces liens.

dartflutter
6
Suresh

La réponse logique serait d'utiliser un InputBorder, en particulier un UnderlineInputDecorator , et de le transmettre à l'entrée du décodeur en tant que bordure. Cependant, tout ceci indique à InputDecorator s'il doit utiliser un soulignement ou autre chose que vous spécifiez.

La couleur réelle est basée sur le thème - de la source:

Color _getActiveColor(ThemeData themeData) {
  if (isFocused) {
    switch (themeData.brightness) {
      case Brightness.dark:
        return themeData.accentColor;
      case Brightness.light:
        return themeData.primaryColor;
    }
  }
  return themeData.hintColor;
}

Donc, pour changer la couleur, faites quelque chose comme ça (ou spécifiez le thème de votre application entière):

new Theme(
  data: new ThemeData(
    primaryColor: Colors.red,
    accentColor: Colors.orange,
    hintColor: Colors.green
  ),
  child: new TextField(
    decoration: new InputDecoration(
      hintText: "Enter your email",
      labelText: "Email",
      labelStyle: new TextStyle(color: const Color(0xFF424242)),
      border: new UnderlineInputBorder(
        borderSide: new BorderSide(
          color: Colors.red
        )
      )
    ),
  ),
),
6
rmtmckenzie

Juste utilisé -: 

decoration: InputDecoration(        
              focusedBorder: UnderlineInputBorder(      
                      borderSide: BorderSide(color: Colors.cyan),   
                      ),    
             ),

ça marche pour moi :) 

9
GJJ
    decoration: new InputDecoration(
                      labelText: "Email",
                      suffixIcon: Icon(Icons.email),
                      labelStyle: TextStyle(color: Colors.red),
                      enabledBorder: new UnderlineInputBorder(
                          borderSide: new BorderSide(color: Colors.red)
   )
)
0
Victor Santos