How to change between two icons upon every time a button is pressed in flutter-CodePudding

Take for example an IconButton( icon: Icon(Icons.add) onPressed: (){ //Every time this button is pressed the add icon changes to a tick icon, and when it is pressed again, the tick icon changes to an add icon
} );

My attempt Widget add = const Icon(Icons.add); Widget tick = const Icon(Icons.tick);

Widget select(){ : add ? tick return //I am not sure what I will be returning }

CodePudding user response：

You can use StatefulWidget and setState

class Home extends StatefulWidget {
  const Home({super.key});

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  bool selected = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: IconButton(
              onPressed: () {
                setState(() {
                  selected = !selected;
                });
              },
              icon:
                  selected ? const Icon(Icons.add) : const Icon(Icons.check))),
    );
  }
}

CodePudding user response：

Once try to this demo

Example Video of how it will work/ https://drive.google.com/file/d/1EZmkdlsYfotIXfHh5fBIDXC1r6Tqo8Bo/view?usp=share_link

Define variable for change

bool change = true;

Put in your widget body

Center(
    child: IconButton(
        onPressed: () {
          setState(() {
            change = !change;
          });
        },
        icon: Icon(change ? Icons.call : Icons.mail_outline, size: 35)),
  ),

if you have use to icon button then put onTap same as in IconButton's OnPress method.