How to create multiple UIButtons from a for loop

| | August 10, 2015

I am trying to create a vertical list of UIbuttons. I have managed to create one UIButton in the top left corner of the screen using the following code:

-(void)didMoveToView:(SKView *)view {

UIButton * btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
btn.frame = CGRectMake(0, 0, 100, 50);
[btn setTitle:@"Hello, world!" forState:UIControlStateNormal];
[self.view addSubview:btn];

}

However when I try to increase the number the number of buttons and place them in the middle of the screen they don’t appear. The code I am attempting to use is as follows:

-(void)didMoveToView:(SKView *)view {
/* Setup your scene here */
map = [SKNode node];
midScreenX = CGRectGetMidX(self.frame);
midScreenY = CGRectGetMidY(self.frame);

UIButton * btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
btn.frame = CGRectMake(0, 0, 100, 50);
[btn setTitle:@"Hello, world!" forState:UIControlStateNormal];
[self.view addSubview:btn];

for (int i = 0; i<numberOfLevels; i += 1) {

    UIButton * btn2 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    btn2.frame = CGRectMake(midScreenX, midScreenY + separation*i, 100, 50);
    [btn2 setTitle:@"Hello, world!" forState:UIControlStateNormal];
    [self.view addSubview:btn2];

}

}

I defined the variables separation and numberOfLevels outside the method with global scope as being 160 and 20 respectively.

When I use the second code, nothing changes compared to when I am using the first code.

I am very new to objective c and am probably making a very simple error. These buttons will obviously go off the top of the screen, increased thanks go to anyone who can tell me how to create a scroll effect so that I can move around the buttons. At the moment I am using very rudimentary code for that which just moves the screen around compared to where it is being touched. I imagine there are more elegant ways of doing it given its prevalence in apps.

Thanks in advance for your help.

3 Responses to “How to create multiple UIButtons from a for loop”

  1. Candost Dagdeviren on November 30, -0001 @ 12:00 AM

    Using Autolayout, you can checkout this code.

        UIButton *previousButton = nil;
    
        for (NSInteger i = 0; i<numberOfLevels; i++)
        {
            UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    
            [self.view addSubview:btn];
    
            if (i == 0)
            {
                [btn addConstraint:[NSLayoutConstraint constraintWithItem:btn attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTopMargin multiplier:1 constant:seperation]];
            }
            else
            {
                [btn addConstraint:[NSLayoutConstraint constraintWithItem:btn attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:previousButton attribute:NSLayoutAttributeTop multiplier:1 constant:seperation]];
            }
    
            [btn addConstraint:[NSLayoutConstraint constraintWithItem:btn attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1 constant:seperation]];
            [btn addConstraint:[NSLayoutConstraint constraintWithItem:btn attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTrailing multiplier:1 constant:seperation]];
    
            [btn addConstraint:[NSLayoutConstraint constraintWithItem:btn attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeHeight multiplier:1 constant:50]];
    
            previousButton = btn;
        }
    
  2. your code is relatively correct, except the quite big value of separation and numberOfLevels
    for i.e. iPhone 5/5s (with 568pt screen height you should see only one button on the top left corner and two btns below the middle.

    this is how your screen should looks like

    this is how your screen should looks like, so the problem lies somewhere outside

    to debug your views in runtime you could use small but very useful button in Xcode

    enter image description here

    more about this:
    https://developer.apple.com/library/ios/recipes/xcode_help-debugger/using_view_debugger/using_view_debugger.html

  3. You can check this if it works:

    for (int i = 0; i<numberOfLevels; i += 1) {
        UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
        [btn setTag:i];
        btn.frame = CGRectMake(midScreenX, midScreenY + separation*i, 100, 50);
        [btn setTitle:@"Hello, world!" forState:UIControlStateNormal];
        [btn addTarget:self action:@selector(buttonClicked:)forControlEvents:UIControlEventTouchUpInside];
        [self.view addSubview:btn];
    }
    
    
    
    - (void)buttonClicked:(UIButton*)button
    {
        NSLog(@"Button %ld clicked.", (long int)[button tag]);
    }
    

Leave a Reply