Auto Layout to dynamically size uilabel width
IosStoryboardConstraintsAutolayoutIos Problem Overview
So I have two UILabels side by side in Storyboard. The second label should butt up against the right edge of the first one (trailing constraint of 1), but I also need the first label (the one on the left) to set it's width equal to it's content size unless it hits a max width. Visually:
|Label one text| |Label two text|
And I need the following constraints:
-
Label one should resize width wise unless it hits a max size.
-
Label two should always be butted up against the right edge of label one
How do I set this up in Storyboard?
Ios Solutions
Solution 1 - Ios
- Create the 1 point horizontal space between the labels: Control-drag from
label2
tolabel1
. Choose Horizontal Spacing from the pop-up. Double click the constraint. Change the constant to 1. - Give
label1
a max width: Selectlabel1
. Go to the top menu bar, select Editor > Pin > Width. Double click the constraint. Change the relationship to <= and change the constant to the max width. - Vertically align the labels: Select both labels. Go to the top menu bar, select Editor > Align > Vertical Centers.
- You still need to set constraints that define how your labels are positioned in their container view. I leave that up to you. I pinned
label1
32 points from the left edge of the root view and 34 points from top layout guide. - Update the frames of the labels so they reflect the above constraints: Go to the menu bar in the lower right-hand corner of the canvas. Tap the "Resolve Auto Layout Issues" Tie-Fighter button. Select "Update All Frames…" in the pop-up.
Note: Notice that I did not have to create constraints to make label1
's width reflect its content size. The content sizing constraints are generated automatically.
Solution 2 - Ios
Solution 3 - Ios
Please first get textSize with below code:
CGSize textSize = { 230.0, 10000.0 };
CGSize size = [[NSString stringWithFormat:@"%@", yourLabelText]
sizeWithFont:[UIFont systemFontOfSize:10]
constrainedToSize:textSize
lineBreakMode:NSLineBreakByWordWrapping];
then set your first label frame with this content size:
UILabel *lblFirst = [[UILabel alloc] initWithFrame:CGRectMake(X, Y, W, size.height)];
lblFirst.lineBreakMode = YES;
lblFirst.lineBreakMode = NSLineBreakByWordWrapping;
lblFirst.numberOfLines =size.height;
lblFirst.backgroundColor = [UIColor clearColor];
[self.view addSubview:lblFirst];
then second label Frame will be:
UILabel *lblFirst = [[UILabel alloc]
initWithFrame:CGRectMake(lblFollowerName.frame.size.width + lblFollowerName.frame.origin.x, Y, W, H)];