Description:
ultimate bottom navbar
Ultimate Bottom Navigation Bar #
Ultimate Bottom Navigation Bar is a customizable bottom navigation bar for your Flutter applications. It allows you to easily create a navigation bar with icons and titles, and customize various aspects of its appearance and behaviors.
Under Curve #
Upper Curve #
No Curve #
Static Curve #
Dynamic Curve #
Other Customiztions #
How To Use #
Ultimate Bottom Navigation Bar can be used with Scaffold by setting up at bottomNavigationBar property.
Add this to your package's pubspec.yaml file, use the latest version
dependencies:
ultimate_bottom_navbar: ^latest_version
copied to clipboard
import 'package:ultimate_bottom_navbar/ultimate_bottom_navbar.dart';
int currentIndex = 0;
final List<String> title = [
"Favourite",
"Wallet",
"Home",
"Freeze",
"Alarm"
];
final List<IconData> icons = [
Icons.favorite,
Icons.wallet_giftcard_sharp,
Icons.home,
Icons.ac_unit_outlined,
Icons.access_alarm_rounded,
];
final List pages = [
const Page1(),
const Page2(),
const Page3(),
const Page4(),
const Page5(),
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: pages[currentIndex],
bottomNavigationBar: UltimateBottomNavBar(
icons : icons,
titles : title,
currentIndex : currentIndex,
onTap : (index) async => onItemTapped(index),
),
);
}
void onItemTapped(int index) async{
setState(() {
currentIndex = index;
});
}
copied to clipboard
RTL Support #
Works For Both RTL and LTR and can be configured with Directionality:
Directionality(
textDirection: TextDirection.rtl,
child: Scaffold(bottomNavigationBar:UltimateBottomNavBar()),
)
copied to clipboard
Controls For Upper And Under Curve And Stroke Borders #
Upper Curves:
Control the width and shape of the upper curves using various X and Y control points.
Adjust stroke properties for the upper curves, such as width and control points.
Under Curves:
Manage the width and shape of the under curves with specific X and Y control points.
Modify stroke properties for the under curves, including width and control points.
These properties collectively allow users to finely control the appearance of upper and under curves, as well as stroke borders, providing flexibility in customizing the graphical elements of the interface.
Properties #
Property
Description
icons
Required Icons
titles
Required Titles Use Empty Text For No Title
currentIndex
Required Current Selected Index
backgroundColor
Solid Background Color
foregroundColor
Solid Foreground Color
foregroundStrokeBorderColor
Foreground Stroke Solid Border Color
backgroundStrokeBorderColor
Background Stroke Solid Border Color
backgroundStrokeBorderWidth
Background Stroke Border Thickness
foregroundStrokeBorderWidth
Foreground Stroke Border Thickness
backgroundGradient
Background Gradient Color
foreGroundGradientShader
Foreground Gradient Shader Color
foregroundStrokeGradientShader
Foreground Stroke Border Gradient Shader Color
backgroundStrokeGradientShader
Background Stroke Border Gradient Shader Color
navMargin
Bottom Navigation Margin
backgroundBorderRadius
Background Border Radius
selectedIconColor
Selected Icon Color
selectedIconSize
Selected Icon Size
selectedTextSize
Selected Text Size
selectedTextColor
Selected Text Color
unselectedIconColor
Unselected Icon Color
unselectedIconSize
Unselected Icon Size
unselectedTextSize
Unselected Text Size
unselectedTextColor
Unselected Text Color
showForeGroundStrokeAllSide
Show Foreground Stroke Border All Sides
showBackGroundStrokeAllSide
Show Background Stroke Border All Sides
useForeGroundGradient
Use Foreground Gradient Color
showForeGround
Show Hide Foreground
useForegroundShaderStroke
Use Foreground Shader Border Stroke Color
useBackgroundShaderStroke
Use Background Shader Border Stroke Color
underCurve
Under Curve Or Upper Curve
staticCurve
Static Curve Or Dynamic Curve
showCircleStaticMidItemStatic
Show Circle Decoration For Static Curve
midItemCircleColorStatic
Mid Item Circle Color For Static Curve
midItemCircleBorderColorStatic
Mid Item Circle Border Color For Static Curve
showMidCircleStatic
Show Mid Circle Or Hide For Static Curve
midCircleRadiusStatic
Mid Circle Radius For Static Curve
midCircleBorderRadiusStatic
Mid Circle Border Radius For Static Curve
customSelectedItemDecor
Custom Selected Item Decoration
customUnSelectedItemDecor
Custom Unselected Item Decoration
badgeData
Badge Data For Individual Item
badgeColor
Badge Background Color
badgeTextStyle
Badge Text Style
badgeCircleRadius
Badge Circle Radius
badgeTopPosition
Badge Top Position
badgeBottomPosition
Badge Bottom Position
badgeLeftPosition
Badge Left Position
badgeRightPosition
Badge Right Position
backgroundHeight
Height for Background Container
foregroundHeight
Height for Foreground Container
animationType
Animation Type
animationDuration
Animation Duration
onTap
Item Tap Function
upperCurveWidthCtrl
Controls the width of the upper curve.
leftX1UpperCurveCtrl
Controls the x-coordinate of the left control point 1.
leftY1UpperCurveCtrl
Controls the y-coordinate of the left control point 1.
leftX2UpperCurveCtrl
Controls the x-coordinate of the left control point 2.
leftY2UpperCurveCtrl
Controls the y-coordinate of the left control point 2.
leftX3UpperCurveCtrl
Controls the x-coordinate of the left control point 3.
leftY3UpperCurveCtrl
Controls the y-coordinate of the left control point 3.
rightX1UpperCurveCtrl
Controls the x-coordinate of the right control point 1.
rightY1UpperCurveCtrl
Controls the y-coordinate of the right control point 1.
rightX2UpperCurveCtrl
Controls the x-coordinate of the right control point 2.
rightY2UpperCurveCtrl
Controls the y-coordinate of the right control point 2.
rightX3UpperCurveCtrl
Controls the x-coordinate of the right control point 3.
rightY3UpperCurveCtrl
Controls the y-coordinate of the right control point 3.
upperStrokeCurveWidthCtrl
Controls the width of the upper stroke curve.
leftStrokeX1UpperCurveCtrl
Controls the x-coordinate of the left control point 1 for the upper stroke.
leftStrokeY1UpperCurveCtrl
Controls the y-coordinate of the left control point 1 for the upper stroke.
leftStrokeX2UpperCurveCtrl
Controls the x-coordinate of the left control point 2 for the upper stroke.
leftStrokeY2UpperCurveCtrl
Controls the y-coordinate of the left control point 2 for the upper stroke.
leftStrokeX3UpperCurveCtrl
Controls the x-coordinate of the left control point 3 for the upper stroke.
leftStrokeY3UpperCurveCtrl
Controls the y-coordinate of the left control point 3 for the upper stroke.
rightStrokeX1UpperCurveCtrl
Controls the x-coordinate of the right control point 1 for the upper stroke.
rightStrokeY1UpperCurveCtrl
Controls the y-coordinate of the right control point 1 for the upper stroke.
rightStrokeX2UpperCurveCtrl
Controls the x-coordinate of the right control point 2 for the upper stroke.
rightStrokeY2UpperCurveCtrl
Controls the y-coordinate of the right control point 2 for the upper stroke.
rightStrokeX3UpperCurveCtrl
Controls the x-coordinate of the right control point 3 for the upper stroke.
rightStrokeY3UpperCurveCtrl
Controls the y-coordinate of the right control point 3 for the upper stroke.
underCurveWidthCtrl
Controls the width of the under curve.
leftX1UnderCurveCtrl
Controls the x-coordinate of the left control point 1 for the under curve.
leftY1UnderCurveCtrl
Controls the y-coordinate of the left control point 1 for the under curve.
leftX2UnderCurveCtrl
Controls the x-coordinate of the left control point 2 for the under curve.
leftY2UnderCurveCtrl
Controls the y-coordinate of the left control point 2 for the under curve.
leftX3UnderCurveCtrl
Controls the x-coordinate of the left control point 3 for the under curve.
leftY3UnderCurveCtrl
Controls the y-coordinate of the left control point 3 for the under curve.
rightX1UnderCurveCtrl
Controls the x-coordinate of the right control point 1 for the under curve.
rightY1UnderCurveCtrl
Controls the y-coordinate of the right control point 1 for the under curve.
rightX2UnderCurveCtrl
Controls the x-coordinate of the right control point 2 for the under curve.
rightY2UnderCurveCtrl
Controls the y-coordinate of the right control point 2 for the under curve.
rightX3UnderCurveCtrl
Controls the x-coordinate of the right control point 3 for the under curve.
rightY3UnderCurveCtrl
Controls the y-coordinate of the right control point 3 for the under curve.
underStrokeCurveWidthCtrl
Controls the width of the under stroke curve.
leftStrokeX1UnderCurveCtrl
Controls the x-coordinate of the left control point 1 for the under stroke.
leftStrokeY1UnderCurveCtrl
Controls the y-coordinate of the left control point 1 for the under stroke.
leftStrokeX2UnderCurveCtrl
Controls the x-coordinate of the left control point 2 for the under stroke.
leftStrokeY2UnderCurveCtrl
Controls the y-coordinate of the left control point 2 for the under stroke.
leftStrokeX3UnderCurveCtrl
Controls the x-coordinate of the left control point 3 for the under stroke.
leftStrokeY3UnderCurveCtrl
Controls the y-coordinate of the left control point 3 for the under stroke.
rightStrokeX1UnderCurveCtrl
Controls the x-coordinate of the right control point 1 for the under stroke.
rightStrokeY1UnderCurveCtrl
Controls the y-coordinate of the right control point 1 for the under stroke.
rightStrokeX2UnderCurveCtrl
Controls the x-coordinate of the right control point 2 for the under stroke.
rightStrokeY2UnderCurveCtrl
Controls the y-coordinate of the right control point 2 for the under stroke.
rightStrokeX3UnderCurveCtrl
Controls the x-coordinate of the right control point 3 for the under stroke.
rightStrokeY3UnderCurveCtrl
Controls the y-coordinate of the right control point 3 for the under stroke.
Check Out example project @ example #
FAQ #
Create a feature requests or bugs @ Feature Request / issue tracker.
License
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
Files:
Customer Reviews
There are no reviews.
