Je souhaite appliquer la couleur d'arrière-plan au bouton icône, mais je ne vois pas de propriété backgroundColor
explicite pour celui-ci. Je veux y parvenir:
Actuellement, j'ai pu réaliser jusqu'ici:
Voici le code jusqu'à présent:
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
backgroundColor: Color(0xFF13212C),
appBar: AppBar(
title: Text('Demo'),
),
drawer: appDrawer(),
body: new Center(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new Column(
children: <Widget>[
// new Flexible(
new TextField(
style: new TextStyle(
color: Colors.white,
fontSize: 16.0),
cursorColor: Colors.green,
decoration: new InputDecoration(
suffixIcon: new IconButton(
icon: new Image.asset('assets/search_icon_ivory.png'),onPressed: null),
fillColor: Colors.black,
contentPadding: new EdgeInsets.fromLTRB(10.0, 20.0, 10.0, 20.0),
filled: true,
hintText: 'What Do You Need Help With?',
hintStyle: new TextStyle(
color: Colors.white
)
)
)
// )
]
),
Vous pouvez utiliser un avatar circulaire avec la hauteur du champ de texte radius = text/2 ou la hauteur que vous préférez.
Pour comprendre les spécifications des champs de texte, vous pouvez visiter material.io
Donc, le morceau de code va ressembler à ceci:
CircleAvatar(
radius: 30,
backgroundColor: Color(0xff94d500),
child: IconButton(
icon: Icon(
Icons.search,
color: Colors.black,
),
onPressed: () {
...
},
),
),
De cette façon, vous obtenez un bouton icône avec une couleur d'arrière-plan. J'espère que cela peut vous aider.