Solution: Profile Actions Items
In this challenge, you'll explore the solution to the "Profile Action Items" challenge.
We'll cover the following
Solution: Profile actions items
In this challenge, you were expected to add the rest of the Profile Action Items along with the “Call” & “Text” action items. Let’s go over each of them, to understand their implementation.
Video action item
This action item needs an icon and label. The Icons.video_call
provides the icon. Use “Video” for labeling the icon.
Add your implementation in the buildVideoCallButton()
method to the parent Row
widget’s children.
Widget buildVideoCallButton() {
return Column(
children: <Widget>[
//Adding icon button
IconButton(
icon: Icon(
Icons.video_call,
color: Colors.indigo.shade800,
),
//Empty onPressed since there is not action defined on it
onPressed: () {},
),
Text("Video"),
],
);
}
Email action item
This action item needs an icon and label as well. The Icons.email
provides the icon. Use “Email” for labeling the icon.
Add your implementation in the buildEmailButton()
method to the parent Row
widget’s children.
Widget buildEmailButton() {
return Column(
children: <Widget>[
IconButton(
icon: Icon(
Icons.email,
color: Colors.indigo.shade800,
),
onPressed: () {},
),
Text("Email"),
],
);
}
Directions action item
This action item needs an icon and label. The Icons.directions
provides the icon. Use “Directions” for labeling the icon.
Add your implementation in the buildDirectionsButton()
method to the parent Row
widget’s children.
Widget buildDirectionsButton() {
return Column(
children: <Widget>[
IconButton(
icon: Icon(
Icons.directions,
color: Colors.indigo.shade800,
),
onPressed: () {},
),
Text("Directions"),
],
);
}
Pay action item
This action item needs an icon and label. The Icons.attach_money
provides the icon. Use “Pay” for labeling the icon.
Add your implementation in the buildPayButton()
method to the parent Row
widget’s children.
Widget buildPayButton() {
return Column(
children: <Widget>[
IconButton(
icon: Icon(
Icons.attach_money,
color: Colors.indigo.shade800,
),
onPressed: () {},
),
Text("Pay"),
],
);
}
Add separator
After adding the action items above, add a Divider
widget to separate Profile Action Items from other widgets below it.
Divider(
color: Colors.grey,
),
Get hands-on with 1400+ tech skills courses.