Empty state handling in iOS Swift - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What will the UI show when the data array is empty?

Consider this SwiftUI view that shows a list or an empty state message. What will the user see if the data array is empty?

iOS Swift

struct ContentView: View {
  let data: [String]
  var body: some View {
    if data.isEmpty {
      Text("No items found.")
        .foregroundColor(.gray)
        .italic()
    } else {
      List(data, id: \.self) { item in
        Text(item)
      }
    }
  }
}

A A runtime error because the list has no data

B An empty list with no rows visible

C A gray italic text saying "No items found."

D A blank white screen with no text

💡 Hint

Look at the condition that checks if data.isEmpty and what it shows.

The code checks if the data array is empty. If it is, it shows a gray italic text "No items found." Otherwise, it shows the list of items.

❓ lifecycle

intermediate

When should you update the empty state UI in a SwiftUI view?

You have a SwiftUI view showing a list or an empty state message. When is the best time to update the UI to reflect changes in the data source?

A Whenever the data source changes, the view should update automatically if data is a @State or @ObservedObject property

B Only when the view appears for the first time

C Manually call a function to refresh the UI every second

D Update the UI only when the app restarts

💡 Hint

Think about how SwiftUI reacts to changes in @State or @ObservedObject properties.

SwiftUI automatically updates the UI when properties marked with @State or @ObservedObject change. This keeps the UI in sync with the data source.

🔧 Debug

advanced

Why does the empty state text not appear in this UIKit code?

This UIKit code tries to show a label when the data array is empty, but the label never appears. What is the cause?

iOS Swift

class ViewController: UIViewController {
  let data: [String] = []
  let emptyLabel = UILabel()

  override func viewDidLoad() {
    super.viewDidLoad()
    emptyLabel.text = "No data available"
    emptyLabel.textColor = .gray
    emptyLabel.textAlignment = .center
    if data.isEmpty {
      view.addSubview(emptyLabel)
    }
  }

  override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    emptyLabel.frame = CGRect(x: 0, y: 0, width: view.bounds.width, height: 50)
    emptyLabel.center = view.center
  }
}

A The label is never added to the view hierarchy

B The label is behind other views and not visible

C The label text is empty so nothing shows

D The label is added but has zero size because frame is set after viewDidLayoutSubviews

💡 Hint

Think about view layering and if other views cover the label.

The label is added and sized correctly, but other subviews added earlier may cover it. Without bringing the label to front or adjusting layering, it stays hidden behind other views.

❓ navigation

advanced

How to navigate from an empty state view to a data entry screen in SwiftUI?

You want to show a button on the empty state screen that navigates to a data entry view. Which code snippet correctly implements this navigation?

A Add a gesture recognizer to the empty state text to push DataEntryView

B Button(action: { NavigationLink(destination: DataEntryView()) }) { Text("Add Item") }

C Use a modal presentation without NavigationLink or NavigationView

D NavigationLink(destination: DataEntryView()) { Text("Add Item") } inside the empty state view

💡 Hint

NavigationLink is the standard way to navigate in SwiftUI inside a NavigationView.

NavigationLink creates a tappable element that navigates to the destination view when tapped. It must be inside a NavigationView to work properly.

🧠 Conceptual

expert

Why is handling empty states important in mobile app UX?

Choose the best explanation for why empty state handling improves user experience in mobile apps.

A It guides users on what to do next and prevents confusion when no data is available

B It reduces app size by not loading data unnecessarily

C It improves app performance by skipping UI rendering

D It allows the app to crash gracefully when data is missing

💡 Hint

Think about how users feel when they see an empty screen with no explanation.

Empty states provide helpful messages or actions that guide users, making the app feel friendly and easy to use even when no data is present.

Practice

1. What is the main purpose of handling an empty state in an iOS app?

easy

A. To hide the entire screen without any message

B. To crash the app when data is missing

C. To show a friendly message when there is no data to display

D. To load data repeatedly until available

Solution

1. Step 1: Understand empty state concept

   Empty state means no data is available to show in the UI.

2. Step 2: Purpose of empty state handling

   It improves user experience by showing a helpful message or guide instead of a blank screen.

3. Final Answer:

   To show a friendly message when there is no data to display -> Option C

4. Quick Check:

   Empty state = friendly message [OK]

Hint: Empty state means no data, so show a message [OK]

Common Mistakes:

• Ignoring empty data and showing blank screen
• Crashing app when data is empty
• Reloading data endlessly without message

2. Which Swift code snippet correctly checks if an array named items is empty?

easy

A. if items.isEmpty {}

B. if items.length == 0 {}

C. if items == nil {}

D. if items.count > 0 {}

Solution

1. Step 1: Identify correct Swift property for empty check

   Swift arrays have an isEmpty property to check if they contain no elements.

2. Step 2: Compare options

   if items.isEmpty {} uses items.isEmpty, which is the recommended and clear way to check emptiness.

3. Final Answer:

   if items.isEmpty {} -> Option A

4. Quick Check:

   Use isEmpty to check empty array [OK]

Hint: Use isEmpty property for arrays in Swift [OK]

Common Mistakes:

• Using count > 0 (checks non-empty)
• Checking items == nil (array is not optional)
• Using length property which does not exist for arrays

3. Given this Swift code, what will be the output when items is empty?

let items: [String] = []
if items.isEmpty {
  print("No items found")
} else {
  print("Items available")
}

medium

A. No items found

B. Items available

C. Nothing is printed

D. Runtime error

Solution

1. Step 1: Check the array content

   The array items is empty as it has no elements.

2. Step 2: Evaluate the if condition

   The condition items.isEmpty is true, so the first print statement runs.

3. Final Answer:

   No items found -> Option A

4. Quick Check:

   Empty array triggers "No items found" [OK]

Hint: Empty array triggers isEmpty true branch [OK]

Common Mistakes:

• Assuming else branch runs for empty array
• Expecting no output instead of print
• Thinking code crashes on empty array

4. Identify the error in this Swift code for empty state handling:

var data: [String]?
if data.isEmpty {
  print("No data")
}

medium

A. Using var instead of let causes error

B. data is optional, so isEmpty cannot be called directly

C. Missing else block for non-empty data

D. No error, code is correct

Solution

1. Step 1: Analyze variable type

   Variable data is an optional array ([String]?), meaning it can be nil.

2. Step 2: Check method call on optional

   You cannot call isEmpty directly on an optional without unwrapping it first.

3. Final Answer:

   data is optional, so isEmpty cannot be called directly -> Option B

4. Quick Check:

   Optional must be unwrapped before isEmpty [OK]

Hint: Optional arrays need unwrapping before isEmpty [OK]

Common Mistakes:

• Calling isEmpty directly on optional causes compile error
• Ignoring optional and assuming non-optional
• Thinking var vs let affects isEmpty usage

5. You want to show a label with text "No messages" only when the messages array is empty. Which SwiftUI code correctly handles this empty state?

hard

A. if messages.count > 0 { Text("No messages") } else { List(messages, id: \.self) { Text($0) } }

B. List(messages, id: \.self) { Text($0) } always shows, no empty state

C. Text(messages.isEmpty ? "No messages" : "")

D. if messages.isEmpty { Text("No messages") } else { List(messages, id: \.self) { Text($0) } }

Solution

1. Step 1: Understand the requirement

   Show "No messages" label only when messages array is empty, otherwise show the list.

2. Step 2: Evaluate options

   if messages.isEmpty { Text("No messages") } else { List(messages, id: \.self) { Text($0) } } uses if messages.isEmpty to conditionally show the label or the list, which is correct.

3. Step 3: Check other options

   if messages.count > 0 { Text("No messages") } else { List(messages, id: \.self) { Text($0) } } reverses the condition incorrectly. Text(messages.isEmpty ? "No messages" : "") shows empty text instead of list. List(messages, id: \.self) { Text($0) } always shows, no empty state never shows empty state.

4. Final Answer:

   if messages.isEmpty { Text("No messages") } else { List(messages, id: \.self) { Text($0) } } -> Option D

5. Quick Check:

   Use if isEmpty to toggle empty state UI [OK]

Hint: Use if isEmpty to show empty state or data list [OK]

Common Mistakes:

• Reversing the condition logic
• Showing empty text instead of list
• Not handling empty state at all