How to add an app Icon and “launch screen” image in tvOS App ( Apple Tv App )?
Every app needs a beautiful and memorable icon that attracts attention. The app icon is a critical component of any app since it’s always exposed to users. And adding an app icon in tvOS apps is not an easy task because we don't have proper documentation of it.
NItesh Soni , 06 January, 2021
To add an app icon and launch screen image for your apple tv app you need some different size images for the App icon , launch screen and Top shelf.
Step 1: Generate tvOS App assets for icon and launch screen -
Install Asset Catalog Creator Application from App store to Generates Icons for Any Apple Asset Type
Now open the App and you can see the screen like below image
You need to generate following assets:
Top shelf wide Assets for your app.
Now drop an image and select App Icon in the tvOS section then create an asset catalog. It will create images.xcassets folder which contains an App icon.
Do the same process to generate Launch screen, Top shelf, Top shelf Wide assets.
Now your images.xcassets folder contain all required images.
Here, Following icons will be used to generate their respective images
App icon will generate tvOS App icon size images
Launch screen Icon will generate image for launch screen
Top shelf and Top shelf wide image will be use as a Top image behind the app icon ( when app is in close state )
Step 2: Create BrandAsset Folder -
Open your project in xcode and select your tvOS file.
Go to the Signing & capabilities section -> App Icon and click on the arrow next to "App Icons Source" then click on your "Images.xcassets" file which should be already there and delete the "BrandAsset" folder.
Making sure no folders are selected in your asset catalog, press the + button and select "App Icons & Launch Images > New tvOS App Icon and Top Shelf Image". This will create a new "Brand Assets" folder containing your App Icon and Top Shelf image wells.
Again press the + button and select "App Icons & Launch Images > New tvOS Launch Image". This will create a new "Launch image" file for launch screen image ( See in below image)
Rename the "Brand Assets" folder to whatever name makes sense. it really doesn't matter what you call it.
Step 3: Add App Icon to your TV app
Now upload images according to required size ( as shown in above image ).
Go to images.xcassets -> App Icon -> App icon-App Store.imagestack -> image-name -> content.imageset folder and here you get your 1280x786 px size image which you need to upload in Front and middle and back sections in “App Icon - App Store”
2. App Icon ( 400x240 px size image)
Go to images.xcassets -> App icon - App Icon-.imagestack -> image-name -> content.imageset here you will see two images ( 1x and 2x) . upload these images to front, middle and back images sections in “App Icon”
3. Top shelf Images ( when focus on your App this image will display in app background)
Go to images.xcassets -> App icon -> top shelf image wide.imageset folder here you can see two images ( 1x and 2x) . upload these images to top shelf image wide section
Go to images.xcassets -> App icon -> top shelf image.imageset folderhere you can see two images ( 1x and 2x) . upload these images to the top shelf image section.
Step 4: Add Launch Screen Image -
Click on LaunchImage File in xcode ( which you have created previously )
Goto images.xcassets -> App icon -> LaunchImage.launchimage folder. Here you can see both images which you need in the Launch image section. Upload these images there.
Now you can clean the build by clicking on Product → clean build folder and build the app from Product → Build. And see your app icon and launch screen.
So here's a way to add an app icon and launch screen image in the tvOS app. If you have queries or improvements, don’t forget to mention it in the below comment section.