0

You see the orange part is a UIView, the white part is also an UIView. The orange view is the super view of white view.

I have defined the constraint for the white view to have "Bottom Space to super view 140", and "Top Space to super view 219", which looks like this in iPhone7:

enter image description here

If I switch to smaller screen, e.g. iPhone 4, it would look like the following:

enter image description here

As you see, the white area in smaller screen become smaller.

I would like to ask how to make the white area occupy the same percentage of area of the device screen that the area ratio doesn't change? (I mean how to make the top & bottom distance of white view proportional to the super view, not like what I did fixed space to bottom and top which produces the problem)

===== UPDATE ====

I followed @Phillip Mills's simple answer, managed to make the white area's height proportional to super view, however, I got a new issue that xcode complains about the Y positioning of the white area. Again, how to make the Y positioning proportional as well like the height?

Leem.fin
  • 40,781
  • 83
  • 202
  • 354
  • It is not duplicated, because the answer in the linked post says something like " Editor -> Pin -> Widths Equally" but I can't find it in xcode8 – Leem.fin Aug 30 '17 at 16:29

1 Answers1

0

Use a constraint that makes the subview height equal to the parent view's height. Then change the multiplier in the constraint to a float value less than 1.

enter image description here

enter image description here

Phillip Mills
  • 30,888
  • 4
  • 42
  • 57
  • OK, thanks, it works like you suggested, but that only defines the height of white area is proportional to super view, I still need to define the Y position of the height? How to define Y position proportional as well? – Leem.fin Aug 30 '17 at 16:19
  • @Leem.fin You can do essentially the same thing with a centering constraint between the two views, adjusting a multiplier to position whatever amount off-center you like. – Phillip Mills Aug 30 '17 at 16:47
  • is it a centering vertical or horizontal constraint in my case? – Leem.fin Aug 30 '17 at 18:01
  • Vertical for y. – Phillip Mills Aug 30 '17 at 18:02
  • Thanks @Phillip Mills, do you know what should I search for tutorial on this kind of proportional to super view thing? I would like to have a concrete learning on it. – Leem.fin Aug 30 '17 at 18:29
  • it works in xcode device view, but when run on emulater, doing what you mentioned makes the white area disappear from the screen. – Leem.fin Aug 30 '17 at 19:20
  • Not sure what to tell you. I just updated my answer with pictures of a pair of examples that work fine for me here in simulators. (Xcode has a Debug View Hierarchy option that let's you examine views at runtime. Maybe that will point out something wrong about constraints, size, z-order....) – Phillip Mills Aug 30 '17 at 19:35