We're uploading the content right now — check back on October 30th!
FluttyUI Logo
FluttyUI
Components

App Bar

A customizable app bar widget that supports back or drawer buttons, profile and notification icons, and custom actions.

Usage

Basic

Use FluttyAppBar as a drop-in replacement for the default AppBar to get advanced layout and customization features.

FluttyAppBar(
  title: 'Dashboard',
  withProfile: true,
  withNotification: true,
  actions: [
    IconButton(
      icon: Icon(Icons.settings),
      onPressed: () {},
    ),
  ],
);

With Drawer Icon

If your screen has a drawer, you can show the drawer icon instead of the back button.

FluttyAppBar(
  title: 'Home',
  withDrawer: true,
);

With Profile & Notification

Enable the built-in profile avatar and notification icon using withProfile and withNotification.

Custom Actions

Pass additional widgets using the actions prop to add icons, buttons, or any widgets on the right.

Custom Drawer Icon

You can override the default drawer icon with a custom widget using the drawerIcon prop.

No Back Button

To hide the back button entirely, set showBackButton to false.

API

FluttyAppBar Props

PropTypeDefault
title
String
-
showBackButton?
bool
true
actions?
List<Widget>?
-
withProfile?
bool
false
withNotification?
bool
false
actionSpacing?
double
8.0
withDrawer?
bool
false
drawerIcon?
Widget?
-
FluttyUI — Build beautiful apps faster