dot-indicator-bottom-navigation-bar-widget-flutterflow
flutterflow-dot-indicator-bottom-navigation-bar-widget
About

Dot indicator bottom navigation bar ✨ β€” a polished bottom nav with a subtle floating card, crisp elevation, and a tiny animated dot 🎯 under the active icon. Fully themeable with 40 params, production-ready for iOS & Android.

Functionality

  • 🧭 4–5 tabs β€” icon-only or icon+label modes.

  • πŸ”΅ Animated active indicator β€” tune dotSize, dotGap, dotTravel, dotColor.

  • 🎨 Active/Inactive styling β€” per-theme activeColor / inactiveColor.

  • πŸŒ€ Smooth animations β€” animateOnInit, animateOnTabChange, custom durations.

  • πŸͺŸ Floating container β€” adjustable elevation, shadowColor, cornerRadius.

  • 🧩 Icon controls β€” per-tab asset, iconSize, active icon overrides.

  • πŸ“ Layout controls β€” horizontal padding, item spacing, safe-area toggle.

  • ♻️ State persistence β€” initial index + restore last tab on restart.

  • πŸ›£οΈ Routing-ready β€” onTap to go_router, auto_route, or custom flows.

  • πŸ”” Badges β€” counts/dots + notification hooks.

  • πŸ«₯ Hide on scroll / auto-reveal for immersive lists.

  • β™Ώ Accessibility β€” large targets, semantic roles, high-contrast states.

  • 🌍 Localization & RTL β€” adaptive labels for compact layouts.

  • πŸŒ— Light/Dark β€” optional blur/overlay; platform-responsive feel.

Keywords (one row): dot indicator bottom navigation bar, animated dot bottom nav, floating bottom navigation bar, capsule bottom nav bar, active tab indicator, bottom navigation bar widget, custom bottom nav widget flutterflow, flutterflow bottom navigation, material 3 bottom nav, ios android navigation bar, safe area bottom bar, icon label tabs, badges notification dot, go_router navigation, auto_route navigation, animate on tab change, dark mode light mode, rtl support, localization, modern app shell, production ready flutter widget

Bottom Navigation Bar V4

We’ll build your app in 7 days
Features
Categories
Style
Support
Single Use Individual License

You may only use this template for one project. For more details, please read the Marketplace Terms of Service.