A flutter package for a beautiful modern Navigation Bar along with a Floating Action Bar
Add this to your package's pubspec.yaml
file:
dependencies:
navigation_action_bar: ^0.0.1
You can install packages from the command line:
with pub
:
$ pub get
with Flutter
:
$ flutter packages get
Now in your Dart
code, you can use:
import 'package:navigation_action_bar/navigation_action_bar.dart';
Scaffold(
bottomNavigationBar: NavigationActionBar(
context: context,
scaffoldColor: Colors.blueAccent,
index: 0,
subItems: [
NavBarItem(iconData: Icons.attach_file, size: 25),
NavBarItem(iconData: Icons.photo, size: 25),
NavBarItem(iconData: Icons.camera_alt, size: 25),
],
mainIndex: 2,
items: [
NavBarItem(iconData: Icons.list, size: 30),
NavBarItem(iconData: Icons.compare_arrows, size: 30),
NavBarItem(iconData: Icons.add, size: 40),
NavBarItem(iconData: Icons.call_merge, size: 30),
NavBarItem(iconData: Icons.person, size: 30),
],
onTap: (index) {
setState(() {
currentIndex = index;
});
},
)
Dart attribute | Datatype | Description | Default Value |
---|---|---|---|
index | int | Specifies the index of the tab which needs to be open initially | 0 |
mainIndex | int | Specifies the index where the Rotating Button should be placed | @required |
items | List<NavBarItem> | The list of widgets which are to be displayed in the Navigation Bar | @required |
subItems | List<NavBarItem> | The list of widgets which are to be displayed in Action Bar | @required |
scaffoldColor | Color | The color of the scaffold | Colors.blueAccent |
backgroundColor | Color | The background color of Navigation Bar | Colors.white |
animationCurve | AnimationCurve | Specifies the type of animation curve used by action buttons | Curves.bounceOut |
animationDuration | Duration | Specifies how long the animation will last | 300 Milliseconds |
Navigation_Action_Bar is licensed under MIT license
. View license.