Switch Icons Of Floating Action Button Onpressed
we shall take an Icon variable named fab
with some initial value. When you click on the floatingActionButton, onPressed() function is triggered. In there, we are assigning fab
with the other Icon, based on the value of a fabIconNumber
variable. We are are using fabIconNumber for storing the state of floatingActionButton, something like which Icon it is currently displaying.
You can write your own login and switch between as many number of Icons as required. Just wrap the logic around setState(){}
in onPressed()
of floatingActionButton.
Complete COde For Switch Icons Of Floating Action Button Onpressed In Flutter
main.dart
import 'package:flutter/material.dart'; void main() { runApp(MaterialApp( debugShowCheckedModeBanner: false, home: MyApp(), )); } class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State<MyApp> { Icon fab = Icon( Icons.refresh, ); int fabIconNumber = 0; @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.black, appBar: AppBar( backgroundColor: Colors.lightGreen, title: new Text("Switch Icon"), ), floatingActionButton: FloatingActionButton( backgroundColor: Colors.lightGreen, child: fab, onPressed: () => setState(() { if (fabIconNumber == 0) { fab = Icon( Icons.stop, ); fabIconNumber = 1; } else { fab = Icon(Icons.star); fabIconNumber = 0; } }), ), ); } }