flutter_navbar_pro 0.0.1 copy "flutter_navbar_pro: ^0.0.1" to clipboard
flutter_navbar_pro: ^0.0.1 copied to clipboard

This is a amazing nav bar project. You can use this package in your amazing flutter project to make your project beautiful.

Navigation Bar By Programming Wormhole

🌐 Socials: #

Facebook Instagram LinkedIn Twitter YouTube


How to use? #

Add flutter_navbar_pro: to your pubspec.yaml dependencies then run flutter pub get

Add from pub [Stable]

 dependencies:
   flutter_navbar_pro:

Then import the package to use

import 'package:flutter_navbar_pro/flutter_navbar_pro.dart';

Add FlutterNavBarPro() to bottomNavigationBar property of Scaffold().

Design Overview #

I just inspired From This Bar (MyGp App)

Do and don't #

  • Don't make icon size too big.
    • Don't use label text too long

How to use it #

  • For Navigation Bar Code Example #

    Past it inside scaffold
bottomNavigationBar: FlutterNavBarPro(
         iconFirst: Icons.home,
         labelFirst: 'Home',
         iconSecond: Icons.local_offer_outlined,
         labelSecond: 'Offers',
         iconThree: Icons.person,
         labelThree: 'Account',
         iconFour: Icons.menu,
         labelFour: 'More',
         labelMiddle: 'Explore',
       ),
  1. Here we just typed our IconData. The package already done all modification for you.

    So just type the IconData only. (eg: Icons.name)

  2. And for icon label you can't able to use any wiget under the under '' codeation you have to type your label text and the package already done all modification for you.
  • How to use the center icon? #

    Past it inside scaffold
floatingActionButton: FloatingBarPro(
middleBGColor: Colors.white,
imageData: 'assets/images/explore.png',
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,

Here in imageData you have a past your own image icon path.

  • How to change image to icon? . #

  1. Hold on the ctrl button and click on FlutterNavBarPro()
  2. And comment of delete 123-125 no line codes.
  3. and past one line of codes here
child: Icon(Icons.access_time_filled_rounded),

Here just change the IconData with yours


BuyMeACoffee

7
likes
140
pub points
59%
popularity

Publisher

verified publishernnvcoders.com

This is a amazing nav bar project. You can use this package in your amazing flutter project to make your project beautiful.

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

flutter

More

Packages that depend on flutter_navbar_pro