iconswitcher

Last updated:

0 purchases

iconswitcher Image
iconswitcher Images
Add to Cart

Description:

iconswitcher

IconSwitcher #
A Flutter plugin that allows you to create an icon switcher on the AppBar Widget

PARAMETERS #



NAME
DESCRIPTION
DEFAULT VALUE




width
the final Widget width
required


height
the final Widget height
required


marginTop
the final Widget marginTop
required


icon1
the first Icon
required


icon2
the second Icon
required


color1
the color of the first Icon
required


color2
the color of the second Icon
required


duration
the animation duration when a user clicks on one of the icons
required


firstIconSelectedColor
the color of the first selector
Colors.redAccent


secondIconSelectedColor
the color of the second selector
Colors.orangeAccent


curve
the animation Curve type
Curves.bounceOut


onChange
Function(bool): return true when the first Icon is selected; false otherwise




EXAMPLE OF USAGE
You can use it to create multiple screen views inside a same Widget using all the Flutter Animated Widgets
CODE:

class Screen extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _Screen();
}
}

class _Screen extends State<Screen> with TickerProviderStateMixin {
bool left = true;
Duration duration = Duration(milliseconds: 400);

@override
Widget build(BuildContext context) {
double marginTop = 1.5;
double height = kToolbarHeight - marginTop * 2;
double width = height * 2;

return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
backgroundColor: Colors.white,
title: Text(
"Title",
),
actions: <Widget>[
IconSwitcher(
width: width,
height: height,
marginTop: marginTop,
duration: duration,
icon1: Icons.satellite,
icon2: Icons.content_copy,
color1: Colors.purple,
color2: Colors.white,
backgroundColor: Colors.black,
firstIconSelectedColor: Colors.redAccent,
secondIconSelectedColor: Colors.orangeAccent,
onChange: (bool result) {
setState(() {
left = result;
});
},
)
],
),
body: AnimatedCrossFade(
firstChild: Container(
color: Colors.black54,
),
secondChild: Container(
color: Colors.orange,
),
duration: duration,
crossFadeState:
left ? CrossFadeState.showFirst : CrossFadeState.showSecond,
firstCurve: Curves.bounceOut,
secondCurve: Curves.bounceOut,
),
));
}
}

copied to clipboard

License:

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Files In This Product:

Customer Reviews

There are no reviews.