How to adjust vertical spacing between controls according to display height.

  1. 4 months ago

    I am developing an ios app. Everything is working fine.
    Only The problem is when i run app on ios devices which are having larger display(in my case iphone X), all controls gets at the top part of the screen and about half bottom screen is left empty. i don't have any issue in horizontal alignment.

    Can anyone tell me how can adjust vertical spacing between the controls according to display height. and also font size according to display size ?

  2. Jeremie L

    Jul 25 Pre-Release Testers, Xojo Pro, XDC Speakers Europe (France) -


    I wouldn't recommend increasing font size on larger screens. iPhone screens are made to have an almost identical text size on all screen sizes.

    To increase vertical spacing based on display height, you can set the Auto-Layout relative to "Parent", Edge set to "Vertical Center" and then adjust the scale / offset. (Scale can be greater than 100%)

    In some cases you could also place all controls in a iOSContainerControl and place this container at the vertical center of the iOSView. This would center all controls vertically on all devices.

    Could you post a screenshot of the layout so I might be able to give further recommendations?

  3. Hi Jeremie,

    Thanks for your reply.
    i couldn't post an image, i will try to use Auto-Layout properties and lets see how it works.

  4. Ulrich B

    Jul 25 Pre-Release Testers, Xojo Pro Europe (Germany, Berlin) · xo...
    Edited 4 months ago

    Let’s say you have five controls to distribute vertically.

    You would anchor the topmost control’s top constraint anchor to the bottom of the parent’s top (or its ToplayoutGuide’s) bottom and the lowest’s bottom control to its parent’s bottom anchor (") top.

    The middle one could get a VerticalCenter layout constraint set to its parent’s vertical center.

    The second’s Verticalcenter can be set to its parent’s height, multiplied by 0.25 so it is placed in the middle between first and middle control.

    And the fourth the same, now with a multiplier of 0.75.

  5. Hello Ulrich,

    Can you please elaborate how to set verticalcenter with multiplier of something.

    Can we do that in xojo UI of Auto-layout or we need to set that in code.

  6. Ulrich B

    Jul 26 Pre-Release Testers, Xojo Pro Europe (Germany, Berlin) · xo...

    You can do that both ways, but in most cases setting constraints in LayoutEditor will be easier and you have direct visual feedback.
    As an example the 25% position:
    When you put a control on a view, Xojo adds some constraints automatically. You should remove those not necessary and add other ones. Here is the example of the 25% position:


or Sign Up to reply!