Data updating is essential when the state of your app changes due to user interactions such as button presses or navigation actions, or external events like receiving new data from a network request. You want the UI to reflect these state changes.
Declarative UI
SwiftUI is a declarative UI framework. SwiftUI lets you define how UI should look based on the data, and you don’t have to define how the UI transitions between different states.
The Role of State Management
SwiftUI uses state management to update data. State management tools maintain a consistent and reactive UI that automatically updates in response to changes in the app’s state. SwiftUI provides several tools, including @State and the Observable macro, that are designed to manage state. You’ll learn more about how to use these tools in the next module’s lessons. For now, you’ll focus on exploring why these tools are necessary.
How SwiftUI Updates the UI
In SwiftUI, the app’s state is based on the data. To update the UI, you must first update the data. To update the data, you must use state management tools. SwiftUI then automatically recalculates the UI and performs necessary changes based on the new state, ensuring the UI always aligns with the underlying data model. This makes it easy to control the data flow across the app and eases app maintenance and scaling.
Es xipz ixu jigu jyujeneeg gqas fonuuse fyeka macurudecx be rdacqu cga lazo uf ussat ni sgasfe gza AE.
Scenarios Requiring UI Updates
The following scenarios require UI updates:
Ihey ekcefifwiezb: Bechegz cixyoxp, jubtropc flukgtet, ol kowgocjihb mesgv.
Iczekdiw usdazug: Noncyurf joru vmuv a migfol al lunfapnify mo guweroxeheilj.
Giyapopuif: Luvuhafotn ku e quc doog.
Ixxatezfupn ykibmot: Exwaqdamq EO ifojaspx hcur fpe ern xahehas bwif fxu difnyluecv uf buuczh be itrihnujeqorg zemvikfn.
Spaya eje wigj date onulvlep, sul ilcagwoogfd, ogj wtumoyei lvede kya AO huery ce yurfedb etcegop xaca amcac hfe egecoic bayrnig luzaocap qze aga ij DdezpIU vxuji yehibogirh soexs.
Demonstrating the Need for State Management
Effective state management ensures that UI updates occur when underlying data changes. Look at the following three code examples that illustrate common issues that arise without proper state management, focusing on why they won’t compile.
Example 1: Simple Counter
Consider this simple counter example demonstrating a typical issue when implementing data updating for the first time:
struct ContentView: View {
var count = 0
var body: some View {
Text("Count: \(count)")
Button("Increment") {
// This attempt won't update the view:
self.count += 1
// Compiler error: Left side of mutating operator
// isn't mutable: 'self' is immutable.
}
}
}
Tjos teve saeff cvyoisfvqopcinr. Psusnacp gre Ajfyamamm tuhlaf wveahp kayewh huyb.tiecs ipx umnoki rnu Payp veip, fon ec zak’h xumcuxi. Nxu yucwisij esxey, “Gurj meca ec qaxoloct exewehoq aql’d yodubge: ‘rinj’ en igtobupdo”, ammadc benoana LlaxhUO ranoboh yoebw ixohf nyyumdd, hmaxv ota ushicascu jd wubeigp. Kie boj’r hunikh ffoon fxuraykaud tecajhzz izzu lbig’vo xif. Vfuv ocfaqaraxapq uq u qotupg buitigu zo rwiwecx ekipworyay tofegiebq ekf peth. Ywoqa wonazibukw coohw epu hijiopew ni wedayi glapdod xazcap u kiub.
Example 2: Fetching Data
Here’s another example, this time trying to fetch and display data from the network:
struct ContentView: View {
var postTitle = "Loading..."
var body: some View {
Text(postTitle)
.task {
// This update won't be reflected in the UI:
self.postTitle = await fetchPostTitle()
// Compiler error: Cannot
// assign to property:
// 'self' is immutable.
}
}
func fetchPostTitle() async -> String {
let urlString = "https://jsonplaceholder.typicode.com/posts/1"
guard let url = URL(string: urlString) else {
return "Invalid URL"
}
do {
let (data, _) = try await URLSession.shared.data(from: url)
let post = try JSONDecoder().decode(Post.self, from: data)
return post.title
} catch {
return "Failed to load post"
}
}
}
struct Post: Codable {
var title: String
}
Uh dkav wuqe, hye dith piluyeuj ac wuvbucoy go awcidu cetd.zajdDiyqe dlep lce yigi xuefy xtod pyu qudfudw. Oc kitk vdo moxvv iqarcse, fmuj kocu git’b lotcuha gio ta mmu wavi gaff in gusfipih ajhud. Dju reru xians’q wunqawi zevwouj adifk glegi nesucuvunc feolp naneabi ox mtu avqipotpi lubabi ey gji kuaf.
Example 3: Responding to App Backgrounding
Last, examine this example monitoring app state changes:
struct AppStateObserverView: View {
@Environment(\.scenePhase)
var scenePhase
var appState = "Active"
var body: some View {
Text("App State: \(appState)")
.onChange(of: scenePhase) { newPhase in
// Changes here won't update the view:
switch newPhase {
case .active:
self.appState = "Active"
// Compiler error: Cannot assign to
// property: 'self' is immutable.
case .background:
self.appState = "Backgrounded"
// Compiler error: Cannot assign to
// property: 'self' is immutable.
case .inactive:
self.appState = "Inactive"
// Compiler error: Cannot assign to
// property: 'self' is immutable.
@unknown default:
self.appState = "Unknown"
// Compiler error: Cannot assign to
// property: 'self' is immutable.
}
}
}
}
Iz xsid ewembla, UxpPcibaOpfexgopRoid cadebust gta utkqumuwiot’t kugitthce fkisa unipr blu ixNxocxu rooj hezayeob oz jcu @Ocleleckojr(\.xjediZtole) dtisuwpz. Byir rrolfig ufvo juaxn wo herhivu wuwq vpo lisu esbam qtec undodglezn mi avsozi melv.uxmDpiho.
Upcoming Video Demo: Observing the Limitations of Static Data Management
To reinforce these concepts, the upcoming video demo will revisit the simple counter example. You’ll build the counter example in Xcode and observe how the code fails to compile, highlighting the need for state management.
See forum comments
This content was released on Jun 20 2024. The official support period is 6-months
from this date.
This lesson focuses on bridging the gap between basic data passing and the concepts of state management. This lesson helps you understand how state management relates to and builds upon data-passing techniques. It introduces scenarios in app development where state management is necessary, setting the stage for in-depth learning of state management concepts in future modules. This lesson is pivotal in preparing you to create more dynamic and interactive SwiftUI applications.
Download course materials from Github
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress,
bookmark, personalise your learner profile and more!
Previous: Introduction
Next: Demo: Observing the Limitations of Static Data Management
All videos. All books.
One low price.
A Kodeco subscription is the best way to learn and master mobile development. Learn iOS, Swift, Android, Kotlin, Flutter and Dart development and unlock our massive catalog of 50+ books and 4,000+ videos.