https://github.com/wlan07/stacky_bottom_nav_bar
A fancy animated bottom navigation bar 💫.
https://github.com/wlan07/stacky_bottom_nav_bar
animations bottom-navigation dart package pubdev
Last synced: about 1 month ago
JSON representation
A fancy animated bottom navigation bar 💫.
- Host: GitHub
- URL: https://github.com/wlan07/stacky_bottom_nav_bar
- Owner: wlan07
- License: apache-2.0
- Created: 2022-03-28T23:03:54.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2022-03-29T00:49:05.000Z (almost 4 years ago)
- Last Synced: 2025-10-22T22:37:55.358Z (5 months ago)
- Topics: animations, bottom-navigation, dart, package, pubdev
- Language: Dart
- Homepage:
- Size: 15.6 KB
- Stars: 6
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Stacky_bottom_nav_bar
A fancy animated bottom navigation bar.
## Preview
| Default Light Mode | Default Dark Mode |
| --- | ----------- |
| 
| 
|
> :warning: **IMPORTANT**: when adding this widget don’t force it with a specific size like wrapping it with sizedbox or whatever . you can use it in stack widget and put it on the top and consider getting the default height of this nav bar with `StackyBottomNavBar.defaultHeigh` as a padding to the widget below .
## **Getting Started**
Add the dependency in `pubspec.yaml`:
```yaml
dependencies:
...
stacky_bottom_nav_bar: ^0.0.2
```
## ****Customization****
### StackyBottomNavBar
`params` a `StackyBottomNavBarParams` class already come-in with the package that hold all of required and optional parametres.
### StackyBottomNavBarParams
`simpleNavBarItems` a list of `StackySimpleNavBarItem`'s , must be 2 length.
`animatedNavBarItems` a list of `StackyAnimatedNavBarItem`'s , must be 3 length.
`brightness` customize nav bar brightness.
`bgColor` change nav bar background color.
`currentSelectedTabIndex` current selected tab item , Defaults to zero . must be 0 or 1.
### StackySimpleNavBarItem
`icon` simple nav bar item iconData
`onTap` nav bar iconData
`iconColor` use it to override unselected Icon Color (Optional).
`selectedIconColor` use it to override unselected Icon Color (Optional).
### StackyAnimatedNavBarItem
`icon` animated nav bar item iconData
`onTap` nav bar iconData
`iconColor` use it to override Icon Color (Optional).
`bgColor` use it to override Animated Nav Bar Item Background Color (Optional).
## BASIC USAGE EXAMPLE
```dart
StackyBottomNavBar(
params: StackyBottomNavBarParams(
animatedNavBarItems: [
StackyAnimatedNavBarItem(
icon: MyFlutterApp.videocam,
onTap: () => log("videocam"),
),
StackyAnimatedNavBarItem(
icon: MyFlutterApp.camera,
onTap: () => log("camera"),
),
StackyAnimatedNavBarItem(
icon: MyFlutterApp.picture,
onTap: () => log("picture"),
),
],
simpleNavBarItems: [
StackySimpleNavBarItem(
icon: MyFlutterApp.house,
onTap: () => log("house"),
),
StackySimpleNavBarItem(
icon: MyFlutterApp.user,
onTap: () => log("user"),
)
],
currentSelectedTabIndex: 0,
),
),
```