mountain_menu

Description:

mountain menu

Mountain Menu designed by The ITcians


A curved menu shaped like mountain crafted for your beautiful app.
You can set your default animation and theme for this menu.
Here is an example to start with:

class _MenuDemoState extends State<MenuDemo> {
List<String> menus = ["HOME", "PROFILE", "NOTIFICATIONS"];
int selectedIndex = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
children: [
Image.network(
"https://avatars.githubusercontent.com/u/93488670?s=400&u=af911b0e99e78a599f08f47f1e3152700b869f6b&v=4"),
const Text(
"The ITcians",
style: TextStyle(
color: Colors.black,
fontFamily: "Cursive",
fontWeight: FontWeight.bold,
fontSize: 40),
),
Text(
menus[selectedIndex],
style: const TextStyle(
color: Color(0xff9264EB),
fontWeight: FontWeight.bold,
fontSize: 30),
),
],
),
),
bottomNavigationBar: MountainMenu(
color: Color(0xff9264EB),
menuIcon: Icons.menu,
mainButtonElevation: 0,
mini:true,
curve: Curves.easeIn,
buttonBackgroundColor: Colors.white,
onChange: (val) async {
setState(() {
selectedIndex = val;
print(val);
});
},
menus: const [
Icon(
Icons.home,
color: Color(0xff9264EB),
size: 24,
),
Icon(
Icons.person,
color: Color(0xff9264EB),
size: 24,
),
Icon(
Icons.chat_bubble,
color: Color(0xff9264EB),
size: 24,
),
],
),
);
}
}
copied to clipboard
Properties:

color: To change mountain's color
menuIcon: To change mountain's main icon
menus: List of three menu widgets
mini: Change the size of menu to mini and expanded
mainButtonElevation: To add elevation to main button
buttonBackgroundColor: To change background color of menu buttons
iconColor: To change color of menu icons
onChange: A menu change listener
curve: Animation Curve
borderWith: Border with of main menu button
duration: Animation duration
borderColor: To change border color of main menu