Deselect a button when another button is selected
You could handle the state from the parent widget and pass it to your children , This is an example how you can achieve that, of course you can improve the code and maybe create your own 'parent' controller of buttons :
class UserButton extends StatefulWidget { final String unselectedImagePath; final String selectedImagePath; final String text; final VoidCallback onTap; final bool selected; UserButton({ this.unselectedImagePath, this.selectedImagePath, this.text, this.selected, this.onTap, }); @override State<StatefulWidget> createState() => _UserButtonState(); } class _UserButtonState extends State<UserButton> { bool pressAttention = false; @override Widget build(BuildContext context) { pressAttention = widget.selected; return Column( children: <Widget>[ Ink.image( image: pressAttention ? AssetImage(widget.selectedImagePath) : AssetImage(widget.unselectedImagePath), fit: BoxFit.cover, width: 150.0, height: 150.0, child: InkWell( splashColor: Colors.transparent, highlightColor: Colors.transparent, onTap: () { setState(() { pressAttention = !pressAttention; }); if (widget.onTap != null) widget.onTap(); }, ), ), Padding( padding: EdgeInsets.only(top: 30.0), child: Text( widget.text, style: TextStyle( color: pressAttention ? Theme.of(context).accentColor : Colors.white, fontFamily: "Roboto", fontSize: 18.0), ), ) ], ); } } class ParentMain extends StatefulWidget { @override _ParentMainState createState() => _ParentMainState(); } class _ParentMainState extends State<ParentMain> { bool selectedButtonCoach = false; bool selectedButtonStudent = false; @override Widget build(BuildContext context) { return Container( child: Padding( padding: EdgeInsets.only(top: 100.0), child: Row( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ UserButton( selectedImagePath: 'assets/whistle_orange.png', unselectedImagePath: 'assets/whistle.png', text: "Coach", selected: selectedButtonCoach, onTap: () { setState(() { selectedButtonCoach = true; selectedButtonStudent = false; }); }, ), Container( width: 30.0, ), UserButton( selectedImagePath: 'assets/weight_orange.png', unselectedImagePath: 'assets/weight.png', text: "Student", selected: selectedButtonStudent, onTap: () { setState(() { selectedButtonCoach = false; selectedButtonStudent = true; }); }, ) ], ), ), ); } }Take a look how Radio widget works : https://github.com/flutter/flutter/blob/master/examples/flutter_gallery/lib/demo/material/selection_controls_demo.dart