HELLO
HELLO

Reputation: 497

UIImageView sizing in AutoLayout + Size classes for all devices

I'm working on app and will for 1st time use auto layout/size classes. Today my first day learning it and I understand constraints now and how to place the images where I want them to be on every devices from iPhone 4s to iPad PRO.

As my main storyboard in Attributes inspector i'm using INFERRED size. In show Assistant Editor, Preview, i'm using all device sizes.

In my inferred storyboard i'm using a UIImageView size 170 Width, 230 Height. Then I use AutoLayout to make it center of every device screen in preview.

Now the issue is this UIImageView covers HALF of the size of iPhone 4s preview but only about 1/5th the size of iPad PRO. How do I alter the size of each UIImageView to the size that I want them to be in each device without changing that centered position of each UIImageView in the preview devices?

Upvotes: 0

Views: 563

Answers (2)

Henson Fang
Henson Fang

Reputation: 1207

Maybe you can use a pending or proportion constraints instead of width and height constraints.

pending

proportion

Upvotes: 0

tmac_balla
tmac_balla

Reputation: 648

You need to first set up your constraints properly and then choose the type of scaling you want.

Set up your constraints:

Click on the Pin icon |-[]-| at the bottom of the screen. Turn on all four orange I-beams. Set the four constants to zero. Uncheck the Constrain to margins checkbox and click 'add 4 constraints'

Then set your scaling:

Click on the Image View you added to your View Controller. In the Attributes Inspector on the right, choose your image. Set the Mode of the View to Aspect Fill (fill entire screen cropping top/bottom or left/right as necessary) or Aspect Fit (letter box image so that entire image is shown uncrossed).

That should work

Upvotes: 1

Related Questions