This project demonstrates how to build an adaptive navigation bar in Flutter that adjusts its layout based on the device's screen size. It utilizes GoRouter for navigation and provides a seamless user experience across mobile, tablet, and web platforms.
- Responsive Navigation: The navigation bar automatically adapts to different screen sizes.
- Mobile: Bottom navigation bar.
- Tablet: Side navigation rail.
- Web: Top tab bar.
- GoRouter Integration: Leverages GoRouter for declarative routing and navigation management.
- Clean Code Structure: Organized codebase for easy understanding and maintenance.
- Customizable: Easily modify the navigation bar items and layout to fit your specific needs.
-
Clone the repository:
git clone https://github.com/your-username/adaptive-navigation-flutter.git -
Install dependencies:
flutter pub get -
Run the app:
flutter run
The app showcases a basic example of adaptive navigation. You can customize it further by:
- Adding your own navigation destinations.
- Modifying the layout and styling of the navigation bar.
- Integrating with your existing Flutter application.
For a detailed explanation of the implementation, including code snippets and insights, please refer to the following Medium article:
Adaptive Navigation in Flutter: Bottom for Mobile, Side for Tablet, Top for Web with GoRouter
Contributions are welcome! If you find any issues or have suggestions for improvements, please feel free to open an issue or submit a pull request.
This project is licensed under the MIT License - see the LICENSE file for details.