Passing Data in SwiftUI
Heads up... You’re accessing parts of this content for free, with some sections shown as text.
Heads up... You’re accessing parts of this content for free, with some sections shown as text.
Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.
Unlock now
Welcome to this video demo, where you’ll build the simple counter example discussed earlier. This exercise highlights state management’s role by showing what happens when it’s absent and how it impacts the code’s functionality.
Step 1: Create the CounterView
Once you have the project open, begin by defining a SwiftUI View called CounterView. Type the following code into the CounterApp.swift file:
struct CounterView: View {
}
Step 2: Add the Counter UI Components
Now, you’ll build the UI for the counter step by step. Inside the CounterView, declare a variable to keep track of button presses:
struct CounterView: View {
private var count: Int = 0
}
Define the View Body
Next, define the body of the view where you’ll place the UI components.
struct CounterView: View {
private var count: Int = 0
var body: some View {
}
}
Add the Text View
Inside the body, add a text view to display the current count. This view will show the value of count.
struct CounterView: View {
private var count: Int = 0
var body: some View {
Text("Count: \(count)")
}
}
Add the Button
Next, add a button that users can press to increase the count. Initially, just add the button with a title.
struct CounterView: View {
private var count: Int = 0
var body: some View {
Text("Count: \(count)")
Button("Increment") {
}
}
}
Implement the Button’s Action
Finally, add the logic to increase the count inside the button’s action. Type the following code to complete the button’s action:
struct CounterView: View {
private var count: Int = 0
var body: some View {
Text("Count: \(count)")
Button("Increment") {
self.count += 1 // This will attempt to increment the count
}
}
}
Step 3: Run the App and Observe
Even though you’ve already seen the error in the editor, try to build and run the app. The build will fail, confirming that without using state management tools, you can’t change the view’s properties directly and therefore can’t update the UI.
Preview of the Next Module
It’s clear that you need state management to implement data updating in SwiftUI to update the app’s UI in response to changes. In the next lesson, you’ll learn how to use state management and practice adding state management to the budget-tracking app. Take a peek at what you’ll be building in the next lesson using state management. Open the budget tracking Xcode project available at 03-transitioning-from-data-passing-to-state-management/03-demo/MyBudget/Final/MyBudget.xcodeproj.
Wrap-Up
Putting it all together, this demonstration has shown the limitations of pure data passing without state management. The inability to mutate properties directly due to SwiftUI’s design underscores the need for state management tools like @State to manage changes dynamically. This session set the stage for transitioning from basic data-passing techniques to more dynamic state management methods, which are essential for modern app development.