Form container in iOS Swift - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What is the output of this SwiftUI form layout?

Consider this SwiftUI code for a form container. What will the user see when this view is rendered?

iOS Swift

import SwiftUI

struct ContentView: View {
  var body: some View {
    Form {
      Section(header: Text("User Info")) {
        TextField("Name", text: .constant("") )
        TextField("Email", text: .constant("") )
      }
      Section(header: Text("Preferences")) {
        Toggle("Subscribe", isOn: .constant(true))
      }
    }
  }
}

A A form with two sections: 'User Info' containing two text fields for Name and Email, and 'Preferences' containing a toggle switch labeled 'Subscribe'.

B A vertical stack with two text fields and a toggle, but no section headers or form styling.

C A list of buttons labeled 'Name', 'Email', and 'Subscribe' without input fields.

D An empty view with no visible UI elements.

💡 Hint

Look at how Form and Section are used to group inputs with headers.

The Form container in SwiftUI groups inputs into sections with headers. TextField and Toggle inside sections create labeled input controls. This code produces a form with two labeled sections and appropriate input controls.

❓ lifecycle

intermediate

When does the SwiftUI Form update its state?

Given a Form with input fields bound to @State variables, when does the form update its UI to reflect changes?

iOS Swift

import SwiftUI

struct SettingsView: View {
  @State private var notificationsEnabled = false

  var body: some View {
    Form {
      Toggle("Enable Notifications", isOn: $notificationsEnabled)
      if notificationsEnabled {
        Text("Notifications are ON")
      } else {
        Text("Notifications are OFF")
      }
    }
  }
}

A The form never updates automatically; state changes are ignored.

B The form updates only when the view appears again after being dismissed.

C The form updates only after a manual refresh triggered by the user.

D The form updates its UI immediately when the toggle is changed by the user.

💡 Hint

Think about how @State works in SwiftUI.

In SwiftUI, @State variables trigger the view to re-render immediately when their values change. The form updates its UI instantly to reflect the new state.

❓ navigation

advanced

What happens when you embed a Form inside a NavigationView?

Consider this SwiftUI code snippet. What is the visible effect of embedding the Form inside a NavigationView with a title?

iOS Swift

import SwiftUI

struct ProfileView: View {
  var body: some View {
    NavigationView {
      Form {
        TextField("Username", text: .constant("") )
        SecureField("Password", text: .constant("") )
      }
      .navigationTitle("Profile")
    }
  }
}

A The form appears without any navigation bar or title.

B The form appears with a navigation bar at the top showing the title 'Profile'.

C The form crashes because Form cannot be inside NavigationView.

D The form appears but the title is shown at the bottom of the screen.

💡 Hint

NavigationView adds a navigation bar with a title.

Embedding a Form inside NavigationView adds a navigation bar at the top. The navigationTitle modifier sets the title text visible in that bar.

📝 Syntax

advanced

What error does this SwiftUI form code produce?

Examine this SwiftUI code snippet. What error will occur when compiling?

iOS Swift

import SwiftUI

struct TestView: View {
  var body: some View {
    Form {
      TextField("Enter", text: .constant("") )
      Section {
        Toggle("Enable", isOn: .constant(true))
      }
      Section(header: Text("Settings")) {
        Text("Extra")
      }
    }
  }
}

A Syntax error: 'Section' missing braces around its content.

B Runtime error: Toggle cannot be inside a Section.

C No error; code compiles and runs fine.

D Type error: TextField requires a binding to a @State variable, not a constant.

💡 Hint

Check the Section declaration syntax carefully.

The Section with header 'Settings' lacks braces {} around its content. This causes a syntax error because Section expects a closure for its content.

🔧 Debug

expert

Why does this form not update the toggle state?

This SwiftUI form has a toggle bound to a variable. Why does toggling it not change the UI?

iOS Swift

import SwiftUI

struct DebugView: View {
  var isOn = false

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

A Because the Form container disables toggles by default.

B Because the Toggle label must be a Text view, not a string.

C Because 'isOn' is a regular variable, not a @State property, so changes don't trigger UI updates.

D Because the Toggle requires a Binding to an @ObservedObject, not a variable.

💡 Hint

Think about how SwiftUI tracks state changes.

In SwiftUI, only @State properties trigger UI updates when changed. A plain variable does not provide a binding that updates the view.