在 flutter 中按下后如何更改 IconButton 的颜色

Question

I want to change color of icon after pressing. how can I do it? My IconButton is leading of a ListTile .

leading: new IconButton(
  icon: Icon(Icons.star, color: Colors.white),
  onPressed: () {
    setState(() {
      //color: Colors.yellow; //How?

    });
  },
),

Answer 1

You could do something like this

class SomeState extends State<StatefulWidget> {
  Color _iconColor = Colors.white;

  @override
  Widget build(BuildContext) {
    return ListTile(
      leading: new IconButton(
        icon: Icon(Icons.star, color: _iconColor),
        onPressed: () {
          setState(() {
          _iconColor = Colors.yellow;
        });
      },
    );
  }
}

Answer 2

the answer above is correct but i want to add if the user clicked again color will stay the same so you may want to change the color to the original color on the second tap, i though its worth mentioning

class SomeState extends State<StatefulWidget> {
  Color _favIconColor = Colors.grey;
  @override
  Widget build(BuildContext) {
    return ListTile(
      child: IconButton(
                      icon: Icon(Icons.favorite),
                      color: _favIconColor,
                      tooltip: 'Add to favorite',
                      onPressed: () {
                        setState(() {
                          if(_favIconColor == Colors.grey){
                            _favIconColor = Colors.red;
                          }else{
                        _favIconColor = Colors.grey;
                    }
               });
            },
          ),
       );
     }
    }

Answer 3

You can create a Boolean and then Give color according to that, this will remove the issue of using ifElse. here is how You can do this

class SomeState extends State<StatefulWidget> {
bool _isTap = false;//using false as initial value(not tapped)

@override
Widget build(BuildContext) {
return ListTile(
  leading: new IconButton(
    icon: Icon(Icons.star, color: _isTap?Colors.white:Colors.grey),
    onPressed: () {
      setState(() {
      _onTap =!_onTap;
// we are using ! because it changes values to both conditions
// true->false <-> false->true
     });
    },
  );
  }
}