본문 바로가기

난 iOS개발자/SwiftUI

[SwiftUI] @State

728x90

@State는 가변 데이터를 나타내는 속성 래퍼이다.

@State를 변수 앞에 배치하면 SwiftUI는 해당 속성을 추적하고 , 상태가 변경될 때 마다 새로운 작업(뷰를 다시 그리는)을 할 수 있다.

 

이를 통해 뷰는 사용자 상호작용으로 데이터 모델의 변경에 즉각적인 UI업데이트 흐름을 만들 수 있다.

 

@State var userTouchCount: Int

 

@State  속성 래퍼가 사용되는 뷰에서 값을 변경하려면, 해당 뷰 내부에서만 변경해야 한다. 

예를 들어 버튼이나 텍스트 필드를 통해 값을 변경하는 그런것이다. 

 

일반적으로 아래와 같이 사용한다.

 

struct ContentView: View {

    @State var myName: String = ""
    
    var body: some View {
        
        VStack() {
            Text("내 이름은 \(myName) 입니다.")
                .padding()
            
            HStack() {
                Spacer(minLength: 20)
                TextField("이름을 입력하세요.", text: $myName)
                Spacer(minLength: 20)
            }
        }
    }
}

@State가 붙은 myName은 변할 수 있는 값이다.

Text에는 myName을 삽입하여 "내 이름은 ~ 입니다." 를 출력한다.

그리고 아래 TextField에는 입력된 텍스트를 myName과 Binding해주고 있다. 

이때 myName으로 Binding하는것은 변수 이름앞에 "$"기호를 넣어야 가능하다.

 

이 코드의 동작은 아래와 같다.

728x90