Error in programmatically Auto-layout vertically ios

Question

I am creating view programmatically, In it there is two sub views, I have set height and width constraint for that, what I want is like this,

UIView (variable height)
[10px gap]
UIView (fix height 40)

but I got:

My code is:

- (void)viewDidLoad
{
    [super viewDidLoad];
    UIView *button1, *button2 ;
    button1=[UIView new];
    button2=[UIView new];
    button1.backgroundColor=[UIColor redColor];
    button2.backgroundColor=[UIColor yellowColor];
    button1.translatesAutoresizingMaskIntoConstraints=button2.translatesAutoresizingMaskIntoConstraints=NO;

    [self.view addSubview:button1];
    [self.view addSubview:button2];
    NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(button1,button2);

    NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[button1]-|"
                                                                   options:0
                                                                   metrics:nil
                                                                     views:viewsDictionary];

    [self.view addConstraints:constraints];

    constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[button1]-10-[button2]-|"
                                                          options: NSLayoutFormatAlignAllLeft
                                                          metrics:nil
                                                            views:viewsDictionary];

    [self.view addConstraints:constraints];
}

Edit Second Try

- (void)viewDidLoad
{
    [super viewDidLoad];
    UIView *button1, *button2 ;
    button1=[UIView new];
    button2=[UIView new];
    button1.backgroundColor=[UIColor redColor];
    button2.backgroundColor=[UIColor yellowColor];
    button1.translatesAutoresizingMaskIntoConstraints=button2.translatesAutoresizingMaskIntoConstraints=NO;

    [self.view addSubview:button1];
    [self.view addSubview:button2];

 [self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
                                                                 attribute:NSLayoutAttributeLeading
                                                                 relatedBy:NSLayoutRelationEqual
                                                                    toItem:self.view 
                                                                 attribute:NSLayoutAttributeLeft
                                                                multiplier:1.0
                                                                  constant:25.0]];

//    [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:button1
//                                                                 attribute:NSLayoutAttributeWidth
//                                                                 relatedBy:NSLayoutRelationEqual
//                                                                    toItem:nil
//                                                                 attribute:NSLayoutAttributeNotAnAttribute
//                                                                multiplier:1.0
//                                                                  constant:100]];

    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
                                                          attribute:NSLayoutAttributeTrailing
                                                          relatedBy:NSLayoutRelationEqual
                                                             toItem:self.view
                                                          attribute:NSLayoutAttributeRight
                                                         multiplier:1.0
                                                           constant:-25.0]];


    [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:button1
                                                                 attribute:NSLayoutAttributeTop
                                                                 relatedBy:NSLayoutRelationEqual
                                                                    toItem:self.view 
                                                                 attribute:NSLayoutAttributeTop
                                                                multiplier:1.0
                                                                  constant:30]];

    [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:button1
                                                                 attribute:NSLayoutAttributeBottom
                                                                 relatedBy:NSLayoutRelationEqual
                                                                    toItem:button2
                                                                 attribute:NSLayoutAttributeBottom
                                                                multiplier:1.0
                                                                  constant:-30.0]];






    //// Yellow

    /// Left
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
                                                          attribute:NSLayoutAttributeLeading
                                                          relatedBy:NSLayoutRelationEqual
                                                             toItem:self.view
                                                          attribute:NSLayoutAttributeLeft
                                                         multiplier:1.0
                                                           constant:25.0]];

    //Right
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
                                                          attribute:NSLayoutAttributeTrailing
                                                          relatedBy:NSLayoutRelationEqual
                                                             toItem:self.view
                                                          attribute:NSLayoutAttributeRight
                                                         multiplier:1.0
                                                           constant:-50.0]];




    [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:button2
                                                           attribute:NSLayoutAttributeTop
                                                           relatedBy:NSLayoutRelationEqual
                                                              toItem:button1
                                                           attribute:NSLayoutAttributeTop
                                                          multiplier:1.0
                                                            constant:30]];

//    [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:button2
//                                                           attribute:NSLayoutAttributeBottom
//                                                           relatedBy:NSLayoutRelationEqual
//                                                              toItem:self.view
//                                                           attribute:NSLayoutAttributeBottom
//                                                          multiplier:1.0
//                                                            constant:-30.0]];

    [self.view  addConstraint:[NSLayoutConstraint constraintWithItem:button2
                                                                 attribute:NSLayoutAttributeHeight
                                                                 relatedBy:NSLayoutRelationEqual
                                                                    toItem:nil
                                                                 attribute:NSLayoutAttributeNotAnAttribute
                                                                multiplier:1.0
                                                                  constant:100]];
}

In this I got:

Answer 1

Regular views don't have any intrinsic size, and you've given the system no hints about how big the views should be, so button 1 gets laid out first with at least 10 points to spare, and view 2 ends up being 0 points high and 0 points wide.

To correct this, make sure that you give both views some horizontal rules, not just one of the views. Secondly, make sure you give the system some idea about height. If you want the views to be equal sizes, you need to tell the system that. Add another horizontal constraint for button 2:

constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[button2]-|" options:0 metrics:0 views:viewsDictionary];
[[self view] addConstraints:constraints];

Then add a height constraint for the view, in this case, adjust your vertical constraints to make the views equal heights by adding the (==button1) size information:

constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[button1]-10-[button2(==button1)]-|"
                                                      options:0
                                                      metrics:nil
                                                        views:viewsDictionary];

Now you should see two views, red on top, yellow on bottom, that take up an equal amount of vertical space, have 10p space between and stretch to 20 points of each side of the container view.

To create these same constraints manually (which I don't recommend), you would do something like this:

UIView* view = [self view]; // for brevity
NSMutableArray* manualConstraints = [NSMutableArray array];
NSLayoutConstraint* b1_top = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTop multiplier:1 constant:20];
[manualConstraints addObject:b1_top];
NSLayoutConstraint* b1_left = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeLeading multiplier:1 constant:20];
[manualConstraints addObject:b1_left];
NSLayoutConstraint* b1_right = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTrailing multiplier:1 constant:-20];
[manualConstraints addObject:b1_right];
NSLayoutConstraint* b1_bottom = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:button2 attribute:NSLayoutAttributeTop multiplier:1 constant:-10];
[manualConstraints addObject:b1_bottom];
NSLayoutConstraint* b2_left = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeLeading multiplier:1 constant:20];
[manualConstraints addObject:b2_left];
NSLayoutConstraint* b2_right = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTrailing multiplier:1 constant:-20];
[manualConstraints addObject:b2_right];
NSLayoutConstraint* b2_bottom = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeBottom multiplier:1 constant:-20];
[manualConstraints addObject:b2_bottom];
NSLayoutConstraint* b2_height = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:40];
[manualConstraints addObject:b2_height];
// Add all constraints
[view addConstraints:manualConstraints];