Autolayout – Position by Percentage

Yes, you can position the dot as a fraction of the view’s width. The NSLayoutConstraint method, constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant:, has that multiplier parameter that lets you use a fractional relationship between a superview and its subview. The superview’s right edge will be the width of that view (the screen if its a full width view), so if you create a constraint like below, the dot will be positioned at a fractional distance along the line:

-(void)viewDidLoad {
      [super viewDidLoad];
      [self.view removeConstraint:self.leftConDark];
      [self.view removeConstraint:self.leftConLight];
      NSLayoutConstraint *lcd = [NSLayoutConstraint constraintWithItem:self.darkButton 
                                                             attribute:NSLayoutAttributeCenterX 
                                                             relatedBy:NSLayoutRelationEqual 
                                                                toItem:self.view 
                                                             attribute:NSLayoutAttributeRight 
                                                            multiplier:.5 
                                                              constant:0];
      NSLayoutConstraint *lcl = [NSLayoutConstraint constraintWithItem:self.lightButton 
                                                             attribute:NSLayoutAttributeCenterX 
                                                             relatedBy:NSLayoutRelationEqual 
                                                                toItem:self.view 
                                                             attribute:NSLayoutAttributeRight 
                                                            multiplier:.9 
                                                              constant:0];
      [self.view addConstraints:@[lcd,lcl]];
}

In this example I’m positioning two UIButtons (info type dark and light). I added them in IB, and made IBOutlets to their constraints they have to the left side of the view (that’s what the system gave me, it could have been to the right side — it doesn’t matter since you just delete them anyway. If you are making the dots in code, you wouldn’t need to do this). In code I remove those constraints, then add new ones that will put the center of the buttons at 50% and 90% of the way across the screen.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)