Custom UIButton for Iphone

Question

I have an view in my App which has a number of buttons based on the number of items returned by the server. So if the server returns say 10 items, there should be 10 buttons and clicking on each button should call a different person.

For the above purpose I created a custom button class deriving from UIButton.

@implementation HopitalButton

@synthesize index;
@synthesize button_type;

- (id)initWithFrame:(CGRect)frame {

    if (self = [super initWithFrame:frame]) {
        UIImage* img = [UIImage imageNamed:@"dr_btn.png"];
        [img stretchableImageWithLeftCapWidth:10 topCapHeight:10];
        [self setBackgroundImage:img forState:UIControlStateNormal];
        [self setTitleColor:[UIColor colorWithRed:0.698 green:0.118 blue:0.376 alpha:1] forState:UIControlStateNormal] ;
        [self setFont:[UIFont fontWithName:@"Helvetica Bold" size:13]];
        self.titleLabel.textColor = [UIColor colorWithRed:178 green:48 blue:95 alpha:1];
        self.adjustsImageWhenHighlighted = YES;
    }
    return self;
}

- (void)dealloc {
    [super dealloc];
}


@end

Now the problem with the above code is that it does not create buttons that look similar to the buttons created by default in Interface builder. The borders are missing.

And I create buttons of the above type by the following code:

    HopitalButton* hb = [[HopitalButton alloc] init];
    hb.button_type = @"call";
    hb.frame = CGRectMake(50, 50 + i * 67, 220, 40);
    [self.scroll_view addSubview:hb];
    [hb setTitle:[[[self.office_full_list objectAtIndex:i] objectForKey:@"Staff" ]objectForKey:@"FullName"] forState:UIControlStateNormal];
    hb.index = [NSNumber numberWithInt:[self.button_items count]];
    [self.button_items insertObject:hb atIndex:[self.button_items count]];
    [hb addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];

I am not finding a way to set the button type for this custom button. Is there a way i can do it ? Or is there a better way to design the code.

Answer 1

You first start with a stretchable image with a border:

alt text http://grab.by/4lP

Then you make a button with the stretched image as the background and apply text.

INDEX_OFFSET = 82753; // random

UIButton *sampleButton = [UIButton buttonWithType:UIButtonTypeCustom];
[sampleButton setFrame:CGRectMake(kLeftMargin, 10, self.view.bounds.size.width - kLeftMargin - kRightMargin, 52)];
[sampleButton setTitle:@"Button Title" forState:UIControlStateNormal];
[sampleButton setFont:[UIFont boldSystemFontOfSize:20]];
[sampleButton setTag:<INDEX>+INDEX_OFFSET];
[sampleButton setBackgroundImage:[[UIImage imageNamed:@"redButton.png"] stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0] forState:UIControlStateNormal];
[sampleButton addTarget:self action:@selector(buttonPressed) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:sampleButton];

Obviously, you will need to adjust the frame origin and size to match your app, as well as the target, selector, and title. And

Answer 2

[sampleButton setFont:[UIFont boldSystemFontOfSize:20]]; 

setFont is now deprecated, use titleLabel.font property instead

sampleButton.titleLabel.font = [UIFont boldSystemFontOfSize:20];

Answer 3

you can use individual class for custom Roundrect button which can be useful in whole project with your specific frame style as below

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>
@interface CustomRoundRectButton : UIButton
@end


#import "CustomRoundRectButton.h"
@implementation CustomRoundRectButton
- (void)drawRect:(CGRect)rect
{
[[self layer] setMasksToBounds:YES];
[self.layer setCornerRadius:10.0f]; 
[self.layer setBorderColor:[UIColor grayColor].CGColor]; 
[self.layer setBorderWidth:1.0];
}
@end

In this you have to select button type custom and select its class as CustomRoundRectButton.

For Simple custom button we can use as below

-(UIBarButtonItem*)BackButton
{
UIButton*btn =  [UIButton buttonWithType:UIButtonTypeCustom];
[btn setImage:[UIImage imageNamed:@"back.png"] forState:UIControlStateNormal];
[btn setFrame:CGRectMake(0, 0, 30, 30)];
[btn addTarget:self action:@selector(actionBack) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem*barBtn = [[[UIBarButtonItem alloc] initWithCustomView:btn] autorelease];
return barBtn;
}

Answer 4

Shouldn't you be calling initWithFrame: rect instead of:

    HopitalButton* hb = [[HopitalButton alloc] init];