Solution: Profile Actions Items

In this challenge, you'll explore the solution to the "Profile Action Items" challenge.

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.