OnboardingKit

OnboardingKitDemo.mp4

Description

OnboardingKit is a SwiftUI library that provides an Apple-like app onboarding experience.

Features

• ✅ Swift 6.0 Compatible - Built for the latest Swift standards
• 🌍 Multi-language Support - 10 languages included out of the box
• ♿ Accessibility First - Full Dynamic Type support and accessibility features
• 🎨 Highly Customizable - Flexible configuration options
• 📱 Cross-platform - iOS and macOS support
• 🔄 Modern SwiftUI - Uses latest SwiftUI APIs and patterns
• 💾 Automatic State Management - Built-in AppStorage integration
• 🌗 Light and Dark Mode - Fully supports both light and dark appearance

Table of Contents

• Requirements
• Installation
• Supported Languages
• Usage
  • Basic Setup
  • Advanced Usage
• Configuration Options
• Contributing
• License
• Author

Requirements

• iOS: 18.0 or later
• macOS: 15.0 or later
• Swift: 6.0 or later

Installation

You can install OnboardingKit using the Swift Package Manager.

1. In Xcode, select "File" > "Add Package Dependencies"
2. Copy & paste the following into the "Search or Enter Package URL" search bar: https://github.com/JamesSedlacek/OnboardingKit.git
3. Xcode will fetch the repository & the "OnboardingKit" library will be added to your project

Supported Languages

OnboardingKit includes localization for the following languages:

• English (en)
• German (de)
• Spanish (es)
• French (fr)
• Italian (it)
• Japanese (ja)
• Korean (ko)
• Portuguese (pt)
• Russian (ru)
• Chinese Simplified (zh-Hans)

Usage

Basic Setup

1. Create your onboarding configuration:

import OnboardingKit
import SwiftUI

extension OnboardingConfiguration {
    static let production = OnboardingConfiguration(
        accentColor: .blue,
        appDisplayName: "My Amazing App",
        features: [
            FeatureInfo(
                image: Image(systemName: "star.fill"),
                title: "Amazing Features",
                content: "Discover powerful tools that make your life easier."
            ),
            FeatureInfo(
                image: Image(systemName: "shield.fill"),
                title: "Privacy First",
                content: "Your data stays private and secure on your device."
            ),
            FeatureInfo(
                image: Image(systemName: "bolt.fill"),
                title: "Lightning Fast",
                content: "Optimized performance for the best user experience."
            )
        ],
        titleSectionAlignment: .center
    )
}

2. Add onboarding to your app's root view:

import OnboardingKit
import SwiftUI

@main
struct MyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
                .showOnboardingIfNeeded(
                    config: .production,
                    appIcon: Image("AppIcon"),
                    dataPrivacyContent: {
                        PrivacyPolicyView()
                    }
                )
        }
    }
}

Advanced Usage

Custom Continue Action

You can provide a custom action to perform when the user taps "Continue":

ContentView()
    .showOnboardingIfNeeded(
        config: .production,
        appIcon: Image("AppIcon"),
        continueAction: {
            // Perform analytics, API calls, etc.
            Analytics.track("onboarding_completed")
            // Note: Onboarding completion is handled automatically
        },
        dataPrivacyContent: {
            PrivacyPolicyView()
        }
    )

Custom Storage

Use a custom AppStorage key for tracking onboarding state:

@AppStorage("myCustomOnboardingKey") private var customOnboardingState = false

ContentView()
    .showOnboardingIfNeeded(
        storage: $customOnboardingState,
        config: .production,
        appIcon: Image("AppIcon"),
        dataPrivacyContent: {
            PrivacyPolicyView()
        }
    )

Manual State Management

Access the convenient AppStorage extension for manual control:

import OnboardingKit

struct SettingsView: View {
    @AppStorage(.onboardingKey) private var isOnboardingCompleted = false
    
    var body: some View {
        VStack {
            Button("Reset Onboarding") {
                isOnboardingCompleted = false
            }
        }
    }
}

Presenting Onboarding as a Modal Sheet

Present onboarding as a sheet above your main content, instead of replacing the root view:

import OnboardingKit
import SwiftUI

@main
struct MyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
                .presentOnboardingIfNeeded(
                    config: .production,
                    appIcon: Image("AppIcon"),
                    dataPrivacyContent: {
                        PrivacyPolicyView()
                    }
                )
        }
    }
}

Multi-Screen Onboarding Flows

Need more than a single welcome screen? Both modifiers support a custom flow once the initial onboarding is completed, allowing you to show setup, permissions, or tutorials before marking onboarding as complete.

.showOnboardingIfNeeded(
    config: .production,
    appIcon: Image("AppIcon"),
    dataPrivacyContent: {
        PrivacyPolicyView()
    },
    flowContent: {
        CustomTutorialView(onFinish: { /* do something */ })
    }
)

Configuration Options

OnboardingConfiguration

• accentColor: Primary color used throughout the onboarding (default: .blue)
• appDisplayName: Your app's display name shown in the welcome section
• features: Array of FeatureInfo objects to showcase
• titleSectionAlignment: Horizontal alignment for the title (.leading, .center, .trailing)

FeatureInfo

• image: Icon representing the feature (typically SF Symbols)
• title: Brief, descriptive title
• content: Detailed description of the feature

Contributing

We welcome contributions! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.

License

OnboardingKit is available under the MIT license. See the LICENSE file for more info.

Author

James Sedlacek - Find me on X/Twitter or LinkedIn