Change height and width of ImageViews proportionally

Question

I have a View like shown in the image. Leading and trailing distance is increasing when showing view on different screens. How do I make it look good on every screen by using constraints.

All images height and width increase or decrease equally @Agent Smith — bhupinder, Mar 07 '18 at 07:44
It is recommended to add your tried code or any efforts you have made till now — Prashant Tukadiya, Mar 07 '18 at 07:51

score 2 · Accepted Answer · answered Mar 07 '18 at 07:51

2

You can use UIStackView (Horizontal) with distribution Equally , here is a run on iPhone

Also with iPad

answered Mar 07 '18 at 07:51

Shehata Gamal

98,760
8
65
87

And set the contentmode to aspect fit :) – J. Doe Mar 07 '18 at 08:03
Is it possible to adjust height of stackview correspond to width of single item in the stackView? – bhupinder Mar 07 '18 at 08:50

score 0 · Answer 2 · answered Mar 07 '18 at 07:57

Add the following constraints

Assign equal width from image1 to image2.
Assign horizontal spacing between both image.
Assign leading space from image1 to its superview.
Assign trailing space from image2 to its superview.
Assign top space to both the buttons.

Then do this same steps for image3 and image4

Change height and width of ImageViews proportionally

2 Answers2