상세의상세

개발환경

iOS 16.0 이상

목표

팁앱의 상세뷰 리스트를 클릭했을 때 나오는 상세뷰를 제작해봅시다.

사용

Button State Binding Circle ForEach

완성 화면

고민해봐요

Q : 상세화면의 페이지(사진참고)는 어떻게 구현해야할까요?

다음페이지로 넘어갈때마다 저 동그라미도 같이 넘어가요.

영상 중반 (09:00) 참고

코드 맛보기

• State + Binding

import SwiftUI

struct SwiftUIView: View {
    
    @State private var test = 1
    
    var body: some View {
        TestCodes(currentPage: $test)
    }
}

struct TestCodes : View {
    
    @Binding var currentPage : Int
    
    var body: some View {
        HStack {
            ForEach(1..<6) { index in
                VStack {
                    Circle()
                        .frame(width: 30, height: 30)
                        .foregroundColor(index == currentPage ? .black : .gray)
                        .onTapGesture {
                            print("Clicked \\(index) page.")
                            currentPage = index
                        }.cornerRadius(20)
                }
                
            }
        }
    }
}