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