Le code dans lequel vous modifiez la couleur de l'icône primaryColor et primaryColorDark ne change pas la couleur initiale de la bordure, seulement après avoir tapé la couleur reste noire.
L'attribut qui doit être modifié est hintColor
BorderSide ne doit pas être utilisé pour cela, vous devez changer de thème.
Pour que la couleur rouge soit la couleur par défaut pour mettre le thème en MaterialApp(theme: ...) et pour modifier le thème d'un widget spécifique, par exemple en remplaçant la couleur rouge par défaut par la couleur jaune du widget, entoure le widget :
new Theme(
data: new ThemeData(
hintColor: Colors.yellow
),
child: ...
)
Vous trouverez ci-dessous le code et le gif :
Notez que si nous définissons le primaryColor couleur noire, en tapant sur le widget, il est sélectionné avec la couleur noire.
Mais pour modifier l'étiquette et le texte à l'intérieur du widget, nous devons définir le thème comme suit InputDecorationTheme
Le widget qui commence par la couleur jaune a son propre thème et le widget qui commence par la couleur rouge a le thème par défaut défini avec la fonction buildTheme()
![enter image description here]()
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
ThemeData buildTheme() {
final ThemeData base = ThemeData();
return base.copyWith(
hintColor: Colors.red,
primaryColor: Colors.black,
inputDecorationTheme: InputDecorationTheme(
hintStyle: TextStyle(
color: Colors.blue,
),
labelStyle: TextStyle(
color: Colors.green,
),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
theme: buildTheme(),
home: new HomePage(),
);
}
}
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => new _HomePageState();
}
class _HomePageState extends State<HomePage> {
String xp = '0';
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(),
body: new Container(
padding: new EdgeInsets.only(top: 16.0),
child: new ListView(
children: <Widget>[
new InkWell(
onTap: () {},
child: new Theme(
data: new ThemeData(
hintColor: Colors.yellow
),
child: new TextField(
decoration: new InputDecoration(
border: new OutlineInputBorder(),
hintText: 'Tell us about yourself',
helperText: 'Keep it short, this is just a demo.',
labelText: 'Life story',
prefixIcon: const Icon(Icons.person, color: Colors.green,),
prefixText: ' ',
suffixText: 'USD',
suffixStyle: const TextStyle(color: Colors.green)),
)
)
),
new InkWell(
onTap: () {},
child: new TextField(
decoration: new InputDecoration(
border: new OutlineInputBorder(
borderSide: new BorderSide(color: Colors.teal)
),
hintText: 'Tell us about yourself',
helperText: 'Keep it short, this is just a demo.',
labelText: 'Life story',
prefixIcon: const Icon(Icons.person, color: Colors.green,),
prefixText: ' ',
suffixText: 'USD',
suffixStyle: const TextStyle(color: Colors.green)),
)
)
],
),
)
);
}
}
