zl程序教程

您现在的位置是:首页 >  工具

当前栏目

SwiftUI 实战源码之Page左右分页FlashCard

源码 实战 SwiftUI Page
2023-09-11 14:18:29 时间

左右切换页面是app中最常用的组件,在SwiftUI中该如何制作分页效果呢?

本文价值与收获

看完本文后,您将能够作出下面的界面

Jietu20200303-125904.gif

Jietu20200303-131500.gif

看完本文您将掌握的技能

  • Scrollview高级用法,实现分页滚动
  • 封装UIPageViewController

实战

方案一: ScrollView实现

1、 定义个页面

struct Page: View, Identifiable {
    let id = UUID()

    var body: some View {
        VStack(spacing: 0) {
            Text("Page")
        }
        .frame(width: 414, height: 300, alignment: .leading)
        .background(getRandomColor())
    }
}

2、制作分页视图


struct SwiftUIPagerVie