Adaptive Sidebar

Sleak sidebar for responsive Flutter apps with automatic size change.

Usage

AdaptiveSidebar(
    icon: Icon(Symbols.home_rounded),
    title: "Example",
    destinations: [
        SidebarDestination(
            icon: Symbols.home_rounded,
            label: AppLocalizations.of(context)!.home,
        ),
        SidebarDestination(
            icon: Symbols.workspaces_rounded,
            label: AppLocalizations.of(context)!.social,
        ),
        SidebarDestination(
            icon: Symbols.settings_rounded,
            label: AppLocalizations.of(context)!.settings,
        ),
    ],
    onPageChange: (index) {
        //Do something
    },
    child: child,
);

Who's using it?

• Æ1
• stats.fm - Spotify and Apple Music analytic's app.

API

child

The content you want to display with a sidebar.

destinations

Sidebar page options

pinnedDestination [optional]

This will be shown on top of the destination list

footerDestinations [optional]

These destinations will be pinned at the footer

onPageChange

Called when a new destination has been selected

icon

Icon shown before the title

title [optional]

Title of the app

titleStyle [optional]

Style of the title of the app

destinationsTextStyle [optional]

Text style of the destinations

selectedColor [optional]

The text and icon color of the selected destination (will defualt to Theme.of(context).primaryColor if none is provided)

maxLargeSidebarSize

size of the sidebar (Default: 192)

macOSTopPadding

Add 30px padding to the top on macOS

mediumAuto

Auto enable medium layout if passing medium breakpoint

mediumBreakpoint

The breakpoint size of the child space for the medium icon only layout

mediumManualButton

Manually enable and disable the medium layout

bottomNavigationBar [optional]

Show a bottomNavigationBar on smaller devices useing the bottomNavigationBarBreakpoint.

If no bottom navigation bar is given it will ignore the bottomNavigationBarBreakpoint and always show the sidebar.

bottomNavigationBarBreakpoint

Breakpoint of when the sidebar is enabled and the bottom navigation bar is no longer used.

backgroundWidget [optional]

Display a widget in the background behind the page and the sidebar.