Swift PiecesPro
  • Library
    Screens48Finished, designed screens for real apps.Templates10Complete apps built from the screens.Build Kit24Styles, briefs and recipes for your coding agentEverything58The whole library, with search
  • Docs
  • Pro

Library

  • Screens48
  • Templates10
  • Build Kit24
  • Everything58
  • Docs
  • Pro
  • Account
Get Swift Pieces ProFree library ↗
Swift PiecesPro

Production-ready SwiftUI screens and app templates for iOS. The pieces to build the whole app.

Library

  • Screens
  • Templates
  • Build Kit
  • Everything

Product

  • Pro
  • Your account
  • Sign in

Resources

  • Docs
  • CLI
  • MCP and agents
  • Free library

Social

  • X / Twitter
  • GitHub

SWIFTPIECES PRO

© 2026 Swift Pieces. One payment, lifetime access, per-developer commercial license.

Curated withby Saivion

LibraryScreensOnboarding

Screen · Onboarding

Onboarding

First run end to end: welcome pages, a permission step and a trial offer, then into the app.

A complete first run on one screen: onboarding pages, a fully configurable permission step and an optional paywall handoff, joined by shared-axis pushes with an injectable completion key so it runs once.

SwiftUIiOS 17.0+onboarding-flow

Get Swift Pieces Pro

$199 once, every piece included. See how installing works · Sign in

01

What's included

SwiftUI source you own, built on Apple frameworks only.

  • Welcome, permission and paywall steps joined by shared-axis pushes
  • A fully configurable PermissionStep, or none
  • An optional paywall handoff
  • A completion key so it runs once
  • A .poster layout that carries the Welcome posters through every step

Includes

Welcome. Installed together, automatically.

In the Build Kit

Editorial (style), Subscription Utility (brief), Onboarding to Paywall (recipe). Your agent builds around this screen in the same design.

Used in

Subscription App (template), Meditation App (template), Travel App (template)

02

Implementation notes

How it behaves, what it handles, and the decisions behind it.

Composes OnboardingStack, a permission step and an optional paywall, moving between them with shared-axis pushes. The permission step is a private sheet with an icon tile, benefit rows and requesting, granted and denied states; a denial swaps the copy and offers Open Settings. Every string comes from PermissionStep, and PermissionStep.notifications(...) wires UNUserNotificationCenter for you while still taking your copy. Completion is stored in AppStorage under an injectable completionKey.

Notes

  • The paywall slot hands you a finish closure: paywall: { done in GlassPaywallScreen(productIDs: ids, features: f, onUnlocked: done, onDismiss: done) }.
  • Pass permission: nil to skip the permission step; use the Paywall == EmptyView initializer to skip the paywall.
  • Reduce Motion replaces the pushes with crossfades. Haptics: .success on grant, .warning on denial.
  • layout: .poster carries the Welcome posters through the flow: the permission step becomes a poster with a large badge and benefits on overlapping color rows, and steps slide side by side as whole screens, so no frame shows two steps over each other. .fullBleed (the default) keeps the shared-axis cross-fade.
  • OnboardingPoster is public, so a paywall step can match the posters (the example's trial offer does).
  • OnboardingFlowScreenScreenExample at the end of OnboardingFlowScreen.swift is the Onboarding screen from the preview; OnboardingFlowScreenExample below it is the full-bleed version the Subscription template uses.

Theming

  • Reads SPTheme from @Environment(\.spTheme) and needs the design-system item; one .environment(\.spTheme, YourTheme()) re-skins every step.
  • The screen paints theme.color.bg behind all steps. The benefits card sits on .spSurface(.e1, in:), and the icon tile and primary buttons use accent with an accentOn label.
  • Titles use theme.type.display, so a theme's display font (for example the serif in PaperTheme) carries through the pages and the permission step.
  • Your paywall view gets the same environment, so a themed paywall matches without extra wiring.

03

Keep building

Pieces that work well next to this one.

Screen · Commerce

Purchase

A complete StoreKit 2 purchase: plans load, the purchase runs, success lands, the app unlocks.

Screen · Onboarding

Welcome

First-run pages as color posters with arch windows, where parallax and progress follow your finger.

Screen · Account

Verify

A sign-in verification screen with springing digits, SMS autofill and a shake on a wrong code.