The new way to Navigate in Style (ft. Collapsible Sidebar)
A stylish alternative to Navigation Rail in Flutter.
Flutter 1.17 introduced us to Navigation Rail. A cool way to navigate between different pages. It was especially useful for navigation in web pages since tab bars and app drawers did not fit well on large PC browser screens due to its aspect ratio.
I will say that Navigation Rail is one of my most favourite widgets and my get go method of navigation when building web apps with Flutter, but it feels a bit rigid sometimes.
I am a greedy person and love to customize my UIs with lots of animation. Navigation Rail fails me sometimes in this aspect. Even though the Flutter team has done an impressive job on it, more work is needed to make it further customizable. Unable to wait for the Flutter team to act I took it upon myself to create a more flexible and customizable version of this awesome widget.
After a lot of ☕, searching through designs on Dribble and with the help of some of my friends I came across Collapsible Sidebar. It was already there for web pages built using HTML and JavaScript. I decided to make its Flutter sibling, and after 3 days this was born:
It's not the best on its own but highly customizable and that’s the point. Developers can freely augment it to support their style and needs.
It has a lot of parameters that one can change according to their desire. They are:
You can find more in-depth details and how to use Collapsible Sidebar at: https://pub.dev/packages/collapsible_sidebar
Collapsible Sidebar uses custom objects called “Collapsible Items” in its body. These enable the fluid animations and allow the widget to be totally customizable.
🦚I am proud to say that Collapsible Sidebar is supported on all major platforms in Flutter including:
- Flutter Android 📱
- Flutter iOS 📱
- Flutter web 💻
- Flutter desktop 💻
💫Some of the reasons for why you should give it a shot:
- Material Design
- Highly customizable
- Pre-built customizable tile widgets (Collapsible Items)
- Smooth Animation
You can watch the live preview here: https://ryuukenshi.github.io/collapsible_sidebar
✨If you liked Collapsible Sidebar, I would highly appreciate it if you could give it a like on pub.dev and a star on GitHub. It would motivate me to keep making awesome custom widgets like this one for everyone to use.🌟
