[swift] 사용자 정의 뷰에 상태 및 속성 추가하기

14 Dec 2023

swift

Swift로 사용자 정의 뷰를 만들 때, 상태 및 속성을 추가하여 동적으로 변하는 요소를 표현할 수 있습니다. 이를 위해 @State 및 @Binding 등의 속성 래퍼를 사용하여 여러 가지 특성을 구현할 수 있습니다. 사용자 정의 뷰에 상태 및 속성을 추가하는 방법을 알아보겠습니다.

@State 속성 래퍼

@State 래퍼는 뷰 내에서 관리되는 상태를 나타냅니다. 상태가 변경될 때마다 해당 뷰가 자동으로 다시 렌더링됩니다. 예를 들어, 버튼을 토글하거나 입력 필드에서 텍스트를 수정하는 등의 상황에서 사용됩니다.

다음은 간단한 예제 코드입니다.

import SwiftUI

struct CustomView: View {
    @State private var isToggled: Bool = false
    
    var body: some View {
        Button(action: {
            self.isToggled.toggle()
        }) {
            Text(self.isToggled ? "ON" : "OFF")
        }
    }
}

위 코드에서 @State 래퍼를 사용하여 isToggled 속성을 선언하고, Button의 액션에서 해당 속성을 토글합니다. 속성이 변경될 때마다 버튼의 레이블이 변경되는 것을 확인할 수 있습니다.

@Binding 속성 래퍼

@Binding 래퍼는 하위 뷰가 상위 뷰의 상태를 수정할 수 있도록 합니다. 상위 뷰에서 하위 뷰에 속성을 전달하고, 하위 뷰에서 해당 속성을 수정할 때 사용됩니다.

다음은 간단한 예제 코드입니다.

import SwiftUI

struct ParentView: View {
    @State private var value: Int = 0
    
    var body: some View {
        ChildView(value: $value)
    }
}

struct ChildView: View {
    @Binding var value: Int
    
    var body: some View {
        Button(action: {
            self.value += 1
        }) {
            Text("Increase Value")
        }
    }
}

위 코드에서 @Binding 래퍼를 사용하여 value 속성을 선언하고, ParentView에서 ChildView로 전달하였습니다. ChildView의 버튼을 탭할 때마다 value가 증가하는 것을 확인할 수 있습니다.

사용자 정의 뷰에 @State 및 @Binding 등의 속성 래퍼를 사용하여 상태 및 속성을 추가할 수 있습니다. 필요에 따라 여러 가지 속성 래퍼를 조합하여 동적으로 변하는 요소를 표현할 수 있습니다.

참고 자료

SwiftUI Tutorials and Documentation