SwiftUI에서 상태를 제공하는 세 가지.
– State property
– Binding
– Observed Object
state property
https://developer.apple.com/documentation/swiftui/state
String, Int, Bool 과 같은 간단한 값을 저장하고 View의 현재 상태를 표시하기 위해 사용된다.
private 로 선언되어야 한다.
정의하는 법
@State private var userID: Int = 0
위와 같이 @state 를 붙여서 정의한다.
View 에서 state property 표시하기
@State private var message = “”
Text(message)
– 이 경우는 Text가 message의 값을 표시하는 단순한 참조입니다.
–message property 값의 변화가 생겼을 때 SwiftUI는 새로 렌더링되어 새로운 값을 표시합니다.
사용자로부터 View에 입력된 값을 state property 에 넣기
@State private var message = “”
TextField(“메세지를 입력해주세요.”, text: $message)
– $ 를 사용해서 state property 를 호출합니다.
– 사용자가 TextField 에 새로운 값을 입력시키면 message property에도 반영됩니다.
– message 를 참조하고 있던 View 가 있다면 새로 렌더링되어 새로운 값이 표시됩니다.
Binding
https://developer.apple.com/documentation/swiftui/binding
A라는 부모뷰에서 a라는 하위뷰를 사용하고,
a는 A의 state property 를 표시하고 능동적으로 값이 변화해야할 때,
필요한 것이 Binding 입니다.
📺 예제
struct CurrentMessageTextView: View { @State private var message = "안녕하세요. SwiftUI는 어떠신가요" var body: some View { Text(message) .padding(.all, 10.0) .border(Color.green, width: 2.0) } } struct ContentView: View { var body: some View { VStack(spacing: 10.0) { CurrentMessageTextView() CurrentMessageTextView() } } }
– 위의 코드를 살펴보면, CurrentMessageTextView 는 ContentView 의 자식뷰로 구성되어 있습니다.
– ContentView 에 state property 를 추가하고 CurrentMessageTextView 들이 그 값을 참조하기 위해서 Binding 을 넣어보죠 !
struct CurrentMessageTextView: View { @Binding var message: String // 💫 Binding의 등장 var body: some View { Text(message) .padding(.all, 10.0) .border(Color.green, width: 2.0) } } struct ContentView: View { // ✔️ CurrentMessageTextView 가 참조하고자 하는 state property @State private var message = "안녕하세요. SwiftUI는 어떠신가요" var body: some View { VStack(spacing: 10.0) { CurrentMessageTextView(message: $message) // ⁉️⁉️⁉️⁉️⁉️⁉️ CurrentMessageTextView(message: $message) } } }
– ⁉️ 의 부분에 왜 $이 필요할까요?
– 부모뷰에서는 자식뷰에서 Binding 을 통해 참조만 할 것인지 새로운 값까지 대입시킬 것인지 판단할 수 없기 때문에 사용해야합니다.
– 개인적으로는 private(set) 처럼 참조만 가능하게 하는 편이 나중의 안전성을 조금 더 보장하지 않았을까 싶기도 하네용

– ContentView 에서 변경한 값이 잘 반영되고 있지요 ~~~ ?
– UIKit에서 작성했었던 update 메소드들이 주마등처럼 지나가네요 😭
Observed Object
@ObservedObject 을 사용하기 위해서는 ObservableObject를 만들어야합니다.
두 가지 모두 iOS 13에서 SwiftUI과 함께 Combine 프레임워크에 포함되어 공개되었어요.
그리고 Rx 를 외부 프레임워크 도입없이, 네이티브에서 구현할 수 있게 되었죠.
Combine에 대해서 자세히 설명하게 되면 너무 이야기가 커져버려서 😢
여기서는 View에서 @ObservedObject를 어떻게 사용하고, ObservableObject를 어떻게 만드는지에 대해 알아볼게요 !
ObservableObject는 프로토콜로 정의되어 있어 class로 정의할 수 있어요.
class UserData: ObservableObject { @Published var id: Int = 0 // 💫 @Published var name = "" // 💫 init() { setupData() } func setupData() { // request 할 필요가 있으면 여기에서 실행 id = 001 name = "unnnyong" } }
– UserData 라는 ObservableObject 를 정의해보았어요.
– @Published property 가 눈에 띄죠 ?
– property wrapper 로 정의되어 있고, 값이 변경될 때마다 구독자들에게 업데이트를 알려주는 친구예요.
– https://developer.apple.com/documentation/combine/published
struct ContentView: View { @ObservedObject var userData = UserData() // 💫 var body: some View { VStack(spacing: 10.0) { Text("ID: \(userData.id)") TextField("USER NAME", text: $userData.name) } } }
– UserData 에서 정의한 @ObservableObject 는 View에서 이렇게 사용된답니다.
– $ 의 사용은 @State property 와 같아요 !
ObservableObject 으로 정의하면 여러가지 View에서 @ObservedObject property로 만들어서 상태를 지속적으로 업데이트하는 값에 대해 사용할 수 있네요.
앱 내에서 UserData는 하나뿐인데 그때마다 초기화 시킬 수도 없고,
하나의 ObservableObject를 여러 View에서 static 으로 사용하기 위해서는 어떻게 해야할까요? 🤔
👇
Environment Object
여러 View 가 동시에 같은 property 에 접근할 때 사용해요.
@EnvirionmentObject var userData: UserData
// UserData.swift class UserData: ObservableObject { @Published var id: Int = 0 @Published var name = "" static let shared = UserData() // 💫 init() { setupData() } func setupData() { // request 할 필요가 있으면 여기에서 실행 id = 001 name = "unnnyong" } } // ContentView.swift struct ContentView: View { @EnvironmentObject var userData: UserData // 💫 var body: some View { VStack(spacing: 10.0) { Text("ID: \(userData.id)") TextField("USER NAME", text: $userData.name) } } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() .environmentObject(UserData.shared) // 💫 } }
[…] 저는 EnvirionmentObject 를 활용해보았어요.EnvirionmentObject 에 대해 궁금하신 분들은 👉SwiftUI | @State, @Binding, @ObservedObject […]
좋아요좋아요