How can we add a launch screen to a watch app? - swiftui

Question

I am creating a watchOS app using SwiftUI and I wish to add a splash screen, but I am not sure whether it's possible. I have added the following to the Info.plist file, but doesn't seem to show a splash screen.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>UILaunchScreen</key>
<dict>
<key>UIImageName</key>
<string>Rupee</string>
</dict>
<key>CFBundleDevelopmentRegion</key>
<string>$(DEVELOPMENT_LANGUAGE)</string>
<key>CFBundleDisplayName</key>
<string>Sample</string>
<key>CFBundleExecutable</key>
<string>$(EXECUTABLE_NAME)</string>
<key>CFBundleIdentifier</key>
<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>CFBundleName</key>
<string>$(PRODUCT_NAME)</string>
<key>CFBundlePackageType</key>
<string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
<key>CFBundleShortVersionString</key>
<string>1.0</string>
<key>CFBundleVersion</key>
<string>1</string>
<key>CLKComplicationPrincipalClass</key>
<string>$(PRODUCT_MODULE_NAME).ComplicationController</string>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSExceptionDomains</key>
<dict>
<key>google.com</key>
<dict>
<key>NSExceptionAllowsInsecureHTTPLoads</key>
<true/>
<key>NSIncludesSubdomains</key>
<true/>
</dict>
</dict>
</dict>
<key>NSExtension</key>
<dict>
<key>NSExtensionAttributes</key>
<dict>
<key>WKAppBundleIdentifier</key>
<string>Sample</string>
</dict>
<key>NSExtensionPointIdentifier</key>
<string>Sample</string>
</dict>
<key>WKWatchOnly</key>
<true/>
</dict>
</plist>

Answer 1

Unfortunately (as of September 2021), WatchOS does not support a Launch Screen yet. I don't know if you noticed yet, but when an app launches on the watch, the app icon shows up with a progress view around it which is the default WatchOS launch screen for the apps and cannot be changed.
For more info: Could we set Launch screen in apple watch?

Answer 2

For a fake launch screen, you can do something like this:
#State var shouldShowLaunchImage = true
var body: some View {
ContentView()
.overlay(
Image("launch-image")
.opacity(shouldShowLaunchImage ? 1 : 0)
)
.onAppear {
DispatchQueue.main.asyncAfter(deadline: .now() + 3) {
self.shouldShowLaunchImage = false
}
}
}