How to make an image in LaunchScreen.xib fill the background using Xcode

Question

So I'm trying to setup a full screen background with a logo image centered in its middle with an existing LaunchScreen.xib (for a react native project) and I am having trouble with the autoformat.

I see that I can add constraints to my ImageView to maintain aspect ratio but I'm not sure how to make it fill(crop to fit) the view. When I test on device it just stays the same square as the interface builder and doesn't fill the screen. I've been trying to add different constraints to the image but it doesn't seem to affect it.

Also how do I preview it on different devices as shown in the UI. Selecting different devices doesn't seem to change the square canvas view at all.

BTW I don't want to do it as separate assets for every screen size - I'm curious to learn how to build it using the standard xib interface builder using layout rules.

Answer 1

The xib file was shown by a view that inside a UIViewController .
As you set constraints for UIImage in xib file (eg in UIView ) you should set constraints of UIView inside the UIViewController .
Then now set constraints of root view to the edges, and set Content Mode of imageView to what you want as apple document said:

The scaleAspectFit and scaleAspectFill modes scale the image to fit or fill the space while maintaining the image's original aspect ratio. The scaleToFill value scales the image without regard to the original aspect ratio, which can cause the image to appear distorted. Other content modes place the image at the appropriate location in the image view's bounds without scaling it.