Autolayout with “greater than or equal to” based on screen size

Question

I'm doing the screen onboarding for an app. I did a lot of tests to adapt the three main elements (title, image and description) for all sizes (from iPhone 4 to iPhone 6 Plus), but in the end I gave up and I set the items for the iPhone 4. The result as you can see, all right on the iPhone 4 but going to climb on larger devices, the result is very bad.

My biggest problem is the constraints "greater than or equal to". The ideal is to have the maximum and minimum vertical margins on labels that block the central image in case it becomes too large. Do you have any suggestions?

This is my current setup

Thank You very much!

Answer 1

Hey i have added your sample project to a git repo and i have changed the constraints in such a way that whatever you needed to be in higher end devices for the screen. Take deep look at that and you can get idea to design any kind of screen with dynamic gaping and dynamic sizing without using size class. I am using proportional width and height constraints and dynamic blank views to manage gaps.

Here is the repo link.

https://github.com/mahesh-agrawal/Test-AutoLayout-Vertical-Gap.git

Thank you.

Answer 2

Set the proportional width constraint with SuperView.