iosinterface-builderautolayoutiphone-4iphone-6-plus

iOS: how to adapt interface designed for iPhone 5 to the size of iPhone 4?


Good day, friends!

I have a design for my first app. It is great, I love it, but I can't implement it. The problem is - I started to do it for iPhone 5 size, and only later realized that iPhone 4 doesn't fit in proportions at all.

I tried to use new adaptive layout in IB, but sizes of elements of my interface are too different.

Here is an example of design: profile screen. There are 3 main views:

  1. top with picture - 238 pt height
  2. middle with properties - 220 pt height
  3. bottom with buttons - 90 pt height

This are sizes for iPhone 5. I can scale it to fit new models, but I can't find a way to adapt it to iPhone 4.

MY QUESTION IS: what is the best way to deal with Auto Layout in my case? Is it even possible to do this in IB using single storyboard?

Or the only way is to create constraints programmatically for all the viewControllers in the app?

Thank you very much for any ideas!


Solution

  • Could you create some variables that representing proportions of your elements. And in that way create a solution for every screen-size in once? E.g. if your image width = device-width and Image height = image-width *(16/9) (this is no real code, but example on how it could work in the theory)