3

I am new to size class and auto layout in iOS. I am practicing the same through a small application. Below is what I am trying to achieve through auto-layout and size-class. Below are the specific screenshots for iPad portrait and iPad landscape respectively.

iPad portrait interface iPad landscape interface

iPad Portrait:: 3 subviews here i.e. gray view, green view, pink view.

gray view- 3/4th height of super view, 2/3th width of super view green view- 3/4th height of super view, 1/3th width of super view pink view- 1/4th height of super view, same width as super view

iPad landscape:: same 3 subviews as iPad portrait but at slightly different positions.

gray view- same height as super view, 2/4th width of super view green view- same height as super view, 1/4th width of super view pink view- same height as super view, 1/4th width of super view

I am able to manage with auto layout as long as there are two subviews. But, I am unable to achieve what is described above. Also, I want to have different layout design in iPad portrait and landscape.

Rashmi Ranjan mallick
  • 6,390
  • 8
  • 42
  • 59
  • 1
    I am not sure why this is being down voted. The question here is very specific. How to differentiate between iPad portrait and landscape using size class? And I don't find any good answers on stack overflow. – Rashmi Ranjan mallick May 12 '15 at 05:11
  • 1
    Did you ever find a solution for this? I have same issue, and have only ever been met by same kind of answers you received from elitists who consider themselves too good to help anyone. – user717452 Oct 06 '15 at 18:08

1 Answers1

-2

Take a look also on new adaptive interface builder: "what's new in interface builder" from WWDC2014 https://developer.apple.com/videos/wwdc/2014/ and see designing different UIs for different screen sizes - big, small, default.

EDIT: Let's start with creating single uiView inside the ViewController: uiview in uiviewcontroller

After that select your UIView and click the constraints editor in the lower-right corner (an "tie fighter" like icon). editing constraints

Select the upper and left constraint to 0 (untick "constrain to margins"): constrains

Control+drag from your view to the background view and select equal widths:equal widths

Select your view and on the right side of the panel select the Size inspector. You have list of all constrains there. Select the Equal width to:Superview and click edit. Select the multiplier to e.g. 1/2: proportional constrain.

Add the additional two views and play with constrains: adding the space to nearest neighbour and others to get what you want.

Important step: click on the w any h any on the bottom of the interface builder and select regular width|any height.[w any h any First you created the general constrains. Now you will create More specific constrains for so called size-class (class representing the size of the screen depending on model and orientation of device). You can create different set of constrains like in my previous description.

I wish you luck.

izik461
  • 1,131
  • 12
  • 32
  • 1
    Yeah, because iPad in landscape and portrait both have regular width and regular height. As far as I know you can distinguish them only in code using UITraitCollection, [see this](http://stackoverflow.com/a/28268200/991816) – DanSkeel Oct 11 '15 at 21:24