Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Center two UIViews of different size horizontally

I have the following wireframe:

enter image description here

I need to add the "Don't have an account yet? Sign Up.". To do this I'll have two different UILabels, one with "Don't have an account yet?" and another with "Sign Up" so I can style them separately.

My problem is that I don't know how to center to the Superview two different labels that have different size and my grow if it's localized to a language where they take more space than english...

So the questions would be: "How do I center two UILabels with different width related to it's superview?"

Thanks a lot!

like image 904
Juan Garcia Avatar asked Jul 16 '15 18:07

Juan Garcia


People also ask

How to horizontally center multiple inner DIVS (in a row) in outer Div?

To horizontally center multiple inner divs (in a row) in outer div using CSS, follow these instructions. Set text-align attribute for outer div as center. Make sure the inner divs are inline blocks. Example

How to horizontally center a block element (like <div>)?

To horizontally center a block element (like <div>), use margin: auto; Setting the width of the element will prevent it from stretching out to the edges of its container.

How to center a frame layout vertically in layout_gravity?

Instead of layout_gravity you have to use the properties layout_centerHorizontal, layout_centerVertical and layout_centerInParent (which centers both horizontally and vertically). The FrameLayout has no gravity property.

How to center text vertically and horizontally in HTML?

I am vertically centered. To center both vertically and horizontally, use padding and text-align: center: I am vertically and horizontally centered. Another trick is to use the line-height property with a value that is equal to the height property:


2 Answers

Here is the steps:

  1. Take a view that contains both of your labels and make centerx to it.
  2. Pinned label 1 with all sides with greater then equal width constraint
  3. and follow step 2 for label2.

Here is the visual presentation of it...

enter image description here

like image 153
EI Captain v2.0 Avatar answered Oct 19 '22 04:10

EI Captain v2.0


You should put them into container UIView make it flexible width (for ex. >= 10) and center it.

like image 34
ChikabuZ Avatar answered Oct 19 '22 04:10

ChikabuZ