Now, the learning continue. Today, I am given the task to create a app that show the personal contact card of myself.
The idea is to demonstrate the usage of Card widget and also using custom fonts that can download from Google website, free of charge and free from copyright. You can download the font from the following link
The below is output that I created. I will show how it was being done.
Widgets used are MaterialApp, Scaffold, SafeArea, Column, CircleAvatar, AssetImage, SizeBox, Text, TextStyle, Card, ListTitle and Icon.
The following is the whole code that the app show the screen above.
CircleAvatar is to show user either with a image or as a initial. I uploaded a picture of mine to the images folder with the file name of avatar.png. The rest is very self explainary from line 21-25.
I use “Text” class before, but here I use “TextStyle” to make use of custom font that I downloaded from Google. This was use to show the name and the title in the name card.
So I learn something new this time, Card class, which is to show related information within a defined window or box. You can practically replace Text word with Card widget and more or less it will work.
The next new widget is the ListTile, which provide way to put icon in the Card, title, subtitle, and even a third line in the text and also a trailing icon if you choose to have it.
I modified the code to show the subtitle in ListTile and also a trailing icon.
Next lesson I should be learning about Stateless and Stateful. Exciting.
Onward, 1% better everyday.