어서와 @State는 처음이지?

 

SwiftUI는 기본적으로 Struct 에서 VIew 프로토콜을 채택해서 만들어 집니다. 

 

속성을 만들고 버튼을 눌렀을때 속성을 변경하려고 하면 오류가 발생합니다. 왜 그럴까요?

속성을 추가 했을때 오류 발생

오류 코드를 해석해보면 속성으로 되어있는 number를 수정 할 수 없다고 나옵니다. 그렇다면 swift 문법에서 mutating을 붙이면 된다고 하는데 body에 mutating을 붙이면 될까요?  그렇게 붙여도 오류가 발생합니다.

 

채택된 View 프로토콜을 보면

body는 { get } 으로 설정됨

@ViewBuilder와 @MainActor는 추후 다루는 걸로 하고 body를 보면 get ( 읽기만 가능 ) 으로 설정이 되어 있습니다. 그렇다면 속성 값을 바꾸기 위해서 어떻게 해야 할까요 ? 

 

이때 나온것이 @State 입니다. 

var number 앞에 @State 설정

그렇다면 @State는 어떤 역할을 하는 걸까요? 

공식문서 @State

공식문서에 보면 SwiftUI에서 관리하는 값을 읽고 쓸 수 있는 속성 래퍼 유형이라고 나옵니다.

엥? 뭔가 감이 잡힐듯 말듯 하면서 안잡히시죠?  쉽게 설명드려 변화하는 값을 쓸 때는 변수 앞에 @State를 붙인다 입니다.

 

공식문서를 보면 중요한 점이 있습니다.

@State 문서 번역

1. SwiftUI는 값에 의존하는 보기 계층 구조의 일부를 업데이트

2. 단일 소스로 상태를 사용

3. 그 자체로 값이 아닌, 값을 읽고 쓰는 수단! --> 참조하여 상태 속성을 일고 업데이트 할수 있음 

 

즉, @State는 값이 변경되면 기존의 상태를 무효화하고 다시 값을 계산 --> 변수값이 변경되면 view를 다시 랜더링하기 때문에 최신 값을 가짐 

 

import SwiftUI

struct ContentView: View {
    @State var number: Int = 0
    var body: some View {
        VStack {
            Text("\(number)")
            Button {
                number += 1
            } label: {
                Text("+1씩 추가 하기 ")
            }
            Button {
                number = 0
            } label: {
                Text("리셋")
            }


        }
    }
}

 

값이 변경될때 마다 랜더링 되어 최신 값을 갖는다.

SwiftUI를 통해 뷰를 만들다보면 @State를 어떻게 설정하는지에 따라서 여러방면으로 활용할 수 있습니다. 기초적인 개념을 잡고 가시면 많은 도움이 될 거 같습니다. 

 

다시 한번 정리하자면 

• 상태 변화를 타나내는 변수
•  뷰 안에서만 사용하기 때문에 private로 선언 
• 하위 뷰나 다른 뷰에서 참조하기 위해선 @Binding 해야함
• @State로 선언한 변수의 값이 바뀌면 view는 다시 랜더링 함
• 뷰 전체가 다시 랜더링 되는 일을 막기 위해 하위뷰로 Binding 해준다. 

 

https://huniroom.tistory.com/entry/SwiftUI-state-property

[SwiftUI] state property 정리 (@state, @Binding)

https://velog.io/@nnnyeong/iOS-SwiftUI-State-Binding

[iOS] SwiftUI - @State, @Binding

https://value-of-life.tistory.com/160

SwiftUI - @State와 @Binding 알아보기

https://developer.apple.com/documentation/swiftui/state/

Apple Developer Documentation