Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set UILabel only width and height and constraints programmatically

I want to create a UILabel programmatically with height, width and then I want to add constraints to it also programmatically for positioning the UILabel.

Update:

I want to create UI like this:

enter image description here

How to create this UI All programatically

Code to create one label label1 similarly I created two more label label2 and label3

UILabel *label1 = [[UILabel alloc]init];  label1.font = TitleFont; label1.numberOfLines=0; label1.text= @"Descriptions"; label1.lineBreakMode=NSLineBreakByWordWrapping; [label1 sizeToFit]; label1.backgroundColor=[UIColor blueColor]; label1.textColor=[UIColor blackColor]; label1.translatesAutoresizingMaskIntoConstraints = NO; [self.view addSubview:label1]; 

And now I am able to add horizontal constraints them with this code

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[label1]-|" options:NSLayoutFormatDirectionLeadingToTrailing metrics:nil views:NSDictionaryOfVariableBindings(label1)]]; 

I am also able to set vertical constraint with view but I am unable to set constraint with from one label to another.

like image 510
Varun Naharia Avatar asked Jul 15 '15 11:07

Varun Naharia


1 Answers

To create label with height and width constraints here is the constraints...And don't forget to add label in to view with addSubview method

UILabel *Label = [[UILabel alloc] init]; [Label setTranslatesAutoresizingMaskIntoConstraints:NO];    [self.view addSubview:Label];  // Width constraint [Label addConstraint:[NSLayoutConstraint constraintWithItem:Label                                                       attribute:NSLayoutAttributeWidth                                                       relatedBy:NSLayoutRelationEqual                                                          toItem:nil                                                       attribute: NSLayoutAttributeNotAnAttribute                                                      multiplier:1                                                        constant:200]];  // Height constraint [Label addConstraint:[NSLayoutConstraint constraintWithItem:Label                                                       attribute:NSLayoutAttributeHeight                                                       relatedBy:NSLayoutRelationEqual                                                          toItem:nil                                                       attribute: NSLayoutAttributeNotAnAttribute                                                      multiplier:1                                                        constant:21]]; 

Swift 4:

label.translatesAutoresizingMaskIntoConstraints = false label.addConstraint(NSLayoutConstraint(item: label, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 21)) label.addConstraint(NSLayoutConstraint(item: label, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 200)) 

And In Swift

 Label.setTranslatesAutoresizingMaskIntoConstraints(false)  self.view.addSubview(Label)   Label.addConstraint(NSLayoutConstraint(item: Label, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1, constant: 21))  Label.addConstraint(NSLayoutConstraint(item: Label, attribute: .Width, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1, constant: 200))   

Check this link for more detail

UPDATE
As you update your question, here is my updated answer...

UILabel *Label1 = [[UILabel alloc] init]; [Label1 setTranslatesAutoresizingMaskIntoConstraints:NO]; UILabel *Label2 = [[UILabel alloc] init]; [Label2 setTranslatesAutoresizingMaskIntoConstraints:NO];  Label1.text = @"Label1"; Label1.backgroundColor = [UIColor blueColor]; Label2.text = @"Label2"; Label2.backgroundColor = [UIColor redColor];  [self.view addSubview:Label1]; [self.view addSubview:Label2];  // Width constraint [Label1 addConstraint:[NSLayoutConstraint constraintWithItem:Label1                                                   attribute:NSLayoutAttributeWidth                                                   relatedBy:NSLayoutRelationEqual                                                      toItem:nil                                                   attribute: NSLayoutAttributeNotAnAttribute                                                  multiplier:1                                                    constant:280]];  // Height constraint [Label1 addConstraint:[NSLayoutConstraint constraintWithItem:Label1                                                   attribute:NSLayoutAttributeHeight                                                   relatedBy:NSLayoutRelationEqual                                                      toItem:nil                                                   attribute: NSLayoutAttributeNotAnAttribute                                                  multiplier:1                                                    constant:21]];  // CenterX constraint [self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view                                                    attribute:NSLayoutAttributeCenterX                                                    relatedBy:NSLayoutRelationEqual                                                       toItem:Label1                                                    attribute: NSLayoutAttributeCenterX                                                   multiplier:1                                                     constant:0]]; // Top constraint [self.view addConstraint:[NSLayoutConstraint constraintWithItem:Label1                                                       attribute:NSLayoutAttributeTop                                                       relatedBy:NSLayoutRelationEqual                                                          toItem:self.topLayoutGuide                                                       attribute: NSLayoutAttributeBottom                                                      multiplier:1                                                        constant:40]];   // label2 [self.view addConstraint:[NSLayoutConstraint constraintWithItem:Label1                                                       attribute:NSLayoutAttributeLeading                                                       relatedBy:NSLayoutRelationEqual                                                          toItem:Label2                                                       attribute: NSLayoutAttributeLeading                                                      multiplier:1                                                        constant:0]]; // label2.Height = label1.Height [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:Label1                                                       attribute:NSLayoutAttributeHeight                                                       relatedBy:NSLayoutRelationEqual                                                          toItem:Label2                                                       attribute: NSLayoutAttributeHeight                                                      multiplier:1                                                        constant:0]]; // label2.width = label1.width [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:Label1                                                    attribute:NSLayoutAttributeWidth                                                    relatedBy:NSLayoutRelationEqual                                                       toItem:Label2                                                    attribute: NSLayoutAttributeWidth                                                   multiplier:1                                                     constant:0]];  // label2.Top [self.view addConstraint:[NSLayoutConstraint constraintWithItem:Label2                                                       attribute:NSLayoutAttributeTop                                                       relatedBy:NSLayoutRelationEqual                                                          toItem:Label1                                                       attribute: NSLayoutAttributeBottom                                                      multiplier:1                                                        constant:34]];   

Result Screen

enter image description here

like image 165
EI Captain v2.0 Avatar answered Sep 17 '22 18:09

EI Captain v2.0