Search packages, repositories and app categories

floating_tabbar cover
Package detailsv1.0.3

floating_tabbar

Easily navigate complex UIs across platforms with floating_tabbar. Built on Material Design, it's responsive and intuitive.

AndroidiOSmacOSWindowsLinux
30-day downloads
252
Likes
78
Pub points
140

Install package

flutter pub add floating_tabbar

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

FloatingTabBar is a responsive and intuitive tab navigation solution built on Material Design principles, enabling seamless navigation across complex UIs on multiple platforms. Designed for consistency and ease of use, it adapts smoothly to Android, iOS, macOS, Windows, and Linux. The package enhances user experience with a floating tab interface that remains accessible during scrolling, making it ideal for apps with layered or dynamic content. It integrates effortlessly with Flutter projects via a simple pub add command.

Use cases

  • Cross-platform mobile and desktop apps
  • Complex UI navigation
  • Scrollable content with persistent tabs
  • Material Design-compliant interfaces
  • Dynamic content layouts

Key features

  • Responsive floating tab design
  • Multi-platform support
  • Material Design integration
  • Easy integration via pub
  • Persistent navigation during scroll

Suitable for

  • Developers building multi-platform Flutter apps
  • Designers prioritizing intuitive navigation
  • Apps with deep content hierarchies
  • Teams using Material Design guidelines
  • Projects requiring accessible tab interfaces

Considerations

  • May require custom styling for non-Material themes
  • Limited customization for tab positioning
  • Best suited for apps with moderate tab counts
  • Not ideal for minimalistic UIs
  • Performance impact in very large tab sets

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Floating TabBar

The floating_tabbar package for Flutter allows you to use the responsive design for all platforms made from the Material Design System, floating_tabbar solves and eases the problem of complex navigation user interfaces by providing a responsive solution.

Getting started

Getting started In the pubspec.yaml of your flutter project, add the following dependency:

dependencies:
  floating_tabbar: <latest_version>

Import the package in your library and use floating_tabbar it in your Flutter App.

import 'package:floating_tabbar/floating_tabbar.dart';
  • This is Floating TabBar widget.
  • To use this there must be minimum two items.
  • You get TabBar floating and a PageView with it.
  • And with [isFloating = false] you'll get normal TabBar PageView
  • Support for all device sizes.

Members

FloatingTabBar

floating_tabbar solves and eases the problem of complex navigation user interfaces by providing a responsive solution.

TopTabBar

TopTabBar allows you to create the TabBar with built in space for nesting contingency, just provide the data to children parameter as list of TabItem and you're done.

Floater

Floater, a widget when wrapped with other gives a floating visual effect to your widget.

FloaterTest
Nautics

Nautics is the SideBar navigation widget that allows you to create sidebar with items of your choice which you provide using help of TabItem model class, use Nautics as drawer in its collapsed and expanded form, make settings UI using it, or navigation for your app, just list of TabItems and you are done.

OpsShell

OpsShell, a widget that helps design responsive screens, for Small screens, child of OpsShell will look normal, like nothing has wrapped it, but this widget will show responsive similar look as small screen of your app while being creative on large screens.

Airoll

Airoll is a customised PopupMenuButton that accepts its children as the list on TabItem.

NotificationBadge

NotificationBadge is the custom badge which wraps around your widget to create numeric as well as DOT notifier.

NotificationBadgeTest
Vitrify

Vitrify, a widget when wrapped around other, it converts the look of the widget to glass card look.

VitrifyTest
Niftile

Niftile is a multipurpose tile that accepts the data in the form of TabItem to create a tile.

and much more.

Also check landing_page, a package built on top of floating_tabbar for creating landing screens and welcome interface for your flutter project.

Categories

Dependencies

Dependency list 2 items

  • adaptive_breakpoints^0.1.7
  • intl^0.19.0

Source repository

Projects using this package

No data available yet.