How can I create an image set in Assets.xcassets so that I can use it in my LaunchScreen?

Question

I want to create a LaunchScreen.storyboard for my iPhone/iPad game and I want to use the image from Assets.xcassets-->Image in my LaunchScreen. But I don't know what image sizes that I should add to Assets.xcassets-->Image. I just want to support iPhones and iPads and my game's orientation is only landscape left/right.
Which images sizes or vector files should I add to Assets.xcassets if I want to use the same image in UIImageView in my LaunchScreen.storyboard?
I use Visual Studio for Mac and Xcode 13.1.

My empty Assets.xcassets-->Image:
mZWxlBF

Answer 1

Hello,

Welcome to our Microsoft Q&A platform!

Launch Image has been deprecated after iOS 13, setting LaunchScreen.storyboard is necessary. The size of the image depends on how you want to display the launchscreen page, it is about autolayout.

My image size is 400*400 and it shows in center of the screen, you could refer to the following steps:

1. Create an image set, select Assets.xcassets, right click New Image Set, give it a name(my image name is launch) , add two image( 800*800 px @2x one, 1200*1200 px @3x one) under Universal section.
2. Add an ImageView to viewcontroller in LaunchScreen.storyboard
3. Set the constrains

Set the Image(my image name is launch) to this ImageView, set the Content Mode of ImageView to AspectFit, then set the AutoResizing to scale to the screen size. When you selsect the ImageView, AutoResizing is under the second-to-last inverted triangle sign on the right toolbar, all outer arrows should be deselected and all inner arrows selected.

Then set the Center X and Center Y of the ImageView.

After above steps, you could run to check the effect, the launch page disappears very quickly, it may disappear when you rotate the screen.

There are also other ways to set the constrains, refer to https://stackoverflow.com/questions/37951817/launch-screen-storyboard-with-centered-image-ios
About LaunchScreen, you could refer to https://learn.microsoft.com/en-us/xamarin/ios/app-fundamentals/images-icons/launch-screens?tabs=macos
About Auto Layout, you could refer to https://developer.apple.com/library/archive/documentation/UserExperience/Conceptual/AutolayoutPG/index.html
Best Regards,
Wenyan Zhang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.