A Flutter Coding Challenge with the Flutter community organized by HeyFlutter.com
Submit your Flutter project until 21. October: Drible by implementing this UI Challenge: YouTube video
- hooks_riverpod ©® by Remi Rousselet, is my choosen awesome state manager used with riverpod_generator
- freezed ©® by Remi Rousselet, for the plant data model
- universal_io ©® by Dint, to use Platform on web
- flutter_staggered_grid_view ©® by Romain Rastel, used for plants list page
- Yoda my plugin for the favourite icon animation
- StarMenu my plugin to display cart drop down menu
- magnifying_glass my plugin to have a magnifier in the plant details page
- plant items are hard-coded into
models/dummy.dart - plant names, descriptions and short-descriptions are generated with the help of ChatGPT ;) and the plant images don't reflect their name and descriptions!
- in the dummy plant items "db", are stored all the images available to make a working scroll of the choosen plant in its details page. Instead of searching for many images of the same plant on the web, I preferred to do this for simplicity in this example.
- in the bottom left of plat details page, the sketch indicates a "Total Price" maybe to indicate the total cart price. This could puzzle the user when he press the "Add to Cart" button. Instead I show the current plant price and the total cart price is displayed in the drop down menu cart icon.
- the shader used in the plant detail page comes from https://www.shadertoy.com/view/4djGzz
- on desktop and web (not on the mobile browser) the Scaffold aspect ratio body has been fixed to 7/10
- on Android it is better to not open the app within the WebView but instead with the normal mobile browser
| onBoarding page | search page | details page |
|
|
|
Where to reach me:
