CODEWITHSUNDEEP
iphonedynamicuitableviewvariablesuibutton
alan
alan

Reputation: 187

Adding buttons dynamically to a uitableviewcell - iPhone app

I have a verb conjugation app that displays verb translations in the first cell of a table. At present the translation list is just a string (comma-separated list) but I'd like to change it to have clickable buttons. I had a play around adding buttons to the cell view without too much success but my only experience with custom cells has been using specific positioning so I'm unsure as to how to achieve a dynamic list of buttons (varying widths) within a cell.

Any help greatly appreciated.

Cheers.

Upvotes: 5

Views: 27063

Answers (4)

srinivas
srinivas

Reputation: 5108

You can do this inside the viewcontroller cellForRowAtIndexPath function:

var btn = UIButton(frame: CGRectMake(100, 100, 100, 20));
    btn.setTitleColor(UIColor.blackColor(), forState: UIControlState.Normal);
    btn.setTitle("My Button", forState:UIControlState.Normal);
    btn.addTarget(self, action: "buttonTapped:", forControlEvents: UIControlEvents.TouchUpInside);

    //add the buttons to the cell
    cell.contentView.addSubview(btn)

Add another function in the same class which will receive the button tapped event

func buttonTapped(sender: UIButton!)
{
    println("Button Tapped")
}

Upvotes: 0

iamMobile
iamMobile

Reputation: 969

Do following

-(CGRect)placeAButton:(NSString*)textFromField withCell:(UITableViewCell*)cell
{
    CGSize      theSize;
    CGSize      constraintSize;

    // Create a button and add as subview to cell
    // Get coordinates to place the button

    UIButton *button    = [[UIButton buttonWithType:UIButtonTypeRoundedRect] retain];

    button.titleLabel.font              = [UIFont systemFontOfSize:MEDIUM_FONT_SIZE];;
    button.titleLabel.lineBreakMode     = UILineBreakModeTailTruncation;
    button.contentVerticalAlignment     = UIControlContentVerticalAlignmentCenter;
    button.contentHorizontalAlignment   = UIControlContentHorizontalAlignmentCenter;

    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [button setTitle:textFromField forState:UIControlStateNormal];

    UIImage *buttonBkground;
    buttonBkground = [UIImage imageNamed:@"blueButton.png"];
    UIImage *newImage = [buttonBkground stretchableImageWithLeftCapWidth:12.0 topCapHeight:0.0];
    [button setBackgroundImage:newImage forState:UIControlStateNormal];
    [button addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
    [cell.contentView addSubview:button];

[self.tableView reloadData]
}

You'll have to take care of cell width, height etc while creating buttons dynamically.

Upvotes: 4

alan
alan

Reputation: 187

I just did this for my new iPad app so I thought I'd paste the code.

// NOTE - This is within a loop     
// Add the translation as a button
    UIButton *translationButton = [[UIButton buttonWithType:UIButtonTypeRoundedRect] retain];
    translationButton.backgroundColor = [UIColor clearColor];
    translationButton.titleLabel.font = [UIFont boldSystemFontOfSize:16];
    [translationButton setTitle:translation forState:UIControlStateNormal];
    [translationButton addTarget:self action:@selector(translationSearch:) forControlEvents:UIControlEventTouchUpInside];
    // Work out required size
    fontSize = [translationButton.titleLabel.text sizeWithFont:translationButton.titleLabel.font];      
    CGRect buttonFrame = CGRectMake(xOffset, 15, fontSize.width + 20.0, 24);
    [translationButton setFrame:buttonFrame];

    // Now set the new x Offset
    xOffset = buttonFrame.origin.x + buttonFrame.size.width + 6.0;

    [verbView addSubview:translationButton];

Cheers.

Upvotes: 4

Alex Reynolds
Alex Reynolds

Reputation: 96994

Make a UIView object. Set your UIButton objects as subviews of this parent view.

Once you have that, you can add this parent view to the cell's contentView property.

In the -tableView:cellForRowAtIndexPath: delegate method, you would generate the parent view (and the number and type of buttons inside) based on some conditional state, before adding it to the cell's contentView.

As for doing this programmatically, as soon as some condition changes, run [tableView reloadData] or similar methods to refresh the table view and its cells.

Upvotes: 3

Related Questions