Spacer composable in Android Kotlin - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to add a Spacer with a height of 16.dp between two Text composables.

Android Kotlin

Column {
  Text(text = "Hello")
  Spacer(modifier = Modifier.[1](16.dp))
  Text(text = "World")
}

Drag options to blanks, or click blank then click option'

Awidth

Bheight

Cpadding

Dsize

Attempts:

3 left

💡 Hint

Common Mistakes

Using Modifier.width() instead of height.

Using Modifier.padding() which adds padding inside, not space between.

The Spacer composable uses Modifier.height() to set vertical space.

2fill in blank

medium

Complete the code to add a Spacer with a width of 24.dp between two Buttons in a Row.

Android Kotlin

Row {
  Button(onClick = {}) { Text("Yes") }
  Spacer(modifier = Modifier.[1](24.dp))
  Button(onClick = {}) { Text("No") }
}

Drag options to blanks, or click blank then click option'

Aheight

Bpadding

Cwidth

Dsize

Attempts:

3 left

💡 Hint

Common Mistakes

Using Modifier.height() which adds vertical space in a horizontal layout.

Using Modifier.padding() which affects padding inside components.

In a Row, horizontal space is set using Modifier.width().

3fill in blank

hard

Complete the code to add a Spacer with a height of 10.dp.

Android Kotlin

Spacer(modifier = Modifier.[1](10.dp))

Drag options to blanks, or click blank then click option'

Aheight

Bwidth

Cpadding

Dsize

Attempts:

3 left

💡 Hint

Common Mistakes

Using Modifier.width() for vertical space.

Using Modifier.padding() which adds padding, not space.

Use Modifier.height(10.dp) to set vertical space.

4fill in blank

hard

Fill both blanks to create a Spacer with width 12.dp and height 8.dp.

Android Kotlin

Spacer(modifier = Modifier.[1](12.dp).[2](8.dp))

Drag options to blanks, or click blank then click option'

Awidth

Bheight

Cpadding

Dsize

Attempts:

3 left

💡 Hint

Common Mistakes

Using Modifier.padding() which does not set size.

Using Modifier.size() which sets both width and height at once.

Use Modifier.width() for horizontal and Modifier.height() for vertical dimensions.

5fill in blank

hard

Fill all three blanks to create a Spacer with width 20.dp, height 10.dp, and a background color.

Android Kotlin

Spacer(modifier = Modifier.[1](20.dp).[2](10.dp).background(color = [3]))

Drag options to blanks, or click blank then click option'

Awidth

Bheight

CColor.Red

Dpadding

Attempts:

3 left

💡 Hint

Common Mistakes

Using Modifier.padding() instead of size modifiers.

Using a color value without Color prefix.

Use Modifier.width() and Modifier.height() to set size, and Color.Red for background color.