instagram_bottom_nav_bar 3.0.19 copy "instagram_bottom_nav_bar: ^3.0.19" to clipboard
instagram_bottom_nav_bar: ^3.0.19 copied to clipboard

Best bottom bar structure created to control page flow. You don't need to describe navigatorKey for each Bottom Bar Item. I've already do that.

Best bottom bar structure created to control page flow.

Preview #

Bottom Bar

Features #

  • ✅ As in Instagram logic, when you save only 3 of the previous tabs and press the back button, it goes to the previous tab.
  • ✅ If you are in a tab, it will return to the old page when the back button is clicked.
  • ✅ If there is a tab you haven't been to before, that tab will be load after you go.

Important Notes #

  • ✅ The use of initState must be in state management so that the bottom bar pages are not loaded directly when the application is opened.
  • ✅ If you want the bottom navigation bar to stay fixed when you go to another page, set the rootNavigator parameter to false.
Navigator.of(context,rootNavigator: false).pushNamed(Routes.homePage);

Getting Started #

Add Instagram Bottom Navigation Bar to your pubspec.yaml in dependencies: section.

dependencies:
  instagram_bottom_nav_bar: ^3.0.19

Update dependencies:

flutter pub get

Import the package:

import 'import 'package:instagram_bottom_nav_bar/instagram_tab_view.dart';

It also has all the features of the normal bottom navigation bar

InstagramTabView(
      selectedItemColor: Colors.black,
      unselectedItemColor: Colors.grey.shade400,
      backgroundColor: Colors.white, // Default is Colors.white
      elevation: 12, // Default elevation is 12,
      showSelectedLabels: true, // Default showSelectedLabels is true,
      showUnselectedLabels: true, // Default showUnselectedLabels is true
      iconSize: 24, // Default iconSize is 24,
      bottomNavigationBarType: BottomNavigationBarType.fixed,
      iconType: IconType.icon,
      items: [
        InstagramTabItem(label: 'Home Page', page: HomePage(), icon: Icon(Icons.add)),
        InstagramTabItem(label: 'Profile', page: Messages(), icon: Icon(Icons.refresh)),
      ],
    )
7
likes
130
points
126
downloads

Publisher

verified publisheryusufnadaroglu.com

Weekly Downloads

Best bottom bar structure created to control page flow. You don't need to describe navigatorKey for each Bottom Bar Item. I've already do that.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter, flutter_svg, flutter_svg_provider

More

Packages that depend on instagram_bottom_nav_bar