SwiftUI 实现App启动引导提示页示例

本篇内容为常见的首次打开APP时的提示引导页,通过下一步按钮切换展示不同引导页面最终打开主页面。


示例效果如下

SwiftUI 开发App启动引导提示页效果

实现代码示例

import SwiftUI

struct GuideView: View {
    
    @State var currentStep = 0
    @State var isFinished = false
    var body: some View {
        ZStack {
            if isFinished {
                HomeView()
                    .transition(.move(edge: .trailing))
            } else {
                VStack {
                    ProgressView(steps: guideSteps.count, currentStep: $currentStep)
                    Spacer()
                    GuideDescView(guideSteps: guideSteps, currentStep: currentStep)
                    Spacer()
                }
                .padding()
                NextButton(currentStep: $currentStep, color: guideSteps[currentStep].color) {
                    if currentStep < guideSteps.count - 1 {
                        currentStep += 1
                    } else {
                        
                        withAnimation(.linear) {
                            isFinished.toggle()
                        }
                    }
                }
            }
            
        }
    }
}

#Preview {
    GuideView()
}

完整代码下载

SwiftUI 实现App启动引导提示页示例

SwiftUI 提示引导页面示例

赞助会员赞助会员¥免费
资源价格 ¥3.00 销售数量 0 更新时间 2024-10-06
已付费?登录刷新

  本文自 https://www.codeun.com 发布,相应代码均自主编写并严格审阅和测试,完整代码中包含丰富的学习笔记和使用方式、实用技巧。
  · 如若转载,请注明出处:https://www.codeun.com/archives/1313.html ·

(0)
上一篇 2024-10-05
下一篇 2024-10-07

相关推荐

发表回复

登录后才能评论