Wesley de Groot's Blog
Deep linking in SwiftUI

Back

Deep linking is a powerful feature that allows users to navigate directly to specific content within your app using URLs. In SwiftUI, implementing deep linking can enhance user experience by providing seamless navigation and quick access to desired content. This blog post will guide you through the process of setting up deep linking in your SwiftUI application.

What is Deep Linking?

Deep linking involves using URLs to link directly to specific pages or content within a mobile application. This can be particularly useful for marketing campaigns, notifications, or any scenario where you want to direct users to a specific part of your app.

Setting Up Deep Linking in SwiftUI

  1. Define URL Schemes:
    To start, you need to define URL schemes in your app's Info.plist file. This allows your app to recognize and handle specific URL patterns.

    <key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>demoApp</string>
            </array>
            <key>CFBundleURLName</key>
            <string>nl.wesleydegroot.example</string>
        </dict>
    </array>
  2. Handle Incoming URLs:
    Next, you need to handle incoming URLs in your SwiftUI app. This can be done by implementing the onOpenURL modifier, which allows you to respond to URL events.

    @main
    struct demoApp: App {
        @StateObject
        private var router = Router()
    
        var body: some Scene {
            WindowGroup {
                ContentView()
                    .environmentObject(router)
                    .onOpenURL { url in
                        router.handleDeepLink(url: url)
                    }
            }
        }
    }
  3. Routing Logic:
    Create a router class to manage navigation based on the incoming URL.

    class Router: ObservableObject {
        @Published
        var currentView: String?
    
        func handleDeepLink(url: URL) {
            guard let host = url.host else { return }
            switch host {
            case "home":
                currentView = "home"
            case "profile":
                currentView = "profile"
            default:
                break
            }
        }
    }
  4. Navigating to Views:
    Use the currentView property to navigate to the appropriate view in your SwiftUI app.

    struct ContentView: View {
        @EnvironmentObject
        var router: Router
    
        var body: some View {
            VStack {
                if router.currentView == "home" {
                    HomeView()
                } else if router.currentView == "profile" {
                    ProfileView()
                } else {
                    DefaultView()
                }
            }
        }
    }

Benefits of Deep Linking

  • Improved User Experience: Users can access specific content directly, reducing the number of steps needed to find what they are looking for.
  • Enhanced Engagement: Deep links can be used in marketing campaigns to drive users to specific promotions or content.
  • Seamless Navigation: Users can resume their activity from where they left off, even if they are returning to the app after a long time.

Deep linking via a notification

Deep linking can also be used in combination with notifications to direct users to specific content within your app. When a user taps on a notification, they can be taken directly to the relevant page or screen.

let content = UNMutableNotificationContent()
    content.title = String(localized: "Your profile is 50% complete")
    content.body = String(localized: "Click here to complete your profile")
    content.userInfo = ["url": "demoApp://profile"]

let request = UNNotificationRequest(
    identifier: "DemoApp-ProfileSetupNotification", 
    content: content,
    trigger: UNTimeIntervalNotificationTrigger(
        timeInterval: 3600,
        repeats: false
    )
)

UNUserNotificationCenter.current().add(request)

Conclusion

Implementing deep linking in SwiftUI can significantly enhance the usability and engagement of your app. By following the steps outlined above, you can set up deep linking to provide a more intuitive and efficient user experience. Happy coding!

Read more

Share


Share Mastodon Twitter LinkedIn Facebook
x-twitter mastodon github linkedin discord threads instagram whatsapp bluesky square-rss sitemap