Ankit Kumar Gupta
Ankit Kumar Gupta

Reputation: 4042

Increase height of a cell when textfield in it begins editing

I have a tableview in which a cell contains a textfield and a button. I want to show the area with the button only when the textfield becomes active.

Thus for that time i want to provide a different height so that the textfield is visible only and when textfield becomes active i want to increase the height of the tableviewcell to show the button. Kindly help.

My cell is something like this.

enter image description here

When the textfield is not selected i want it to appear like :

enter image description here

When the textfield is selected i want it to appear like : enter image description here

Its not related to "Using Auto Layout in UITableView for dynamic cell layouts & variable row heights" as i want to determine the height based on the textfield selected.

Upvotes: 1

Views: 1488

Answers (1)

Anoop Nyati
Anoop Nyati

Reputation: 349

So basically you want need to update the particular cell and increase its height. For that you need implement UITextFieldDelegate methods to make sure you get notified when textfield is about go in editing mode.

Also you need to maintain an indexPath of the current cell to increase the height for the particular cell.

@property(nonatomic, strong) NSIndexPath *selectedIndexPath;

Set its initial value to nil

Implement delegate method

- (void)textFieldDidBeginEditing:(UITextField *)textField
{
    UITableViewCell *cell = (UITableViewCell*)textField.superview;
    NSIndexPath *indexPath = [self.tableView indexPathForCell:cell];
    if( indexPath != nil) //Returns nil if cell is not visible
    {
        if( self.selectedIndexPath != nil )
        {
            //We need to reload two cells -  one to hide UIButton of current cell, make visible the new UIButton for which textfield is being currently edited
            NSIndexPath *previousIndexPath = self.selectedIndexPath;
            self.selectedIndexPath = indexPath;
            [self.tableView reloadRowsAtIndexPaths:@[indexPath, previousIndexPath] withRowAnimation:UITableViewRowAnimationNone];
        }
        else
        {
            //Reload the cell to show the button
            self.selectedIndexPath = indexPath;
            [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];
        }
    }
}

Once the cell is reloaded, make sure you update the height using UITableViewDelegate method

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if( self.selectedIndexPath && [indexPath compare:self.selectedIndexPath] == NSOrderedSame)
    {
        return kHeightWithButton; //assuming its some constant defined in the code
    }
    return kHeightWithoutButton;
}

Also depending on how you are handling constraints for your UITableViewCell you may need to invoke updateConstraints method of the cell. A sample code like be

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    CustomTableViewCell *cell; //Assuming the you have some custom class to handle cell
    cell = [tableView dequeueReusableCellWithIdentifier:@"myCell"];

    if( cell == nil )
    {
        cell = [[CustomTableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"myCell"];
        //... code for initialization
        cell.textField.delegate = self; //set the delegate to self so that we get delegate methods
    }

    if( self.selectedIndexPath && [indexPath compare:self.selectedIndexPath] == NSOrderedSame)
    {
        cell.button.hidden = NO;
    }
    else
    {
        cell.button.hidden = YES;
    }
    [cell updateConstraints];//update constraint to adjust the UIButton's visibility and constraints

    //... other code if any

    return cell;
}

Hope it helps!

Upvotes: 2

Related Questions