TabView の tabViewStyle に PageTabViewStyle を指定すると、左右のスワイプでページを切り替えられるようになります。
以下は全5ページ中、初期表示を2ページ目にセットした例です。
struct RootView: View {
@State var disappearNum: Int = 0
@State var selection: Int = 2
var body: some View {
TabView(selection: $selection) {
ForEach(1..<6, id: \.self) {i in
PageView(num: i, disappearNum: $disappearNum).tag(i)
}
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
.onChange(of: selection) { _ in
print("\(selection)ページ目に移行している途中です")
}
.onChange(of: disappearNum) { _ in
print("\(selection)ページ目です")
}
}
}
struct PageView: View {
let num: Int
@Binding var disappearNum: Int
var body: some View {
Text("\(num) ページ目")
.onDisappear {
disappearNum = num
}
}
}
ぺージが切り替わったことを検知するためにonChange
を利用しています。selection
はスワイプの途中で呼ばれ、disappearNum
はスワイプが完全に終わったタイミングで呼び出されます。