[SwiftUI Bootcamp] beginner9

Woozoo·2023년 1월 17일

[SwiftUI]

목록 보기

9/26

Picker()

태그는 어떤 값이 선택될지임! 말 그대로 '어떤 값'이 선택될 것인지 태그해서 구분해주는 거

이렇게 설정한다고 할 때 지금처럼 반복이 되는 Text, tag는 ForEach로 처리할 경우에 더 간결해진다

ForEach안에 반복할 내용을 넣고 반복되는 대상이 되는 값을 클로져로 전달해준다

아쉽게도 피커뷰는 커스텀이 어려움

커스텀 가능한 범위는 이 정도.
foreach로 반복되는 부분의 텍스트를 변경하거나 background 칼라 정도가 되겠다

근데 label이 쓸모가 없는 거 같음
예전에는 pickerStyle이 menu로 되어 있으면 어던 값을 변경하고 있는지 label을 통해서 확인이 가능했는데 지금은 안 뜬다

segmented 스타일 같은 경우엔 init될 때 UISegmentedControl에 접근해서 커스텀이 가능함
한 가지 주의할 점은 이렇게 될 경우엔 앱에 존재하는 모든 segmented가 지금과 같은 모양이 됨
overrride 하기 때문에

ColorPicker

생각보다 금방 구현 가능
__

DatePicker

datePicker도 금방 구현 가능
DatePicker로 만들고 Date만 바인딩해주면 된다

displayedComponenets를 이용해서 어떤 걸 보여줄건지 선택도 가능함.
근데 이건 .date 랑 .hourAndMinute말곤 안보이네

이렇게 선택 가능한 날짜를 지정해주는 것도 가능하다

date formatter를 이용해서 날짜 표시형식 바꾸는 것도 가능

Stepper

struct StepperBootcamp: View {
    @State var stepperValue: Int = 10
    var body: some View {
        Stepper("Stepper: \(stepperValue)", value: $stepperValue)
            .padding(50)
    }
}

이렇게 value에 값이 변경될 값을 바인딩해주면 됨

스테퍼를 눌렀을 때 끊겨서 보인다면 이렇게 함수를 따로 빼서
withAnimation으로 애니메이션 효과도 가능함

Slider

슬라이더 역시 마찬가지로 value에 변하게 될 값을 넣어주면 되고, in을 통해서 범위를 지정하고, step을 통해서 변하는 범위의 단계를 지정해줄 수 있음
그리고 onEditingChanged를 통해서 값이 변하게 될 때 원하는 로직을 실행하는 것도 가능!

TabView() & PageTabViewStyle()

탭뷰를 넣어주고, 넣고싶은 뷰들에 .tabItem을 추가해주면 됨
그럼 탭뷰가 다른 뷰를 인식해서 버튼들을 만들어준다

TabView의 selection프로퍼티를 이용해서 어떤 탭이 선택되었는지 알 수도 있음
.tag값을 주고 selection에 바인딩된 Int를 넘겨주면 된다

struct TabViewBootcamp: View {
    
    @State var selectedTab: Int = 2
    
    var body: some View {
        TabView(selection: $selectedTab) {
            HomeView(selectedTab: $selectedTab)
                .tabItem { Label("Home", systemImage: "house.fill") }
                .tag(0)
            Text("Browse Tab")
                .tabItem {
                    Label("Browse", systemImage: "globe")
                }.tag(1)
            Text("Profile Tab")
                .tabItem {
                    Label("Profile", systemImage: "person.fill")
                }.tag(2)
        }
        .tint(.green)
    }
}

struct HomeView: View {
    @Binding var selectedTab: Int
    var body: some View {
        ZStack {
            Color.blue.ignoresSafeArea()
            VStack {
                Text("Home Tab")
                    .font(.largeTitle)
                    .foregroundColor(.white)                
                Button {
                    selectedTab = 2
                } label: {
                    Text("Go to profile")
                        .font(.headline)
                        .padding()
                        .padding(.horizontal)
                        .background(.white)
                }
            }
        }
    }
}