COURSE 5: CREATE THE USER INTERFACE IN ANDROID STUDIO

Week 3: Advanced UI with Jetpack Compose

Meta Android Developer Professional Certificate

Complete Coursera Answers & Study Guide

Enroll in Coursera Meta Android Developer Professional Certification

INTRODUCTION

Get started building interfaces that consist of multiple screen and extend beyond visible screen area using Jetpack.

Learning Objectives

  • Implement navigation between multiple screens using the Navigation component.
  • Define simple lists with Compose.
  • Define high performing lists containing large number of items

SELF-REVIEW: CREATE A NAVIGATION IN COMPOSE

1. In this exercise, which property of the NavHost is used to set the initial destination?     

  • navController
  • modifier
  • startDestination (CORRECT)

Correct! The startDestination is used to set the initial destination.    

2. In this exercise, the composable function is used to add the routes for the for the NavHost.    

  • True (CORRECT)
  • False

Correct! the composable function is used to add the routes for the for the NavHost.    

3. In this exercise, which one of the following variables are created in the Destinations interface for defining the NavGraph.    

  • route (CORRECT)
  • nodes
  • icon

Correct! Route is required by the composable function for defining the NavGraph.     

4. Which among the following is responsible for managing the back stack in jetpack compose navigation?

  • NavGraph
  • NavController  (CORRECT)
  • NavHost  

Correct. NavController manages the back stack.

5. In this video, no separate file was created for the destination interface.

  • True
  • False (CORRECT)

Correct. A separate file for the interface was created to contain the interface and objects that implement the interface.

6. Destination Kotlin file contains:

  • Both destinations and routes (CORRECT)
  • Destinations only
  • Routes only 

Yes, it contains both destinations and routes.

SELF-REVIEW: CREATE TABBED NAVIGATION WITH JETPACK

1. In the exercise, which property of the Scaffold do you use to add MyBottomNavigation?    

  • topBar
  • bottomBar (CORRECT)   
  • modifier

Correct! The bottomBar is used to add MyBottomNavigation.    

2. In this exercise, which properties do you set for the BottomNavigationItem. Select all that apply.    

  • selected (CORRECT)   
  • onClick (CORRECT)   
  • label (CORRECT)   
  • icon (CORRECT)   

Correct! The selected parameter is used to check if the current item is selected.     

Correct! The onClick defines what happens when the current item is clicked.     

Correct! The label is used to set the label for the current item.    

Correct! The icon is used to set the icon for the current item. 

3. In the exercise, which one of the following approaches is used to iterate the list with an index?    

  • forEachIndexed method (CORRECT)   
  • forEach method

Correct! ForEachIndexed provides the item and the sequential index of the item.    

4. Which attribute prevents adding the same screen more than once to the Back Stack?

  • popUpTo   
  • NavController (CORRECT)   
  • NavHost   

Correct. Set the value launchSingleTop to true while navigating to prevent adding the same screen.

KNOWLEDGE CHECK: JETPACK NAVIGATION

1. Which among the following actions can start navigation? Select all that apply.

  • Clicking a tab item (CORRECT)  
  • Selecting an item from the list (CORRECT)  
  • Clicking a button (CORRECT) 

Correct! Clicking a tab item can navigate to a new screen.

Correct! Selecting an item from the list can open its details.

Correct! Clicking a button can navigate to a new screen.    

2. Bottom Navigation only navigates to a new destination without showing the status of the active item.

  • True
  • False (CORRECT)  

Correct! Bottom Navigation navigates to a new destination by showing the status of the active item.    

3. Select all that apply. The fixed start navigation principle states that:     

  • The application always ends with the same starting screen while leaving the app. (CORRECT)  
  • The application always starts from the same screen but ends with a different screen.   
  • The application always starts from the same first screen. (CORRECT)  

Correct! The application always ends with the same starting screen.   

Correct! The application always starts from the same first screen.  

4. The Stack works on which one of the following principles?

  • First in Last out
  • First in First out
  • Last in First out (CORRECT)  
  • Last in Last out

Correct! The Stack works in the Last in First out principle.

5.  Select all that apply. 

  • The purpose of NavHost is to:               
  • take the NavController as a parameter and associate it with the NavGraph. (CORRECT)  
  • act as a container for displaying the current destination. (CORRECT)
  • manage the Back Stack.

Correct! The NavHost takes the NavController as a parameter and associates it with the NavGraph.

Correct! The NavHost acts as a container for the current destination.

1. In this exercise, which function did you call to make the Column Scrollable?    

  • Modifier.horizontalScroll()    
  • Modifier.verticallScroll()   (CORRECT) 
  • Modifier.imeNestedScroll()    

Correct! The verticallScroll() is used for scrolling vertically.    

2. In this exercise, which property is used for arranging Row items?    

  • verticalArrangement
  • horizontalArrangement (CORRECT)

Correct! The horizontalArrangement is used with Row for arranging the children horizontally.    

3. In this exercise, which one of the following approaches was used to populate the Grid?    

  • forEachIndexed method
  • forEach method
  • repeat method (CORRECT)

Correct! repeat is used to repeat the GalleryCell() to populate the Grid.    

4. The ___________________ is an arrangement position where the first child starts and the last child ends and equally distributes the remaining items in between.

  • Space Around arrangement
  • Space Between arrangement (CORRECT)
  • Space Evenly arrangement

Correct! The Space Between is an arrangement position where the first child starts and the last child ends and equally distributes the remaining items in between.

5. Each item in a Grid is known as a ____________.

  • Cell (CORRECT)
  • Row
  • Column

That’s correct. Each item in a grid is known as a Cell.

KNOWLEDGE CHECK: LISTS AND GRIDS

1. Which among the following can be used to place its children horizontally?

  • Column
  • Row (CORRECT)

Correct! The row displays its children horizontally.

2. Which one of the following arrangements adds space to the first and last child on the list while keeping other items in the center?    

  • Space around (CORRECT)
  • Space between
  • Space Evenly

Correct! Space Around adds space to the first and last child on the list while keeping other items in the center.    

3. Which of the following arrangements can be used with a Column?    

  • Horizontal Arrangement
  • Vertical Arrangement (CORRECT)
  • Both Vertical and Horizontal Arrangements

Correct! The Vertical arrangement is used to arrange the children in a Column.    

4. Scrolling is available to a Row and a Column without adding any modifier.    

  • True
  • False (CORRECT)

Correct! A modifier is required to add the scrolling to the row and Column.    

5. For creating a Grid of a small number of elements, a combination of Row and Column composable can be used.    

  • True (CORRECT)
  • False

Correct! You can use the Row and Column together to create a Grid.    

SELF-REVIEW: CREATE AND STYLE A LAZY GRID

1. In this exercise, which of the following parameter was passed to GridCells.Adaptive()? 

  • 140.dp as the minimum size (CORRECT)
  • 2 as the count of columns    
  • 140.sp as the minimum size    

Correct! The value accepted by the GridCells.Adaptive() is the minimum size indp.    

2. In this exercise, GridCells.Fixed() defines a grid with as many rows or columns as possible.    

  • True
  • False (CORRECT)

Correct! The GridCells.Adaptive() defines a grid with as many rows or columns as possible.    

3. In this exercise, which one of the following approaches is used to populate the LazyVerticalGrid? Select all that apply.     

  • items method (CORRECT) 
  • forEach
  • forEachIndexed method  (CORRECT)

Correct! The items method is used to populate multiple items to a LazyVerticalGrid.    

Correct! forEachIndexed provides the item and the sequential index of the item. 

4. Compose provides two types of Grids, which are called LazyVerticalGrid and LazyHorizontalGrid. 

  • True (CORRECT)
  • False

That’s right. A Lazy vertical grid displays the items in a vertical scrollable grid, spanned across multiple columns. The Lazy horizontal grid displays the horizontal scrollable grid, spanned across multiple rows. 

5. In this video, a list of dishes was created using the data class Dish.

  • True (CORRECT)
  • False

Correct. A list of dishes was created using the data class Dish.

6. In this video, a LazyHorizontalGrid was used to create a Grid.

  • True
  • False (CORRECT)

Correct. A LazyVerticalGrid was used to create a Grid.

MODULE QUIZ: ADVANCED UI WITH JETPACK COMPOSE

1. Which of the following are required to add navigation between multiple screens? Select all that apply. 

  • NavController (CORRECT)
  • NavHost (CORRECT)
  • NavGraph (CORRECT)

Correct! A NavController is required to trigger navigation between screen.

Correct! A NavHost is required to link a NavController with a NavGraph.

Correct! A NavGraph is required by the NavHost to navigate between composables.

2. The type of the route variable which corresponds to the destination in navigation graph is ________ .

  • Boolean
  • String (CORRECT)
  • Int

Correct! The route is a String unique for every destination.  

3. True or false. The object keyword is used for creating an object without creating the class. 

  • True (CORRECT)
  • False

Correct. The object keyword is used for creating an object without creating the class.

4. In Navigation, for passing the arguments the default argument type is _______

  • Boolean
  • String (CORRECT)
  • Int

Correct! The Route is a String unique for every destination.  

5. In Navigation, __________ function is used for constructing a new argument.

  • argument()
  • navArgument() (CORRECT)
  • argumentNav()

Correct! The navArgument() is used for constructing a new argument. 

6. It is the best practice that the Bottom navigation must contain __________ 

  • any number of Destinations
  • three to five Destinations (CORRECT)
  • one or two Destinations 

Correct! It is best practice that the Bottom navigation must contain three to five Destinations.

7. What among the following elements is scrollable without adding the modifier? Select all that apply. 

  • LazyRow (CORRECT)
  • Row
  • Column
  • LazyColumn (CORRECT)

Correct! LazyRow is scrollable without adding the modifier.
Correct! LazyColumn is scrollable without adding the modifier.

8. What is the most suitable element when you have an unknown or large number of items? Select all that apply. 

  • Column
  • LazyRow (CORRECT)
  • LazyColumn (CORRECT)
  • Row 

Correct! Lazy Layouts are most suitable when you have an unknown or large number of items.

Correct! Lazy Layouts are most suitable when you have an unknown or large number of items.

9. Which among the following are the parameters of the composable function defined in the NavHost? Select all that apply. 

  • arguments (CORRECT)
  • navController
  • route (CORRECT)
  • startDestination 

Correct! arguments are used to provide a list of arguments for the next destination.

Correct! The route is used to define the route of the destination.

10. ________ is a collection of navigable destinations.    

  • NavHost    
  • NavGraph (CORRECT)    
  • NavController   

NavGraph is a collection of navigatable destinations.    

Interactive CSS CONCLUSION

To be written

Subscribe to our site

Get new content delivered directly to your inbox.

Liking our content? Then, don’t forget to ad us to your BOOKMARKS so you can find us easily!