Cross-promote apps with SKOverlay

SwiftUI UIKit WWDC20

In iOS 14, Apple has added a new way to apps cross-promotion with a new SKOverlay. It is similar to the one you see in the App Store.

SKOverlay look like the app bar you see in the App Store
SKOverlay look like the app bar you see in the App Store

UIKit #

SKOverlay is quite straightforward, you initialize it and call present method and passing UIWindowScene that you want the overlay to show over.

func displayOverlay() {
guard let scene = view.window?.windowScene else { return }

let config = SKOverlay.AppConfiguration(appIdentifier: "YOUR_APP_ID", position: .bottom)
let overlay = SKOverlay(configuration: config)
overlay.present(in: scene)
}

Users can dismiss the overlay by swipe down. If you want it to always stay there, you can set config.userDismissible = false to prevent dismissal.

func displayOverlay() {
guard let scene = view.window?.windowScene else { return }

let config = SKOverlay.AppConfiguration(appIdentifier: "YOUR_APP_ID", position: .bottom)
config.userDismissible = false
let overlay = SKOverlay(configuration: config)
overlay.present(in: scene)
}

SwiftUI #

SwiftUI also get native support for SKOverlay, with new .appStoreOverlay modifier.

import SwiftUI
import StoreKit

struct ContentView: View {
@State private var showOverlay = false

var body: some View {
Button("Show Overlay") {
showOverlay = true
}.appStoreOverlay(isPresented: $showOverlay) {
let config = SKOverlay.AppConfiguration(appIdentifier: "YOUR_APP_ID", position: .bottom)
config.userDismissible = false

return config
}
}
}

Behavior #

As far as I know, there are three states of the overlay.

Installed #

If the app is already installed, you will see an open action that will open the specified app. Tap anywhere other than the open button would bring you to the App Store detail page.

If the app already installed, you will see an open action
If the app already installed, you will see an open action

Installed with a pending update #

If the app is already installed and has a pending update, you will see an option to update it. Tap an update will begin an update within the current app without a need to redirect to the App Store.

You will see an option to update the app, if the app has a pending update
You will see an option to update the app, if the app has a pending update

No app installed #

If there is no specified app in the device, you will see an install action, and like an update action, you can install the app within your app without any redirection.

You can see an option to install an app if you don't have the app
You can see an option to install an app if you don't have the app
You can install an app directly within a current app
You can install an app directly within a current app

Error #

There is an error in Xcode 12 beta that prevents you from presenting the overlay if you use SwiftUI with the UIKit life cycle. You would get the following error when presenting.

Attempting to present an appStoreOverlay without being in the hierarchy.

Feel free to follow me on Twitter and ask your questions related to this post. Thanks for reading and see you next time.

If you enjoy this article, you can subscribe to the weekly newsletter.

Every Friday, you’ll get a quick recap of all articles and tips posted on this site — entirely for free.

← Home