Flutter: is it possible to resize IconButton when it is clicked (onPressed)?

Question

I have a row, whose children are few buttons. I use them to pick color of my item, and when one icon is clicked I save color on server. Now, I would like the chosen Icon to resize (to get bigger). So that it really look like "selected".

Do you have any tips how to achieve that?

Here is my code for a single icon. Others are completely same, only with another color.

IconButton(
   icon: Ink(
        decoration: BoxDecoration(
        border: Border.all(color: yellow, width: 1),
        color: yellow,
        borderRadius: BorderRadius.circular(50.0)),
        child: const Icon(
           Icons.circle,
           color: yellow,
           size: 30,
            ),
       ),
   onPressed: () async {

      // how to resize when clicked? 
                                    
     item.set('color', 'yellow');
     item.save();
      },
  ),

You want to change the borderRadius or the actual icon size? — MendelG, Dec 29 '22 at 20:13

score 0 · Answer 1 · answered Dec 29 '22 at 20:16

To change the icon size dynamically, you can hold the size as a variable:

var _iconSize = 30;

And then:

Icon(
          Icons.circle,
          color: bikeyellow,
          size: _iconSize, //<-- SEE HERE
        ),

And in your onPressed setState the variable to something bigger:

onPressed: ()  {
        setState(() {
          _iconSize = 100;
        });
      }

Flutter: is it possible to resize IconButton when it is clicked (onPressed)?

1 Answers1