Product Tour
From syxUI — written for both platforms, not translated between them.
A tour card with numbered steps.
Feedback · SwiftUI · iOS 17
- feedback
- swiftui
The actual source
TourSteps.swift
// Product Tour · syxUI · https://syxui.dev/components/tip-tour
// Free in any project. Keep this line and credit syxUI where a person can read it.
import SwiftUI
struct TourSteps: View { var body: some View { VStack(spacing: 14) { Text("How to add a Link").font(.system(size: 17, weight: .bold)); HStack(spacing: 10) { ForEach(0..<4, id: \.self) { i in Text("\(i + 1)").font(.system(size: 14, weight: .bold)).foregroundStyle(i == 0 ? .white : .secondary).frame(width: 30, height: 30).background(i == 0 ? Color.primary : Color.primary.opacity(0.08), in: Circle()) } }; Text("Tap the sticker button").font(.system(size: 15)).foregroundStyle(.secondary); Text("Next Step").font(.system(size: 16, weight: .semibold)).foregroundStyle(.white).frame(width: 200).padding(.vertical, 13).background(Color.primary, in: Capsule()) }.padding(18).frame(width: 280).background(Color(.systemBackground), in: RoundedRectangle(cornerRadius: 20, style: .continuous)).shadow(color: .black.opacity(0.1), radius: 16, y: 6) } }
iOS 17 · No dependencies
Dependencies
- SwiftUI
- No external dependencies
Requires iOS 17
