How to set Background Image correctly

Question

I want to set a background image to my app but the image is not centered. The resolution is 640x1136, I have only one size, do I need more ? What is @2x and @3x ?

Answer 1

EDIT I ended up spending ~ an hour in chat with the OP, and the solution to their problem was ultimately to remove all launch screen assets from the xc bundle and instead just put a UIImageView on the launch screen storyboard, anchor each side of it to the sides of the view, and set fill mode to aspect fill. That said, the below information is more likely to solve the problem for the majority of people who run into this, I think.

---

You need different sized images for the different screen sizes & aspect ratios. From the Apple docs:

It’s best to use an Xcode storyboard for your launch screen, but you can provide a set of static images if necessary. Create static images in different sizes for different devices, and be sure to include the status bar region.

The documentation includes a large table with all possible screen sizes one might support.

Many tutorials exist on the topic, and they may be a good place to start. This similar SO question also has a number of useful and informative answers.

Personally, I make one high-resolution image and then drop it into a tool which automatically generates all necessary screen sizes for me. I do the same thing for all the app icon sizes. Many such tools exist; SO is not an appropriate place to pontificate on which tools are better than others, so I will leave that choice (and research) up to you.

As far as where to put the images, the following instructions from Matthew Palmer's tutorial should be sufficient to get you started:

1 In Xcode, Click on your Assets file (Images.xcassets) in the left sidebar. It should open in the main pane.

2 In the left sidebar of the main pane (where AppIcon, LaunchImage, etc. are), right click

3 Select New Launch Image

4 Add your new launch images as normal. If you want something quick and easy to use, Paul Haddad recommends taking a screenshot in the iPhone 6 simulator and using that, or DavidSmith has created some default ones.

5 Change the Launch Images Source from your Target’s settings.

I found a useful list of launch screen resolution sizes here, which I will quote below:

Image Resolution Image name

320x480 Default.png

640x960 Default@2x.png

640x1136 Default-568h@2x.png

750x1334 Default-667h@2x.png

1242x2208 Default-736h@3x.png

768x1024 Default-Portrait.png

1024x768 Default-Landscape.png

1536x2048 Default-Portrait@2x.png

2048x1536 Default-Landscape@2x.png

The link where the above table was quoted from is also probably the best tutorial I was able to find on the topic. Note that, if you make the larger sizes first and drag them into Xcode, Xcode and auto-generate many of the smaller resolutions for you. (For example, providing one iPad resolution will typically be sufficient for all iPad resolutions.)

Answer 2

Ok let's take this one question at a time...

• Background Image not being centered, I assume you have an ImageView containing that image... If so you should be able to do something like imageView.contentMode = .center
• The @2x and @3x are for the newer phones with higher resolution. It is advised to have all 3. Also if you could show any code that would help.