Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vertically center view between two others

I wondered how to use constraints to center an object between two others vertically. I use storyboards. The label and the button have constraints using autolayout (label: top, leading, trailing, height; button: bottom, leading, trailing, aspect ratio).

Here is how all that looks like:

Here is a schematic of my UI.

I want constraint 1 and 2 (take a look at the image) to be the same length so that 'view' is vertically centered between 'label' and 'button'. Placing hidden views with the same height in between didn't work for me in smaller screen sizes. Thank you!


PS: One important thing is: I want the view to be centered and not all elements equally spaced!

like image 250
Oscar Avatar asked Mar 25 '26 19:03

Oscar


2 Answers

Take a transparent view with top constraint 0 to topView(lable) and bottom constraint 0 to bottom view(Button). Now add the view in that view which you want vertically centre to both view. And add it constraints as horizontal and vertical centre to the parent view.

like image 200
Nishant Bhindi Avatar answered Mar 28 '26 10:03

Nishant Bhindi


You can try stackview here. Put all items in to stack view and provide equal spacing

like image 32
Vinu David Jose Avatar answered Mar 28 '26 10:03

Vinu David Jose



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!