Form container in iOS Swift - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a form container in SwiftUI.

iOS Swift

var body: some View {
    [1] {
        Text("Enter your name")
        TextField("Name", text: $name)
    }
}

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

AForm

BVStack

CHStack

DList

Attempts:

3 left

💡 Hint

Common Mistakes

Using VStack or HStack instead of Form causes missing form styling.

Using List changes the layout to a list style, not a form.

The Form container groups input controls in a styled form layout in SwiftUI.

2fill in blank

medium

Complete the code to add a section inside the form container.

iOS Swift

Form {
    [1] {
        Text("Email")
        TextField("Enter email", text: $email)
    }
}

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

AVStack

BGroup

CSection

DHStack

Attempts:

3 left

💡 Hint

Common Mistakes

Using VStack or HStack inside Form does not provide section styling.

Using Group does not add section headers or footers.

The Section groups related form fields inside a form with a header and footer.

3fill in blank

hard

Fix the error in the form code by completing the missing container.

iOS Swift

var body: some View {
    Form {
        Text("Username")
        [1]("Enter username", text: $username)
    }
}

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

AText

BLabel

CButton

DTextField

Attempts:

3 left

💡 Hint

Common Mistakes

Using Text instead of TextField shows static text, not input.

Using Button or Label is not for text input.

The TextField is the input control for text entry inside a form.

4fill in blank

hard

Fill both blanks to create a form with a section header and a toggle switch.

iOS Swift

Form {
    [1]("Settings") {
        [2]("Enable notifications", isOn: $notificationsEnabled)
    }
}

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

ASection

BButton

CToggle

DText

Attempts:

3 left

💡 Hint

Common Mistakes

Using Button instead of Toggle does not create a switch.

Using Text instead of Section does not add a header.

Section adds a header, and Toggle adds a switch control inside the form.

5fill in blank

hard

Fill both blanks to create a form with a section, a picker, and a label.

iOS Swift

Form {
    [1]("Choose color") {
        Picker(selection: $selectedColor, label: [2]("Color")) {
            Text("Red").tag(1)
            Text("Green").tag(2)
            Text("Blue").tag(3)
        }
    }
}

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

ASection

BLabel

CText

DButton

Attempts:

3 left

💡 Hint

Common Mistakes

Using Button instead of Text causes issues.

Using Text instead of Section removes the header.

Section groups the picker with a header, Text provides the label for the picker, and Text is used inside the picker options.