How to optimise code written in VFL autolayout

Question

I have a UIView in which i create UILabels without for loop and using VFL. It's working perfect, but code readability is very bad.even i dont understand how do i use for loop for creating these labels. I have to set height to 30 which i don't want. I want it to grow automatically. Moreover i am setting subcontentView height constant to hardcoded constantHeightSubContentView.constant = 250; I don't want to use UIStackView. This is my code which i have tried:

-(void)createProfileView{

if (ProfileView == nil) {
    ProfileView = [[UIView alloc] init];
    [ProfileView setTranslatesAutoresizingMaskIntoConstraints:NO];
    [ProfileView setBackgroundColor:[UIColor yellowColor]];
    [subContentView addSubview:ProfileView];
    views[@"ProfileView"] = ProfileView;

    NSArray* constraints;
    NSString* format;

    format = @"|[ProfileView]|";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [subContentView addConstraints:constraints];

    format = @"V:|-50-[ProfileView]|";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [subContentView addConstraints:constraints];

    //create labels
    //homeTown
    UILabel *lblHomeTown = [self getLabel];
    [lblHomeTown setBackgroundColor:[UIColor greenColor]];
    [lblHomeTown setText:@"Hometown:"];
    [ProfileView addSubview:lblHomeTown];
    views[@"lblHomeTown"] = lblHomeTown;

    UILabel *lblHomeTownDetail = [self getLabel];
    [lblHomeTownDetail setBackgroundColor:[UIColor grayColor]];
    [lblHomeTownDetail setText:self.player.homeTown];
    [ProfileView addSubview:lblHomeTownDetail];
    views[@"lblHomeTownDetail"] = lblHomeTownDetail;

    format = @"|-10-[lblHomeTown]-2-[lblHomeTownDetail]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:[lblHomeTown(30)]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:|[lblHomeTownDetail(30)]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];
    //hometown

    //highSchool
    //create labels
    UILabel *lblHighSchool = [self getLabel];
    [lblHighSchool setBackgroundColor:[UIColor magentaColor]];
    [lblHighSchool setText:@"High School:"];
    [ProfileView addSubview:lblHighSchool];
    views[@"lblHighSchool"] = lblHighSchool;

    UILabel *lblHighSchoolDetail = [self getLabel];
    [lblHighSchoolDetail setBackgroundColor:[UIColor redColor]];
    [lblHighSchoolDetail setText:self.player.highSchool];
    [ProfileView addSubview:lblHighSchoolDetail];
    views[@"lblHighSchoolDetail"] = lblHighSchoolDetail;

    format = @"|-10-[lblHighSchool]-2-[lblHighSchoolDetail]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:|[lblHomeTown(30)]-10-[lblHighSchool(30)]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:|[lblHomeTown(30)]-10-[lblHighSchoolDetail(30)]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];
    //highschool


    //experience
    UILabel *lblExperience = [self getLabel];
    [lblExperience setText:@"Experience:"];
    [ProfileView addSubview:lblExperience];
    views[@"lblExperience"] = lblExperience;

    UILabel *lblExperienceDetail = [self getLabel];
    [lblExperienceDetail setText:self.player.experience];
    [ProfileView addSubview:lblExperienceDetail];
    views[@"lblExperienceDetail"] = lblExperienceDetail;

    format = @"|-10-[lblExperience]-2-[lblExperienceDetail]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:[lblHighSchool(30)]-10-[lblExperience(30)]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:[lblHighSchool(30)]-10-[lblExperienceDetail(30)]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];
     //experience

    //description
    UILabel *lblDescription = [self getLabel];
    [lblDescription setText:self.player.playerDescription];
    [ProfileView addSubview:lblDescription];
    views[@"lblDescription"] = lblDescription;

    format = @"|-10-[lblDescription]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    format = @"V:[lblExperience(30)]-10-[lblDescription]";
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:format options:0 metrics:nil views:views];
    [ProfileView addConstraints:constraints];

    //description
}
constantHeightSubContentView.constant = 250;
[subContentView bringSubviewToFront:ProfileView];

}

-(UILabel *)getLabel{

UILabel *lbl = [[UILabel alloc] init];
[lbl setTranslatesAutoresizingMaskIntoConstraints:NO];
[lbl setBackgroundColor:[UIColor clearColor]];
[lbl setNumberOfLines:0];
[lbl setTextColor:[UIColor blackColor]];
[lbl setFont:[UIFont fontWithName:@"AppleSDGothicNeo-Regular" size:13.0f]];
lbl.lineBreakMode = NSLineBreakByWordWrapping;
return lbl;

}

Have you considered subclassing UIView? That would cleanup your code and allow you to structure the code better. — Peter Hornsby, Dec 29 '15 at 14:56
yup that the first thing currently i am doing. I am also creating a row view (UIView Subclass which will have two Labels horizontally seperated). Then i will use for loop to draw 3/n rows ( row view) vertically.Still my question remains same how can i create three or n views vertically using for loop and VFL or last priority "constraintWithItem" way — maddy, Dec 29 '15 at 15:04

score 0 · Answer 1 · edited May 23 '17 at 11:44

0

Amazing answer https://stackoverflow.com/a/25898949/1612489, only thing is you will have to use VFL to specify the multiplier values instead of interface builder as shown in the answer. But that should be easy once you understand the logic used.

edited May 23 '17 at 11:44

Community

1
1

answered Dec 29 '15 at 15:19

Sumeet

1,055
8
18

How to optimise code written in VFL autolayout

1 Answers1