CODEWITHSUNDEEP
iosswiftimageipadscale
mojomo
mojomo

Reputation: 119

Swift: How to scale image on LaunchScreen for iPad

Is there a function in the attributes inspector or elsewhere that allows you to scale an image on the LaunchScreen.xib so that it looks good both on iPhone and iPad? I know how to do it with fonts, but images?

Upvotes: 1

Views: 1693

Answers (1)

Matthew Seaman
Matthew Seaman

Reputation: 8092

You can accomplish this using Asset Catalogues and Auto Layout.

Auto Layout

First, drag an image view onto the canvas (should be a square if "use size classes is checked"). This is where your image will go. To dynamically change the size of the image, we will simply give the image view some rules about how it should lay itself out. Control-drag from the image view to the view behind it. If you do this in the canvas, the visible constraint options will correspond to the general direction you drug the connection line to. If you control-drag between the elements in the project outline, you will get all options. You will need to set enough constraints so that no sizing is ambiguous and no constraint lines are red.

Adding constraints

You can inspect and edit the constraints in the Size Inspector.

Inspecting constraints

If at any point and time you have orange constraints and Xcode gives you a warning saying frames will be different at runtime, simply select the image and update frames from the menu popping out of the right-most icon on the bottom-right of the canvas (triangle in-between two lines).

Updating frames

By the way, double-clicking any of these blue constraints lets you edit them.

Editing Constraints

Asset Catalogues

Now, you just need to add the image to the image view. First, navigate to the Asset Catalogue (.xcassets file) you like to use. Click the plus button at the bottom and add a "New Image Set". In the first box you should drag the image that you would like, whatever size you want (do test). @2x is double the pixel width and height and @3x is likewise triple. These higher resolutions will take up the same amount of physical space but look better with the higher pixel density retina displays.

At this point, your launch screen should look good on any sized device, and on iPad Split Screen if you choose to support it.

Here's an Apple doc on Icons and Graphics.

Upvotes: 2

Related Questions