CODEWITHSUNDEEP
iosiphoneautolayout
Benny
Benny

Reputation: 5092

iOS: Keeping views proportionally sized to each other using autolayout

I have an UIImageView called 'logo' inside a UIView called 'container'. The logo is centred inside the container both horizontally and vertically.

Depending upon the screen size the app is running in the height of the container changes based on constraints. I would like the size of the logo to change proportionally to the height of the container as on the 3.5 inch display it is too large at its normal size.

Can anyone tell me what constraint I should be placing on the logo and/or container to change the logo's size? I'd love to be able to do this without resorting to code as I believe I should be able to set this up in IB. Many thanks.

Upvotes: 0

Views: 84

Answers (2)

Tejvansh
Tejvansh

Reputation: 676

In your xib file, first check the imageview logo is in subview of your container view, then select your imageview and the container view using command key. Once both are selected, go to editor menu and select Heights equally and width equally one by one under pin option. Then select the constraint you just added, go to attributed inspector, change the multiplier in the ratio you want, like 2:3 (it means the height of your logo will be in the ratio of 2:3 of your container view's height if your first item is logo or else set it to 3:2).

Upvotes: 0

andrew wang
andrew wang

Reputation: 956

  1. You can press control and at the same time drag the image "logo" to it`s superview container and chose equal height . click the logo and chose the size inspector on the right, you will find a lot constraints then chose Equal Height to.
  2. Double click Equal Height and you will see the detail constraints, the first item: the logo image,relation :equal ,second item:you should chose the super view,Multiplier set 1. it means firstItem.propery = secondItem.propery relation Multiplier + constant;

I hope it can help you ,if you want to know more ,you can read some thing about AutoLayout in WWDC 2014

Upvotes: 1

Related Questions