just as a background, this question is related to this one I posted earlier: Trying to expand/collapse UITableViewCell from a UIButton on the custom cell
To summarize, I have a UITableView with several custom table cells. Each custom UITableViewCell has a text area, followed by a "View More" button. Essentially, each cell will initially display 3 lines of text, but when the user taps the "View More" button, the cell should expand to the entire text area height. Tapping the button again will collapse the cell.
I think this is difficult to visualize, so I have taken a short video here: http://dl.dropbox.com/u/762437/cell-animation.mov
(it's about a 3.5mb file, so shouldnt take that long to load). In the video, I show a cell doing the expand/collapse animation. When doing the expanding, the "View More" button animates downward. When tapping it again, it just jumps back up to its original position with no animation. Edit: Sorry, I should be more clear. The UITableView is animating the cells correctly, what I am asking is how to make the "View More" button animate correctly.
I've got the expand/collapse working (whether I did it right or wrong is another matter!), but the animations arent working as I expect. The expanding animation works, but not the collapsing.
In each custom UITableViewCell class, I have a IBAction that is called when the user taps the "View More" button. I also keep track of the cells that are currently expanded in a NSMutableArray. When the user taps the "Close" button, that cell is removed from the array.
In my tableView's cellForRowAtIndexPath, I check the array to see which cells should be expanded and which should show at their default size.
I am doing so with this code:
// Check if the array contains the particular cell, if so, then it needs to be expanded
if([expandedRows containsObject:indexPath])
{
// Expand the cell's text area to fit the entire contents
[cell.textLabel sizeToFitFixedWidth:cell.textLabel.frame.size.width];
// Find the new Y-position of where the "Close" button.
// The new Y position should be at the bottom of the newly expanded text label
CGFloat bottomYPos = cell.textLabel.frame.origin.y + cell.textLabel.frame.size.height;
// Get a rect with the "Close" button's frame and new Y position
CGRect buttonRect = cell.showAllButton.frame;
buttonRect.origin.y = bottomYPos;
// Animation block to shift the "Close" button down to its new rect
[UIView animateWithDuration:0.3
delay:0.0
options: UIViewAnimationCurveLinear
animations:^{
cell.showAllButton.frame = buttonRect;
[cell.showAllButton setTitle:@"Close" forState:UIControlStateNormal];
}
completion:^(BOOL finished){
NSLog(@"Done 1!");
}];
}
else
{
// This cell is currently collapsed
// Get the button rect and subtract the height delta to put it back
// OriginalCellSizes is where I keep track of the original Y positions
CGRect buttonRect = cell.showAllButton.frame;
buttonRect.origin.y -= cell.frame.size.height - [[originalCellSizes objectAtIndex:indexPath.row] floatValue];
// Animation block for the Button
[UIView animateWithDuration:0.3
delay:0.0
options: UIViewAnimationCurveEaseOut
animations:^{
cell.showAllButton.frame = buttonRect;
[cell.showAllButton setTitle:@"View More" forState:UIControlStateNormal];
}
completion:^(BOOL finished){
NSLog(@"Done! 2");
}];
}
Upon investigating, I found that in the "else" branch of that if-else, the buttonRect is already at the same Y position as the original position. I suspect that this is why there is no animation happening, bu I'm not sure.
Any help would be really great!