@StateObject for observable objects in iOS Swift

Introduction

@StateObject helps you keep track of data that can change over time in your app. It makes sure your screen updates when the data changes.

When you want to create and own a data model that changes and affects your view.

When you have a class that holds information and you want your screen to update automatically when that information changes.

When you build a screen that needs to remember and watch an object for changes during its life.

When you want to avoid creating multiple copies of the same data model in your app.

When you want SwiftUI to manage the lifetime of your data object for a view.

Syntax

iOS Swift

@StateObject var model = MyObservableModel()

Use @StateObject only once per observable object in a view to create and own it.

Use classes that conform to ObservableObject with @Published properties inside.

Examples

This example creates a counter object that the view owns and watches for changes.

iOS Swift

class Counter: ObservableObject {
  @Published var count = 0
}

struct ContentView: View {
  @StateObject var counter = Counter()
  var body: some View {
    Text("Count: \(counter.count)")
  }
}

Here, the view owns a timer model that updates the time and the view updates automatically.

iOS Swift

class TimerModel: ObservableObject {
  @Published var time = 0
}

struct ContentView: View {
  @StateObject var timer = TimerModel()
  var body: some View {
    Text("Time: \(timer.time)")
  }
}

Sample App

This app shows a number that starts at zero. When you tap the button, the number goes up by one. The view updates automatically because it watches the counter object using @StateObject.

iOS Swift

import SwiftUI

class Counter: ObservableObject {
  @Published var count = 0
  func increment() {
    count += 1
  }
}

struct ContentView: View {
  @StateObject var counter = Counter()

  var body: some View {
    VStack(spacing: 20) {
      Text("Count: \(counter.count)")
        .font(.largeTitle)
      Button("Increment") {
        counter.increment()
      }
      .padding()
      .background(Color.blue)
      .foregroundColor(.white)
      .cornerRadius(8)
    }
    .padding()
  }
}

@main
struct MyApp: App {
  var body: some Scene {
    WindowGroup {
      ContentView()
    }
  }
}

Important Notes

Do not use @StateObject for objects passed from parent views; use @ObservedObject instead.

@StateObject creates and owns the object, so it stays alive as long as the view does.

Always mark your data class with ObservableObject and properties with @Published to notify changes.

Summary

@StateObject creates and owns an observable object in a SwiftUI view.

It makes the view update automatically when the data changes.

Use it once per object in the view that owns the data.

Practice

1. What is the main purpose of using @StateObject in a SwiftUI view?

easy

A. To create and own an observable object that updates the view when data changes

B. To create a constant value that never changes

C. To pass data between unrelated views without updating

D. To store temporary UI state that does not affect the view

Solution

1. Step 1: Understand the role of @StateObject

   @StateObject is used to create and own an observable object inside a SwiftUI view.

2. Step 2: Recognize its effect on the view

   When the observable object changes, the view automatically updates to reflect the new data.

3. Final Answer:

   To create and own an observable object that updates the view when data changes -> Option A

4. Quick Check:

   @StateObject = Owns observable object and updates view [OK]

Hint: Remember: @StateObject owns and updates view on data change [OK]

Common Mistakes:

• Confusing @StateObject with @State for simple values
• Using @StateObject multiple times for the same object
• Thinking @StateObject is for passing data without updates

2. Which of the following is the correct way to declare an observable object owned by a SwiftUI view using @StateObject?

easy

A. var model = @StateObject MyModel()

B. @State var model = MyModel()

C. @ObservedObject var model = MyModel()

D. @StateObject var model = MyModel()

Solution

1. Step 1: Recall the correct syntax for @StateObject

   The correct syntax is to declare a variable with @StateObject before the variable name and assign the observable object.

2. Step 2: Compare options

   @StateObject var model = MyModel() uses the correct syntax: @StateObject var model = MyModel(). Others either misuse property wrappers or have invalid syntax.

3. Final Answer:

   @StateObject var model = MyModel() -> Option D

4. Quick Check:

   Correct @StateObject syntax = @StateObject var model = MyModel() [OK]

Hint: Use '@StateObject var name = Type()' to declare owned observable [OK]

Common Mistakes:

• Using @State instead of @StateObject for observable objects
• Placing @StateObject after the variable name
• Using @ObservedObject when the view owns the object

3. Given the code below, what will be printed when the button is tapped?

class Counter: ObservableObject {
  @Published var count = 0
}

struct ContentView: View {
  @StateObject var counter = Counter()

  var body: some View {
    VStack {
      Text("Count: \(counter.count)")
      Button("Increment") {
        counter.count += 1
        print(counter.count)
      }
    }
  }
}

medium

A. Count: 0 initially, then prints 0 on button tap

B. Count: 0 initially, then prints 1 on button tap

C. Count: 1 initially, then prints 2 on button tap

D. Compilation error due to missing @ObservedObject

Solution

1. Step 1: Understand initial state and updates

   The counter starts at 0. The Text shows "Count: 0" initially.

2. Step 2: Analyze button action

   When tapped, counter.count increments by 1, so it becomes 1, and prints 1.

3. Final Answer:

   Count: 0 initially, then prints 1 on button tap -> Option B

4. Quick Check:

   Initial 0, increment prints 1 [OK]

Hint: Remember: @StateObject updates view and prints new value [OK]

Common Mistakes:

• Assuming count starts at 1 instead of 0
• Thinking print shows old value before increment
• Confusing @StateObject with @ObservedObject usage

4. Identify the error in the following SwiftUI view code using @StateObject:

struct MyView: View {
  @StateObject var model: MyModel

  var body: some View {
    Text(model.title)
  }
}

medium

A. Missing initialization of @StateObject variable

B. Should use @ObservedObject instead of @StateObject

C. model.title is not accessible in body

D. No error, code is correct

Solution

1. Step 1: Check @StateObject declaration

   @StateObject requires initialization when declared in a struct, but here it is declared without an initial value.

2. Step 2: Understand initialization requirement

   Because @StateObject owns the object, it must be initialized inside the view, e.g., @StateObject var model = MyModel().

3. Final Answer:

   Missing initialization of @StateObject variable -> Option A

4. Quick Check:

   @StateObject must be initialized [OK]

Hint: Always initialize @StateObject when declaring in a view [OK]

Common Mistakes:

• Forgetting to initialize @StateObject variables
• Confusing @StateObject with @ObservedObject initialization rules
• Assuming @StateObject can be nil without initialization

5. You have a parent view that owns a @StateObject called settings. You want to pass this object to a child view so it updates when settings changes. Which is the best way to do this?

hard

A. Use @State in the child view to hold settings

B. Declare @StateObject again in the child view for settings

C. Pass settings as an @ObservedObject parameter to the child view

D. Pass a copy of settings to the child view without property wrappers

Solution

1. Step 1: Understand ownership and passing rules

   The parent view owns the @StateObject. The child view should observe it without owning it.

2. Step 2: Choose correct property wrapper for child

   The child view uses @ObservedObject to observe changes without owning the object.

3. Step 3: Avoid re-declaring @StateObject in child

   Declaring @StateObject again in child creates a new instance, breaking shared state.

4. Final Answer:

   Pass settings as an @ObservedObject parameter to the child view -> Option C

5. Quick Check:

   Parent owns @StateObject, child uses @ObservedObject [OK]

Hint: Parent uses @StateObject; child uses @ObservedObject to share data [OK]

Common Mistakes:

• Re-declaring @StateObject in child view causing duplicate instances
• Passing copies instead of references causing no updates
• Using @State in child for observable objects