ios UIViewController programmatically positioning buttons not working - ios

Question

I would like to evenly space four buttons across a view. In the storyboard I have positioned the buttons in a portrait view so the spacing is correct. But I did not find the correct constraint settings to make the buttons space themselves evenly for any view width (for portrait iPad or landscape orientations). So, I added the following code snippet that moves the buttons to desired locations using the 1st and 4th buttons as the anchors:
// evenly space the buttons
CGPoint leftPoint = self.button1.center;
CGPoint rightPoint = self.button4.center;
CGFloat width = rightPoint.x - leftPoint.x;
leftPoint.x += width / 3;
rightPoint.x -= width / 3;
self.button2.center = leftPoint;
self.button3.center = rightPoint;
The positioning code is working fine, but my difficulty is finding the best place to make the adjustments. - (void)viewDidAppear:(BOOL)animated
seems to be the best spot. However, if I seque to a different view, when I return to this view the buttons will have reverted to their initial (storybaord constraint) specified positions. The viewDidAppear code will get called again but it does not succeed at moving the buttons. It is as if their positions are locked at that point in time.
I guess my primary question is if there is a way to use constraints to achieve the even spacing I am after. Or secondary question is how to override the auto positioning of those two buttons.

Answer 1

This is a relatively hard thing to do using layout constraints, and it depends on exactly what you want. I have an example here that creates 4 buttons (in code) along with 5 labels that are used as spacers between the buttons. The buttons' sizes are determined by their intrinsic content size, and the spacing among the buttons and between the buttons and the sides of the containing view are all the same.
-(void)viewDidLoad {
[super viewDidLoad];
NSMutableDictionary *viewsDict = [NSMutableDictionary dictionary];
NSArray *titles = #[#"Short",#"Longer",#"Short",#"The Longest"];
for (int i=1; i<5; i++) {
UIButton *b = [UIButton buttonWithType:1];
[b setTitle:titles[i-1] forState:UIControlStateNormal];
[b setTranslatesAutoresizingMaskIntoConstraints:NO];
[viewsDict setObject:b forKey:[NSString stringWithFormat:#"b%d",i]];
}
for (int i=1; i<6; i++) {
UILabel *l = [[UILabel alloc ]init];
[l setTranslatesAutoresizingMaskIntoConstraints:NO];
[viewsDict setObject:l forKey:[NSString stringWithFormat:#"l%d",i]];
}
for (id obj in viewsDict.allKeys)
[self.view addSubview:viewsDict[obj]];
NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:#"|[l1][b1][l2(==l1)][b2][l3(==l1)][b3][l4(==l1)][b4][l5(==l1)]|"
options:NSLayoutFormatAlignAllBaseline
metrics:nil
views:viewsDict];
NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:#"V:[b1]-|"
options:0
metrics:nil
views:viewsDict];
[self.view addConstraints:constraints];
[self.view addConstraints:constraints2];
}
The spacing of the buttons will automatically adjust when the view size changes, as on a rotation.

Answer 2

The solution I was led to is to programmatically add constraints to the two middle buttons (button2 & button3) that position them horizontally relative to the middle of the view. These two constraints allowed me to completely remove the manual positioning code. The answer to Evenly space multiple views within a container view helped get me on the right track.
- (void)viewDidLoad
{
...
self.button2.translatesAutoresizingMaskIntoConstraints = NO;
self.button3.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.button2 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual
toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:0.667 constant:0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.button3 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual
toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1.333 constant:0]];

Answer 3

For almost any case of layout problem use layoutSubviews method, it's the place to do it.