Breakdown — Flutter @i/o 2018 (Part One)
Success is walking from failures @ no enthusiasm loss.
Website : http://flatteredwithflutter.com/
Spoiler alert : This post is a long one….
Presenters laid focus on building apps with flutter which are :
- Delightful Dev
Flutter will be now a first-class platform Material Design. Now, material guidelines would be available for Android, iOS, Web and Flutter.
In this section, we will see the main properties which were focused in the above video…Let’s get started…
- Widget : MaterialApp -> theme property
theme: _buildLightTheme() This was their custom theme, which had
2. Color constants file : A file of colors.
3. Addition in _buildLightTheme() function
primaryColor : kShrinePink,
primaryTextTheme: _buildTextTheme(base.primaryTextTheme, kShrineBrown),
primaryIconTheme: base.iconTheme.copyWith(color: kShrineBrown),
Note : -buildTextTheme() is another function written by presentor. (displayed below)
4. fontFamily property -> fontFamily: ‘Rubik’ in apply of _buildTextTheme()
5. LoginPage widget
Changed TextField to Theme (in _buildTextField()), added
data : Theme.of(context).copyWith(primaryColor: kShrineBrown)
6. Raised Button (Next) shape changed:
shape: BeveledRectangleBorder(borderRadius: _borderRadius)
7. GridView changed to AsymmetricView:
body: AsymmetricView(products: getProducts(Category.all)) ,
8. Border of LoginPage (username and password changed)
9. Border changed again
10. Removed AppBar from product display page and HomePage() from home of MaterialApp
11. Added Backdrop (basically a stack) to home property of MaterialApp
home: Backdrop(frontPanel: HomePage(), backPanel: MenuPage())
12. Implemented the dropdown Menu on hamburger icon click.
13. Animation on click of AppBar too. (use of gesture detectors)
14. Special mention of Flutter inspector for detecting the widgets live in application.
15. Changed the imageAspectRatio to 1.0, so that images look squared.
A short video of the i/o part1 journey :