/mi_card_flutter

This is a companion project (lesson 6) to The App Brewery's Complete Flutter Development Bootcamp

Primary LanguageDart

App Brewery Banner

Mi Card

Our Goal

Now that we've seen how to create a Flutter app entirely from scratch, we're going to go further and learn more about how to design user interfaces for Flutter apps.

What we will create

Mi Card is a personal business card. Imagine every time someone wants our contact details or our business card but you we didn't have it on us. Well, now we can get them to download our business card as an app.

What I learnt

  • How to create Stateless Widgets
  • What is the difference between hot reload and hot refresh and running an app from cold
  • How to use Containers to lay out the UI
  • How to use SafeArea widget
  • How to use Flutter Inspector
  • How to use Columns and Rows to position the UI elements
  • How to use CircleAvatar widget
  • How to add custom fonts from fonts.google.com
  • How to add Material icons
  • How to style Text widgets
  • How to use Padding widget
  • How to use Card widget
  • How to use ListTile widget
  • How to read and use Flutter Documentation

Finished App

android app ss

Side Challenge

In this project we were challenged to build a given layout with Rows, Columns and Containers. I successfully completed it. The challenge specifications are below:

layout challenge specs

This is a companion project (lesson 6) to The App Brewery's Complete Flutter Development Bootcamp, check out the full course at www.appbrewery.co

End Banner