Skip to content

Flutter multiplatform navigation sidebar / side navigation bar / drawer widget

License

Notifications You must be signed in to change notification settings

Frezyx/sidebarx

Folders and files

NameName
Last commit message
Last commit date

Latest commit

1e1850e · Apr 8, 2024
Jun 13, 2023
Apr 7, 2024
Apr 8, 2024
Jul 16, 2022
Jun 13, 2023
Mar 5, 2022
Apr 8, 2024
Mar 7, 2022
Mar 19, 2022
Mar 5, 2022
Apr 8, 2024
Mar 5, 2022
Apr 8, 2024

Repository files navigation

SidebarX 🔥

Flutter multiplatform navigation sidebar / side navigationbar / drawer widget

Show some ❤️ and star the repo to support the project!

Mobile Desktop Web
Image Image Image

Pub Star on Github License: MIT Repository views

Pub likes Pub popularity Pub points

Getting started

Follow these steps to use this package

Add dependency

dependencies:
  sidebarx: ^0.17.1

Add import package

import 'package:sidebarx/sidebarx.dart';

Easy to use

The package is designed with maximum adaptation to large screens.
Therefore, adding a widget to your screen will be very simple.

    Scaffold(
      body: Row(
        children: [
          SidebarX(
            controller: SidebarXController(selectedIndex: 0),
            items: const [
              SidebarXItem(icon: Icons.home, label: 'Home'),
              SidebarXItem(icon: Icons.search, label: 'Search'),
            ],
          ),
          // Your app screen body
        ],
      ),
    )

Use with small mobile screens

On small screens and mobile devices, you can use the ready-made Sidebar widget as your application's drawer for excellent UX.
Otherwise, leave the code unchanged and get the same experience

    Scaffold(
      drawer: SidebarX(
        controller: SidebarXController(selectedIndex: 0, extended: true),
        items: const [
          SidebarXItem(icon: Icons.home, label: 'Home'),
          SidebarXItem(icon: Icons.search, label: 'Search'),
        ],
      ),
      body: const Center(child: Text('Your app body')),
    )

Additional information

The project is under development and ready for your pull-requests and issues 👍
Thank you for support ❤️


Thanks to all contributors of this package



For help getting started with 😍 Flutter, view [online documentation](https://flutter.dev/docs), which offers tutorials, samples, guidance on mobile development, and a full API reference.