如何以编程方式实现多个标签的自动布局约束

Question

I have multiple label to show .

The problem is each label beg=have differently for different type of simulator .

Below is my code to show label on xib files .

- (void)viewDidLoad {
[super viewDidLoad];
[self intillizeview];


// Do any additional setup after loading the view from its nib.
}

- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

-(void)intillizeview{

int height =0;


for(int i=0; i<10; i++){


    UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
    button.tag=i;
    button.frame = CGRectMake(5, 80 + height, 25, 30);
    [button setTitle:[NSString stringWithFormat:@"%d",i] forState:UIControlStateNormal ];

    [button.titleLabel setFont:[button.titleLabel.font fontWithSize:7]];

    button.titleLabel.textAlignment = NSTextAlignmentCenter;
    //button.backgroundColor= [UIColor blueColor];
    height+= 20;
    [self.view addSubview:button];


}
height=0;
for(int i=0; i<10; i++){



     UILabel  * label = [[UILabel alloc] initWithFrame:CGRectMake (35, 80+height,100, 30)];
    label.backgroundColor = [UIColor clearColor];
    label.textAlignment = NSTextAlignmentCenter;
    label.text= [NSString stringWithFormat:@"NAME %d", i];
    [label setFont: [label.font fontWithSize:7]];
    height+= 20;
    [self.view addSubview:label];
      }
height=0;

for(int i=0; i<10; i++){


    UILabel  * label = [[UILabel alloc] initWithFrame:CGRectMake(140, 80+height,65, 30)];
    label.backgroundColor = [UIColor clearColor];
    label.textAlignment = NSTextAlignmentCenter;
    label.text= [NSString stringWithFormat:@"TASK %d", i];
    [label setFont: [label.font fontWithSize:7]];
    height+= 20;
    [self.view addSubview:label];

}
height=0;
for(int i=0; i<10; i++){


    UILabel  * label = [[UILabel alloc] initWithFrame:CGRectMake(210, 80+height,70, 30)];
    label.backgroundColor = [UIColor clearColor];
    label.textAlignment = NSTextAlignmentCenter;
    label.text= [NSString stringWithFormat:@"Status %d", i];
    [label setFont: [label.font fontWithSize:7]];
    UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];

    button.frame = CGRectMake(275, 80 + height, 40, 30);
    [button setTitle:@"Sign Off" forState:UIControlStateNormal];
    [button.titleLabel setFont:[button.titleLabel.font fontWithSize:7]];
            button.titleLabel.textAlignment = NSTextAlignmentCenter;

    height+= 20;
    [self.view addSubview:label];


    [self.view addSubview:button];

}


[enter image description here][1]
}

I am also attaching the my xib files . below is the screen shots

Now when i run the score on my iPhone 4s simulator the output is perfectly fine . Below is the screenshot

enter image description here

But when i Run same code iPhone 6 i get the different output location . below is the screenshot .

enter image description here

I have tried implemeting auto layout constraint but didn't get success . Also Please help me apply auto layout constraint programatically so that for any simulator the location and position is fixed .

Thanks in advance.

Answer 1

Try this very simple way :-

ViewController.h code is here:

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (strong, nonatomic) IBOutlet UIView *bigBlueView;
@property (strong, nonatomic) IBOutlet UILabel *caption;
@property (strong, nonatomic) IBOutlet UIButton *buttonOne;
@property (strong, nonatomic) IBOutlet UIButton *buttonTwo;
@property (strong, nonatomic) IBOutlet UILabel *lblOutlet;

@end

ViewController.m code is here:

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    NSDictionary *viewsDictionary = @{@"superView":self.view,
                                      @"bigBlueView":self.bigBlueView,
                                      @"caption":self.caption,
                                      @"buttonOne":self.buttonOne,
                                      @"buttonTwo":self.buttonTwo,
                                      @"lblOutlet":self.lblOutlet
                                      };

    [self.view removeConstraints:[self.view constraints]];
    //[self.view setTranslatesAutoresizingMaskIntoConstraints:NO];

    NSArray *bigBluewidthConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[bigBlueView(==300)]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:bigBluewidthConstraint];

    NSArray *bigBlueHeightConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[bigBlueView(==250)]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:bigBlueHeightConstraint];

    NSArray *lblOutletTopConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-25-[lblOutlet]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:lblOutletTopConstraint];
    NSArray *lblOutletCenterConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[superView]-(<=1)-[lblOutlet]" options:NSLayoutFormatAlignAllCenterX metrics:nil views:viewsDictionary];
    [self.view addConstraints:lblOutletCenterConstraint];

    NSArray *bigBlueTopConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-50-[bigBlueView]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:bigBlueTopConstraint];
    NSArray *bigBlueCenterConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[superView]-(<=1)-[bigBlueView]" options:NSLayoutFormatAlignAllCenterX metrics:nil views:viewsDictionary];
    [self.view addConstraints:bigBlueCenterConstraint];

    NSArray *captionTopConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[bigBlueView]-25-[caption]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:captionTopConstraint];
    NSArray *captionCenterConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[superView]-(<=1)-[caption]" options:NSLayoutFormatAlignAllCenterX metrics:nil views:viewsDictionary];
    [self.view addConstraints:captionCenterConstraint];

    NSArray *ButtonOneTopConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[bigBlueView]-60-[buttonOne]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:ButtonOneTopConstraint];
    NSLayoutConstraint *buttonOneLeadingConstraint = [NSLayoutConstraint constraintWithItem:self.buttonOne attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.bigBlueView attribute:NSLayoutAttributeLeading multiplier:1.0 constant:25];
    [self.view addConstraint:buttonOneLeadingConstraint];

    NSArray *ButtonTwoTopConstraint = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[bigBlueView]-60-[buttonTwo]" options:0 metrics:nil views:viewsDictionary];
    [self.view addConstraints:ButtonTwoTopConstraint];
    NSLayoutConstraint *buttonTwoTrailingConstraint = [NSLayoutConstraint constraintWithItem:self.buttonTwo attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self.bigBlueView attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:-25];
    [self.view addConstraint:buttonTwoTrailingConstraint];

}

@end

Output Screen portrait looks like this :-

Output Screen Landscape looks like this :-