iOS: Visual format constraints are broken

Question

I'm trying to lay a button over a map and constrain it to 10 points in from the left and 10 points up from the bottom. However, when I run it in simulator it tells me my constraints are broken. Here's my code. What am I missing?

_map = [[MKMapView alloc] init];
[self setView:_map];
CLLocationCoordinate2D coord = CLLocationCoordinate2DMake(39.810166, -86.156708);

_loc = [[TCMLocationPoint alloc] initWithCoordinate:coord title:@"My Location" subtitle:@"My Subtitle"];
[_loc setParent:_map];
[_map addAnnotation:_loc];

MKCoordinateRegion region = MKCoordinateRegionMakeWithDistance(coord, 2000, 2000);
[_map setRegion:region animated:NO];

_directionsButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[_directionsButton addTarget:self action:@selector(getLocation:) forControlEvents:UIControlEventTouchDown];
[_directionsButton setTitle:@"Get Directions" forState:UIControlStateNormal];
[_directionsButton setFrame:CGRectMake(0.0, 0.0, 150.0, 25.0)];

[[self view] addSubview:_directionsButton];

NSDictionary *nameMap = @{@"button" : _directionsButton};
NSArray *horizontalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[button]-(>=0)-|"
                                                                                     options:0
                                                                                     metrics:nil
                                                                                       views:nameMap];
[[self view] addConstraints:horizontalConstraints];
NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(>=0)-[button]-10-|"
                                                                                   options:0
                                                                                   metrics:nil
                                                                                     views:nameMap];

[[self view] addConstraints:verticalConstraints];

Answer 1

A couple of thoughts:

1. I'd set translatesAutoresizingMaskIntoConstraints to NO.

2. You can probably simplify your VFL, too, and eliminate the >=0 stuff. You can also set the width and height right in your VFL.

3. You also don't need to set the frame. Let the constraints set the width, height.

4. Unless you're doing this in loadView, I'd suggest you add the map as a subview rather than trying to set self.view.

Thus:

_map = [[MKMapView alloc] init];
_map.delegate = self;   // if you've implemented any `MKMapViewDelegate` methods, you should set your delegate
[_map setTranslatesAutoresizingMaskIntoConstraints:NO];
[self.view addSubview:_map];
NSDictionary *views = @{@"map" : _map};
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[map]|"
                                                                  options:0
                                                                  metrics:nil
                                                                    views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[map]|"
                                                                  options:0
                                                                  metrics:nil
                                                                    views:views]];

// do your stuff where you're adding your annotation here

_directionsButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[_directionsButton addTarget:self action:@selector(getLocation:) forControlEvents:UIControlEventTouchDown];
[_directionsButton setTitle:@"Get Directions" forState:UIControlStateNormal];
[_directionsButton setTranslatesAutoresizingMaskIntoConstraints:NO];

[[self view] addSubview:_directionsButton];

NSDictionary *nameMap = @{@"button" : _directionsButton};

NSArray *horizontalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[button(150)]"
                                                                         options:0
                                                                         metrics:nil
                                                                           views:nameMap];
[[self view] addConstraints:horizontalConstraints];

NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[button(25)]-10-|"
                                                                       options:0
                                                                       metrics:nil
                                                                         views:nameMap];
[[self view] addConstraints:verticalConstraints];

You might even want to set the priority for the width and height constraints to be less than 1000, that way if the font dictates that the button should be a little larger, you'll let it grow, e.g. @"H:|-10-[button(150@500)]" and @"V:[button(25@500)]-10-|".