본문 바로가기

프로그래밍/SwiftUI

Picker 사용시 주의점: data type

Swift 5

Xcode 12.2

iOS14.2

 

Picker는 이름 그대로 데이터를 선택하는 방법을 제공 View이다. 아래 간단한 Picker 예제를 살펴보자.

 

import SwiftUI

struct PickerExView: View {
    let colors: [Color] = [.red, .orange, .yellow, .green, .blue, .purple]
    let colornames = ["Red", "Orange", "Yellow", "Green", "Blue", "Purple"]
    
    @State var selectedColorIndex: Int = 0
    
    var body: some View {
        
        VStack {
            Picker("Color", selection: $selectedColorIndex) {
                ForEach(0..<colornames.count) {
                    Text(colornames[$0])
                        .foregroundColor(colors[$0])
                }
            }
            
            Text("Selected Color: \(colornames[selectedColorIndex])")
        }
        .padding()
    }
}

 

Picker에서 띄어준 데이터 목록 중 하나를 선택하면 Text에서 출력하는 예제이다. 코드 상 어려움은 없으며, 구동도 잘 된다. 

 

 

아래 SwiftUI의 선언부를 살펴보면 Picker는 selection, label, content를 파라미터로 가지며, 그중에서 selection의 data type은 Binding<>이기 때문에 앞선 코드에서 selectedColorIndex를 Int로 선언해주었다. 

 

SwiftUI의 Picker

 

그런데 이 selectedColorIndex를 아래와 같이 Int가 아닌 Int16로 변경하고(아래 Text 출력 부분에 Array에 접근하는 Index는 Int여야 하므로 Casting 시켜 줬다) 실행시켜보면,

 

import SwiftUI

struct PickerExView: View {
    let colors: [Color] = [.red, .orange, .yellow, .green, .blue, .purple]
    var colornames = ["Red", "Orange", "Yellow", "Green", "Blue", "Purple"]
    
    @State var selectedColorIndex: Int16 = 0                // Data Type 변경
    
    var body: some View {
        
        VStack {
            Picker("Color", selection: $selectedColorIndex) {
                ForEach(0..<colornames.count) {
                    Text(colornames[$0])
                        .foregroundColor(colors[$0])
                }
            }
            
            Text("Selected Color: \(colornames[Int(selectedColorIndex)])")   // Data Type Casting
        }
        .padding()
    }
}

 

다음과 같이 Text View에서 업데이트를 못하는 것을 확인할 수 있다. 

 

 

Picker에 사용되는 SelectionValue는 Binding<Int>를 사용해야 하는 것 같다. (Apple Devaloper Documentation을 살펴보았지만, SelectionValue에 대한 명확한 Data Type이 나오질 않아서 확신하기가 좀 애매하다. 이러한 정보들은 어디서 어떻게 찾아야 하는 건지..)

 

위 예제에서 처럼 SelectionValue에 Binding<Int16>의 데이터를 사용하여 Picker의 동작을 한참 고민하는 일이 다시는 없었으면 한다. 간혹 가다 Index를 Int가 아닌 다른 Data Type으로 선언해야 하는 경우가 있는데, 이런 경우에는, Binding<Int>에 해당하는 SelectionValue를 넣고 선택된 Int형을 내가 원하는 Data Type으로 변경해 줘야 한다.