Objective C-Programmatically insert the title of UIButton, change the background and title color when selected

Question

Currently, I programatically created 7 buttons inside a UIView. I added two lines of UIlabel to the UIButton. I created another UIView as a selector and whenever the button is clicked, I will moved the selector to the location of the button. The problem is the selector UIView is another layer on top of the buttons and the color is mixed or distorted.

What I have and partly trying to acheive

What I am trying to acheive

To programatically insert 2 lines of title to the buttons and change the background color of the button when it is selected.

Code

-(void)setupSegmentButtons{
    CGFloat Y_POS_BTN = [[UIApplication sharedApplication] statusBarFrame].size.height+5;

    //=== The view where the buttons sits
    navigationView = [[UIView alloc]initWithFrame:CGRectMake(X_BUFFER,Y_POS_BTN,self.view.frame.size.width,HEIGHT_BTN)];
    navigationView.backgroundColor = [UIColor whiteColor];

    [self.view addSubview:navigationView]; //=== Create a View called navigationView

    //==== Setup the shadows around the view ===
    UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:self.navigationView.bounds];
    self.navigationView.layer.masksToBounds = NO;
    self.navigationView.layer.shadowColor = [UIColor lightGrayColor].CGColor;
    self.navigationView.layer.shadowOffset = CGSizeMake(5.0f, 5.0f);
    self.navigationView.layer.shadowOpacity = 0.8f;
    self.navigationView.layer.shadowPath = shadowPath.CGPath;

    //=== Get the dates and formatting of the dates
    NSDate *now = [NSDate date];
    NSCalendar *calendar = [NSCalendar currentCalendar];
    NSDate *beginningOfThisWeek;
    NSTimeInterval durationOfWeek;

    [calendar rangeOfUnit:NSWeekCalendarUnit
            startDate:&beginningOfThisWeek
             interval:&durationOfWeek
              forDate:now];

    NSDateComponents *comps = [calendar components:NSUIntegerMax fromDate:now];

    NSDateFormatter *dateFormatter=[[NSDateFormatter alloc] init];
    [dateFormatter setDateFormat:@"dd/MM/YYYY"];
    NSDateFormatter *datelblFormat = [[NSDateFormatter alloc] init];
    [datelblFormat setDateFormat:@"dd"];
    NSDateFormatter *daylblFormat= [[NSDateFormatter alloc] init];
    [daylblFormat setDateFormat:@"EEE"];

    //=== Loop 7 times to create the Buttons and the 2 lines Labels
    for (int i = 0; i<numControllers; i++) {
    
        button = [[UIButton alloc]initWithFrame:CGRectMake(i*  (self.navigationView.frame.size.width/numControllers), Y_BUFFER,  (self.navigationView.frame.size.width/numControllers),HEIGHT_BTN)];

        [navigationView addSubview:button]; //=== Put the buttons into the navigation View
    
        NSString *dateString = [dateFormatter stringFromDate:[calendar dateFromComponents:comps]];
        [dtDate addObject:dateString];
    
        NSString *lblDate = [datelblFormat stringFromDate:[calendar dateFromComponents:comps]];
    
        firstLineButton = [[UILabel alloc] initWithFrame:CGRectMake(0,5,self.view.frame.size.width/numControllers,HEIGHT_LABEL)];
    
        firstLineButton.text = lblDate;
        firstLineButton.font = [UIFont systemFontOfSize:20];
        firstLineButton.textColor = [UIColor whiteColor];
        firstLineButton.textAlignment=NSTextAlignmentCenter;
        [button addSubview:firstLineButton]; //=== Put the Date in the 1st line of the the button
    
        NSString *lblDay = [daylblFormat stringFromDate:[calendar dateFromComponents:comps]];
    
        UILabel *secondLineButton = [[UILabel alloc] initWithFrame:CGRectMake(0,28,self.view.frame.size.width/numControllers,HEIGHT_LABEL2)];
        secondLineButton.text = lblDay;
        secondLineButton.textColor = [UIColor whiteColor];
        secondLineButton.font = [UIFont boldSystemFontOfSize:11];
        secondLineButton.textAlignment=NSTextAlignmentCenter;
        [button addSubview:secondLineButton]; //=== Put the Day in the 2nd line of the Button
    
        if(i < 6){
            UIView *separator = [[UIView alloc] initWithFrame:CGRectMake(button.frame.size.width - 1, 10, 1, button.frame.size.height - 25)];
            separator.backgroundColor = UIColor.whiteColor;
            [button addSubview:separator];
        }
    
        button.tag = i; //--- IMPORTANT: if you make your own custom buttons, you have to tag them appropriately
    
        button.backgroundColor = [UIColor colorWithRed:236.0f/255.0f green:0/255.0f blue:140.0f/255.0f alpha:0.6];//%%% buttoncolors
    
        [button addTarget:self action:@selector(tapSegmentButtonAction:) forControlEvents:UIControlEventTouchUpInside];
    
        ++comps.day;
    }

    //NSLog(@" The array %@", dtDate);

    [self setupSelector]; //=== The selection bar or highligthed area
}

//=== sets up the selection bar under the buttons or the highligted buttons on the navigation bar
-(void)setupSelector {

    selectionBar = [[UIView alloc]initWithFrame:CGRectMake(0, 0, (self.view.frame.size.width/numControllers),HEIGHT_BTN)];
    selectionBar.backgroundColor = [UIColor colorWithRed:1.0f/255.0f green:179.0/255.0f blue:242.0f/255.0f alpha:0.6]; //%%% sbcolor
    [navigationView addSubview:selectionBar];
}

//=== When the top button is tapped
 -(void)tapSegmentButtonAction:(UIButton *)button {

     sDtDate = dtDate[button.tag];

     [self LoadClasses];
 
     __weak typeof(self) weakSelf = self;
     [weakSelf updateCurrentPageIndex:button.tag];

     NSInteger xCoor = selectionBar.frame.size.width*self.currentPageIndex;

     selectionBar.frame = CGRectMake(xCoor, selectionBar.frame.origin.y, selectionBar.frame.size.width, selectionBar.frame.size.height);
}

//=== makes sure the nav bar is always aware of what date page you're at in   reference to the array of view controllers you gave
-(void)updateCurrentPageIndex:(int)newIndex {

    self.currentPageIndex = newIndex;
}

I didn't get your problem yet. My advice is to subclass the UIButton to get a cleaner solution. Then hold the current active button as a reference in your viewController. When another button is selected you have to set the background color of the activeButton to the default color an the color of the selected button to the active color. — Gulliva, Sep 06 '18 at 08:13

score 0 · Answer 1 · answered Sep 05 '18 at 13:21

0

I think you do not need to use a secondary button or additional labels. You can do all the stuff with button itself. Following may help you by converting it to Objective-C:

Swift - UIButton with two lines of text

answered Sep 05 '18 at 13:21

Dogan Altinbas

268
2
11

score 0 · Answer 2 · answered Sep 07 '18 at 08:22

You can use a custom button which inherit from UIButton with two labels and rewrite it's setSelected: method,for example:

#import "MyButton.h"

@interface MyButton ()

@property (nonatomic, strong) UILabel *mainTitleLabel;
@property (nonatomic, strong) UILabel *subTitleLabel;

@end

@implementation MyButton

- (instancetype)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        self.mainTitleLabel = [[UILabel alloc] init];
        self.subTitleLabel = [[UILabel alloc] init];
        // other setting
    }
    return self;
}

- (void)setSelected:(BOOL)selected {
    [super setSelected:selected];

    if (selected) {
        self.backgroundColor = [UIColor whiteColor];
        self.mainTitleLabel.textColor = [UIColor redColor];
        self.subTitleLabel.textColor = [UIColor redColor];
    } else {
        self.backgroundColor = [UIColor blueColor];
        self.mainTitleLabel.textColor = [UIColor orangeColor];
        self.subTitleLabel.textColor = [UIColor orangeColor];
    }
}

@end

Objective C-Programmatically insert the title of UIButton, change the background and title color when selected

What I have and partly trying to acheive

What I am trying to acheive

Code

2 Answers2