View protocol and body property in iOS Swift - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What does this SwiftUI view display?

Consider this SwiftUI view code. What text will appear on the screen?

iOS Swift

struct ContentView: View {
  var body: some View {
    Text("Hello, SwiftUI!")
      .padding()
  }
}

A A compile-time error due to missing body property

B An empty screen with no text

C A text label showing 'Hello, SwiftUI!' but no padding

D A text label showing 'Hello, SwiftUI!' with padding around it

💡 Hint

Remember the body property defines what the view shows.

The body property returns a Text view with the string 'Hello, SwiftUI!' and padding modifier adds space around it.

📝 Syntax

intermediate

Which option correctly implements the body property in a SwiftUI View?

Select the code snippet that correctly defines the body property for a SwiftUI View.

A func body() -> some View { Text("Hi") }

B var body: some View { Text("Hi") }

C var body: View { Text("Hi") }

D var body: some View { return Text("Hi") }

💡 Hint

The body property must be a computed property, not a function.

The body property is a computed property returning some View. Option B uses correct syntax without explicit return keyword. Option D is also correct with explicit return.

❓ lifecycle

advanced

What happens if a SwiftUI View does not implement the body property?

In SwiftUI, what is the result if a struct conforms to View but does not provide a body property?

iOS Swift

struct MissingBodyView: View {
  // no body property
}

A The view displays an empty screen

B The code fails to compile with an error about missing body property

C The view shows a default placeholder text

D The app crashes at runtime

💡 Hint

The View protocol requires a body property.

SwiftUI requires the body property to be implemented. Without it, the compiler shows an error.

🧠 Conceptual

advanced

Why does the body property use 'some View' as its return type?

In SwiftUI, the body property is declared as 'var body: some View'. What is the purpose of using 'some View' here?

A 'some View' means the body returns a specific, but hidden, type conforming to View

B 'some View' allows the body to return any type of value, including non-View types

C 'some View' is a placeholder that must be replaced with a concrete View type

D 'some View' means the body returns multiple Views at once

💡 Hint

Think about how Swift hides complex types behind 'some'.

'some View' is an opaque return type that hides the exact View type but guarantees it conforms to View.

🔧 Debug

expert

What error occurs with this incorrect body property implementation?

Examine this SwiftUI view code. What error will the compiler report?

iOS Swift

struct TestView: View {
  var body: some View {
    if true {
      Text("Yes")
    } else {
      Text("No")
    }
  }
}

A Error: Function declares an opaque return type but has no return statements in some paths

B No error, code compiles and shows 'Yes'

C Error: Cannot use if-else inside body property

D Error: Missing return keyword before Text views

💡 Hint

Check if all code paths return a View.

The body property must return a View on all paths. Using if-else without explicit return causes a compiler error about missing return.

Practice

1. What does the body property in a SwiftUI View protocol represent?

easy

A. The app's main entry point

B. The data model for the view

C. The navigation logic of the app

D. The content and layout of the view

Solution

1. Step 1: Understand the role of the View protocol

   The View protocol defines what the user interface shows in SwiftUI.

2. Step 2: Identify the purpose of the body property

   The body property returns the actual content and layout that the view displays.

3. Final Answer:

   The content and layout of the view -> Option D

4. Quick Check:

   body property = content and layout [OK]

Hint: Remember: body shows what the user sees [OK]

Common Mistakes:

• Confusing body with data or logic
• Thinking body controls navigation
• Assuming body is the app entry point

2. Which of the following is the correct way to declare the body property in a SwiftUI View?

easy

A. var body: some View { Text("Hello") }

B. func body() -> View { Text("Hello") }

C. let body = Text("Hello")

D. var body: View { return "Hello" }

Solution

1. Step 1: Recall the View protocol requirement

   The body property must be a computed property returning some View.

2. Step 2: Check each option's syntax

   var body: some View { Text("Hello") } correctly declares a computed property with type some View returning a Text view.

3. Final Answer:

   var body: some View { Text("Hello") } -> Option A

4. Quick Check:

   body is a computed property returning some View [OK]

Hint: body is always a computed property returning some View [OK]

Common Mistakes:

• Using func instead of var for body
• Returning a String instead of a View
• Declaring body as a stored property

3. Given the SwiftUI view code below, what will be displayed on the screen?

struct ContentView: View {
  var body: some View {
    VStack {
      Text("Hello")
      Text("World")
    }
  }
}

medium

A. Two texts stacked horizontally: Hello next to World

B. Only the text Hello is shown

C. Two texts stacked vertically: Hello above World

D. A runtime error occurs

Solution

1. Step 1: Understand VStack layout

   VStack arranges its child views vertically, one above the other.

2. Step 2: Analyze the body content

   The body contains a VStack with two Text views: "Hello" and "World".

3. Final Answer:

   Two texts stacked vertically: Hello above World -> Option C

4. Quick Check:

   VStack stacks views vertically [OK]

Hint: VStack stacks views vertically, HStack horizontally [OK]

Common Mistakes:

• Confusing VStack with HStack
• Expecting only one Text to show
• Thinking this causes an error

4. Identify the error in this SwiftUI view code:

struct MyView: View {
  var body: View {
    Text("Hi")
  }
}

medium

A. body must return 'some View', not 'View'

B. Text cannot be used inside body

C. Missing parentheses after Text("Hi")

D. body must be a function, not a property

Solution

1. Step 1: Check the body property type

   The body property must return 'some View' to satisfy the View protocol.

2. Step 2: Identify the incorrect return type

   The code uses 'View' instead of 'some View', which causes a compile error.

3. Final Answer:

   body must return 'some View', not 'View' -> Option A

4. Quick Check:

   body return type = some View [OK]

Hint: Always use 'some View' as body return type [OK]

Common Mistakes:

• Using 'View' instead of 'some View'
• Thinking Text needs parentheses
• Confusing property with function

5. You want to create a SwiftUI view that shows a red circle and a blue square stacked vertically. Which body implementation correctly achieves this?

hard

A. var body: some View { VStack { Circle().stroke(Color.red).frame(width: 50, height: 50) Rectangle().stroke(Color.blue).frame(width: 50, height: 50) } }

B. var body: some View { VStack { Circle().fill(Color.red).frame(width: 50, height: 50) Rectangle().fill(Color.blue).frame(width: 50, height: 50) } }

C. var body: some View { HStack { Circle().fill(Color.red).frame(width: 50, height: 50) Rectangle().fill(Color.blue).frame(width: 50, height: 50) } }

D. var body: some View { VStack { Circle().fill(Color.blue).frame(width: 50, height: 50) Rectangle().fill(Color.red).frame(width: 50, height: 50) } }

Solution

1. Step 1: Choose vertical stacking

   Use VStack to stack views vertically as required.

2. Step 2: Set correct colors and shapes

   Circle filled with red and Rectangle filled with blue matches the requirement.

3. Step 3: Verify frame sizes

   Both shapes have 50x50 frames, ensuring visible size.

4. Final Answer:

   VStack with red filled Circle and blue filled Rectangle -> Option B

5. Quick Check:

   VStack + fill colors match requirement [OK]

Hint: Use VStack for vertical stack and fill() for colors [OK]

Common Mistakes:

• Using HStack instead of VStack
• Using stroke() instead of fill() for color
• Swapping colors of shapes