SwiftUI 首次启动引导页示例代码、点击or滑动展示下一页

SwiftUI 首次启动引导页示例代码、点击or滑动展示下一页
Guide Launch 启动引导页示例

演示效果

示例代码

var body: some View {
        ZStack {
            TabView(selection: $selected) {
                ForEach(result.indices, id: \.self) { index in
                    launchPage(result[index])
                        .tag(index)
                }
            }
            .tabViewStyle(.page(indexDisplayMode: .never))
            .ignoresSafeArea()
            
            HStack(spacing: 6) {
                ForEach(0...2, id: \.self) { i in
                    Circle()
                        .fill(selected == i ? .black.opacity(0.6) : .gray.opacity(0.75))
                        .frame(width: 8)
                }
            }
            .offset(y: 360)
        }
    }
    
    @ViewBuilder
    func launchPage(_ item: [String : String]) -> some View {
        GeometryReader { proxy in
            VStack {
                Spacer()
                Image(item["icon"]!)
                    .resizable()
                    .frame(width: 240, height: 240)
                Text(item["title"]!)
                    .font(.title)
                    .padding(.bottom, 8)
                Text(item["subtitle"]!)
                    .font(.subheadline)
                    .padding(.horizontal, 32)
                    .multilineTextAlignment(.center)
                
                Spacer()
                
                Button {
                    withAnimation {
                        var newIndex = selected + 1
                        if (newIndex == result.count) {
                            newIndex = 0
                        }
                        self.selected = newIndex
                    }
                } label: {
                    Rectangle()
                        .fill(Color(item["buttonColor"]!))
                        .overlay {
                            Text(item["buttonLabel"]!)
                                .font(.title3)
                                .fontWeight(.medium)
                                .foregroundColor(.white)
                        }
                        .frame(height: 48)
                        .cornerRadius(10)
                    
                }
                .padding()
                
                Spacer()
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
        .background(Color(red:0.97, green:0.97, blue:0.97))
    }

源码下载

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

(1)
上一篇 2023-03-11 下午4:36
下一篇 2023-03-15 上午11:41

相关推荐

发表回复

登录后才能评论