Flutter Storyboard
A Flutter based application to showcase your custom widgets in your app that helps in easy review of the design. Features of the Flutter Storyboard:
- Reduction in time of Review process.
- Easy and fast Design-to-app process.
- Verify how your widget will react to changing themes.
- Copy the code of the widget for easy implementation [TODO].
Project Structure
Our project will consist of multiple screens, namely Screen 1, Screen 2 and so on (aptly named) and some Common UI Widget that will be shared across multiple screens. And under each screen, we will have the desired components that we need that make up that screen, namely Widget 1, Widget 2 (aptly named too). And each widget will have different states.
Implementation looks like this:
How to Work it?
STEP 0
Install Flutter if you don't have it: Flutter
Fork the repository and open the repository in Android Studio.
STEP 1
You will see this project structure where you will mostly not be concerend with any of the directories except widget_library
STEP 2
You will place your widgets in the Widget Library directory. After placing all of your widgets there, in whatever order you wish, you have to edit the widget_list_data.dart file when you are done creating the Widgets you want in your app.
Add your desired theme inside themes.dart and View how your widget are aware to your theme.
Resources
Understand the working of Flutter Storyboard through the Medium article and try the app on the playstore. Just download and see the magic
- Medium: https://bit.ly/storyboard-article
- Playstore: https://bit.ly/storyboard-app
- Web: https://bit.ly/flutterboard
Installation For Web
Use this link to install web version of the Flutter Storyboard Web
flutter build webFlutter Web Look and Feel
Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.