Panel and layout groups in Unity - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to add a Vertical Layout Group component to the panel.

Unity

panelGameObject.AddComponent<[1]>();

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

AHorizontalLayoutGroup

BVerticalLayoutGroup

CContentSizeFitter

DGridLayoutGroup

Attempts:

3 left

💡 Hint

Common Mistakes

Choosing HorizontalLayoutGroup which arranges items horizontally.

Using GridLayoutGroup which arranges items in a grid.

Adding ContentSizeFitter which adjusts size but does not layout children.

The VerticalLayoutGroup arranges child elements vertically inside the panel.

2fill in blank

medium

Complete the code to set the spacing between elements in a Horizontal Layout Group.

Unity

horizontalLayoutGroup.[1] = 10f;

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

AchildAlignment

Bpadding

Cspacing

DchildControlWidth

Attempts:

3 left

💡 Hint

Common Mistakes

Using padding which adds space around the edges, not between elements.

Changing childAlignment which affects alignment, not spacing.

Modifying childControlWidth which controls child width behavior.

The spacing property controls the space between child elements in the layout group.

3fill in blank

hard

Fix the error in the code to correctly add a Grid Layout Group and set cell size.

Unity

var grid = panel.AddComponent<[1]>();
grid.cellSize = new Vector2(100, 100);

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

AGridLayout

BGridGroupLayout

CGridGroup

DGridLayoutGroup

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect component names that do not exist.

Misspelling the component name causing compile errors.

The correct component name is GridLayoutGroup. Other names are invalid and cause errors.

4fill in blank

hard

Fill both blanks to create a panel with a Content Size Fitter and set it to adjust width.

Unity

var fitter = panel.AddComponent<[1]>();
fitter.[2] = ContentSizeFitter.FitMode.PreferredSize;

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

AContentSizeFitter

BVerticalLayoutGroup

ChorizontalFit

DcontentSizeFitter

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong component names like VerticalLayoutGroup.

Trying to set a property that does not exist or is misspelled.

The ContentSizeFitter component adjusts the panel size. The horizontalFit property sets how width is adjusted.

5fill in blank

hard

Fill all three blanks to create a Grid Layout Group, set cell size, and spacing.

Unity

var grid = panel.AddComponent<[1]>();
grid.cellSize = new Vector2([2], [3]);
grid.spacing = new Vector2(5, 5);

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

AGridLayoutGroup

B100

DVerticalLayoutGroup

Attempts:

3 left

💡 Hint

Common Mistakes

Using VerticalLayoutGroup instead of GridLayoutGroup.

Setting cellSize with incorrect or missing values.

The GridLayoutGroup arranges elements in a grid. The cellSize is set with width and height values (100, 100).