@Binding for child communication in iOS Swift - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a binding variable in the child view.

iOS Swift

struct ChildView: View {
  @[1] var isOn: Bool

  var body: some View {
    Toggle("Switch", isOn: $isOn)
  }
}

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

AObservedObject

BBinding

CState

DEnvironmentObject

Attempts:

3 left

💡 Hint

Common Mistakes

Using @State instead of @Binding in the child view.

Forgetting the $ prefix when passing the binding.

Use @Binding to create a two-way connection from the parent to the child view.

2fill in blank

medium

Complete the code to pass a binding from the parent to the child view.

iOS Swift

struct ParentView: View {
  @State private var isOn = false

  var body: some View {
    ChildView(isOn: [1])
  }
}

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

A$isOn

BisOn

C&isOn

D*isOn

Attempts:

3 left

💡 Hint

Common Mistakes

Passing the variable without the $ prefix.

Using & or * which are not valid in SwiftUI for bindings.

Use $ to pass a binding of the state variable to the child.

3fill in blank

hard

Fix the error in the child view declaration to correctly use @Binding.

iOS Swift

struct ChildView: View {
  @Binding var isOn: Bool

  var body: some View {
    Toggle("Switch", isOn: $[1])
  }
}

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

Aself.isOn

BisOnBinding

CbindingIsOn

DisOn

Attempts:

3 left

💡 Hint

Common Mistakes

Not declaring the variable with @Binding.

Using a different name inside the $ prefix.

The toggle needs a binding, so the variable must be declared with @Binding and used with $isOn.

4fill in blank

hard

Fill both blanks to create a child view that toggles a binding boolean and shows text based on it.

iOS Swift

struct ChildView: View {
  @[1] var isOn: Bool

  var body: some View {
    VStack {
      Toggle("Switch", isOn: $isOn)
      Text(isOn ? [2] : "Off")
    }
  }
}

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

ABinding

B"On"

C"Enabled"

DState

Attempts:

3 left

💡 Hint

Common Mistakes

Using @State instead of @Binding for the property wrapper.

Using a string other than "On" for the true case.

The child uses @Binding for the boolean and shows "On" text when true.

5fill in blank

hard

Fill all three blanks to create a parent view with a state boolean, passing it as a binding to a child view.

iOS Swift

struct ParentView: View {
  @[1] private var isOn = false

  var body: some View {
    [2](isOn: [3])
  }
}

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

AState

BChildView

C$isOn

DBinding

Attempts:

3 left

💡 Hint

Common Mistakes

Using @Binding instead of @State in the parent.

Passing isOn without $ to the child.

Using wrong child view name.

The parent owns the state with @State, uses ChildView as child, and passes $isOn as binding.