🔗 Read Medium Article : Medium

🔗 Read LinkedIn Article : LinkedIn

This project demonstrates a responsive Flutter dashboard that adapts to mobile, tablet, and desktop screens. It uses Flutter’s LayoutBuilder to adjust the UI based on the screen width, providing an optimized experience across various device types.

• Introduction
• Features
• Technologies Used
• Setup
• How it Works
  • Mobile Layout
  • Tablet Layout
  • Desktop Layout
• Screenshots
  • Mobile
  • Tablet
  • Desktop
  • Navigation Bar On/Off
• Contributing
• License

This Flutter application demonstrates how to create a responsive layout for different device types: mobile, tablet, and desktop. The layout automatically adjusts based on the screen size using the LayoutBuilder widget. A dynamic navigation bar is included, with the ability to toggle its visibility.

• Responsive UI for mobile, tablet, and desktop.
• Separate navigation bar that can be toggled on and off.
• Clean, modern design that adapts seamlessly to different screen sizes.
• Uses Flutter's built-in LayoutBuilder for responsive design.

• Flutter: A UI toolkit for building cross-platform applications.
• Dart: The programming language used for Flutter development.

To get started with this project, follow these steps:

1. Clone the repository:

   gh repo clone ChathuminiBandara/responsive_dashbord_ui    

2. Navigate to the project directory:

   cd responsive_dashboard_ui

3. Install the necessary dependencies:

   flutter pub get

4. Run the project:

   flutter run

• Optimized for screens smaller than 500px in width.
• Provides a compact, vertical layout with navigation elements tailored for smaller devices.

• Activates for screen sizes between 500px and 1100px.
• Utilizes the extra space by offering more components on the screen compared to the mobile view.

• Designed for screens wider than 1100px.
• Fully leverages the horizontal space with a sidebar, more detailed navigation, and larger widgets.

Feel free to open issues or submit pull requests if you'd like to contribute to this project. Any contributions, such as bug fixes, feature requests, or improvements, are welcome.

This project is licensed under the MIT License. See the LICENSE file for more details.

@ChathuminiBandara©™20241024