개발환경
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)
}
}
}
}
}