How to use constraints Programmatically? [closed]

问题

Closed. This question needs to be more focused. It is not currently accepting answers.

---

Want to improve this question? Update the question so it focuses on one problem only by editing this post.

Closed 3 years ago.

I am working on application which will work only horizontally and doing everything programmatically.

I am having a imageview, two textfield and two buttons but I don't know how to set constraints on these textfields and buttons, means when I am using in iPhone 5s then it is fine but when I am using iPhone 6s plus then it looks small. I am posting here some code and screenshots

UIImageView *logoImage = [[UIImageView alloc]init];
    logoImage.frame = CGRectMake(CGRectGetMidX(self.view.frame)-100, 10, 250, 100);
    [logoImage setImage:[UIImage imageNamed:@"antya_logo1.png"]];

    [self.view addSubview:logoImage];

    UILabel *loginLabel = [[UILabel alloc]init];
    loginLabel.frame = CGRectMake(10, 0, 100, 40);
    loginLabel.text = @"Login Form";
    loginLabel.textColor = [UIColor blackColor];
    loginLabel.font = [UIFont fontWithName:@"LaoSangamMN" size:18];


    CGFloat Xuser = CGRectGetMidX(self.view.frame)-120;
    CGFloat Yuser = CGRectGetMaxY(loginLabel.frame)+80;

    usernameField = [[UITextField alloc]init];
    usernameField.frame = CGRectMake(Xuser, Yuser, 300, 35);
    usernameField.placeholder = @"  User Name";
    usernameField.font = [UIFont fontWithName:@"LaoSangamMN" size:18];
    usernameField.backgroundColor = [UIColor whiteColor];
    usernameField.layer.cornerRadius = 7;
    usernameField.layer.borderWidth = 0.5;

    [self.view addSubview:usernameField];

    UIImageView *userImgV = [[UIImageView alloc]init];
    userImgV.frame = CGRectMake(CGRectGetMinX(usernameField.frame)-35, CGRectGetMinY(usernameField.frame)+5, 25, 25);
    [userImgV setImage:[UIImage imageNamed:@"user-icon.png"]];

    [self.view addSubview:userImgV];

    CGFloat Ypass = CGRectGetMaxY(usernameField.frame)+20;

    passwordField = [[UITextField alloc]init];
    passwordField.frame = CGRectMake(Xuser, Ypass, 300, 35);
    passwordField.placeholder = @"  Password";
    passwordField.secureTextEntry = YES;
    passwordField.font = [UIFont fontWithName:@"LaoSangamMN" size:18];
    passwordField.backgroundColor = [UIColor whiteColor];
    passwordField.layer.cornerRadius = 7;
    passwordField.layer.borderWidth = 0.5;


    [self.view addSubview:passwordField];

this is in i phone 6s plus

and this is in i phone5s

Please help me,thanks in advance

回答1:

Note : When you are dealing with autolayout setting frame of a view is not going to work. You need to set constraints for that view to look correctly in all iPhone devices.

UIImageView *logoImage = [[UIImageView alloc] init];
[logoImage setImage:[UIImage imageNamed:@"antya_logo1.png"]];
logoImage.translatesAutoresizingMaskIntoConstraints = false;

[self.view addSubview:logoImage];

UILabel *loginLabel = [[UILabel alloc]init];
loginLabel.text = @"Login Form";
loginLabel.textColor = [UIColor blackColor];
loginLabel.font = [UIFont fontWithName:@"LaoSangamMN" size:18];
loginLabel.translatesAutoresizingMaskIntoConstraints = false;

[self.view addSubview:loginLabel];

UITextField *usernameField = [[UITextField alloc]init];
usernameField.placeholder = @"  User Name";
usernameField.font = [UIFont fontWithName:@"LaoSangamMN" size:18];
usernameField.backgroundColor = [UIColor whiteColor];
usernameField.layer.cornerRadius = 7;
usernameField.layer.borderWidth = 0.5;
usernameField.translatesAutoresizingMaskIntoConstraints = false;

UIImageView *userImgV = [[UIImageView alloc]init];
[userImgV setImage:[UIImage imageNamed:@"user-icon.png"]];

//set left view of textfield
usernameField.leftView = userImgV;
usernameField.leftViewMode = UITextFieldViewModeAlways;
[self.view addSubview:usernameField];


UITextField *passwordField = [[UITextField alloc]init];
passwordField.placeholder = @"  Password";
passwordField.secureTextEntry = YES;
passwordField.font = [UIFont fontWithName:@"LaoSangamMN" size:18];
passwordField.backgroundColor = [UIColor whiteColor];
passwordField.layer.cornerRadius = 7;
passwordField.layer.borderWidth = 0.5;
passwordField.translatesAutoresizingMaskIntoConstraints = false;

//set left view of textfield

UIImageView *passwordImgV = [[UIImageView alloc]init];
[passwordImgV setImage:[UIImage imageNamed:@"password-icon.png"]];

passwordField.leftView = passwordImgV;
passwordField.leftViewMode = UITextFieldViewModeAlways;
[self.view addSubview:passwordField];


UIButton *buttonSignUp = [UIButton buttonWithType:UIButtonTypeCustom];
[buttonSignUp setTag:101];
[buttonSignUp setTitle:@"SIGNUP" forState:UIControlStateNormal];
[buttonSignUp addTarget:self action:@selector(<your selector>) forControlEvents:UIControlEventTouchUpInside];
buttonSignUp.translatesAutoresizingMaskIntoConstraints = false;
[self.view addSubview:buttonSignUp];

UIButton *buttonFP = [UIButton buttonWithType:UIButtonTypeCustom];
[buttonFP setTag:101];
[buttonFP setTitle:@"SIGNUP" forState:UIControlStateNormal];
[buttonFP addTarget:self action:@selector(<your selector>) forControlEvents:UIControlEventTouchUpInside];
buttonFP.translatesAutoresizingMaskIntoConstraints = false;
[self.view addSubview:buttonFP];

//setting constraints

//logoImage
//leading
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:logoImage attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0 constant:10]];

//Top
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:logoImage attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0 constant:10]];

//traling
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:logoImage attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:10]];


// usernameField
//leading
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:usernameField attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0 constant:10]];

//traling
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:usernameField attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:10]];

//top
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:logoImage attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:usernameField attribute:NSLayoutAttributeTop multiplier:1.0 constant:10]];

//passwordField
//leading
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:passwordField attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0 constant:10]];

//traling
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:passwordField attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:10]];

//top
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:passwordField attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:passwordField attribute:NSLayoutAttributeTop multiplier:1.0 constant:10]];


//buttonSignUp and buttonFP

//leading for buttonSignUp
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:buttonSignUp attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0 constant:10]];

//traling for buttonFP
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:buttonFP attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:10]];

//equal width for both
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:buttonFP attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:buttonSignUp attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0]];

//space between both btns
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:buttonFP attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:buttonSignUp attribute:NSLayoutAttributeRight multiplier:1.0 constant:10]];

//top for both
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:buttonSignUp attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:passwordField attribute:NSLayoutAttributeTop multiplier:1.0 constant:10]];

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:buttonFP attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:passwordField attribute:NSLayoutAttributeTop multiplier:1.0 constant:10]];

//bottom
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:buttonFP attribute:NSLayoutAttributeBottom multiplier:1.0 constant:10]];

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:buttonSignUp attribute:NSLayoutAttributeBottom multiplier:1.0 constant:10]];

回答2:

After adding @IBOutlet each of items on ViewController. You can use Auto Layout Visual Format Language to implement programmatically constraints. Here's sample code to understand from my project.

(Swift Version) If cell awakeFromNib or or page you can use in viewDidLoad:

    avaImg.translatesAutoresizingMaskIntoConstraints = false
    usernameBtn.translatesAutoresizingMaskIntoConstraints = false
    infoLbl.translatesAutoresizingMaskIntoConstraints = false
    dateLbl.translatesAutoresizingMaskIntoConstraints = false

    self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
        "H:|-10-[ava(30)]-10-[username]-7-[info]-10-[date]",
        options: [], metrics: nil, views: ["ava":avaImg, "username":usernameBtn, "info":infoLbl, "date":dateLbl]))

    self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
        "V:|-10-[ava(30)]-10-|",
        options: [], metrics: nil, views: ["ava":avaImg]))

    self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
        "V:|-10-[username(30)]",
        options: [], metrics: nil, views: ["username":usernameBtn]))

    self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
        "V:|-10-[info(30)]"
        , options: [], metrics: nil, views: ["info":infoLbl]))

    self.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
        "V:|-10-[date(30)]",
        options: [], metrics: nil, views: ["date":dateLbl]))

Additional link cited before Using Autolayout Visual Format with Swift?

(Objective-C Version) You can find here many details to do same.

来源：https://stackoverflow.com/questions/36326288/how-to-use-constraints-programmatically