IOS: Force tableView cell to animate change on tap - ios

I am trying to perform an animation on a cell when the accessory view is tapped. The tapped delegate method is firing and I can get the row to do something--change label, but it is ignoring the animation (or in another case--not even making the change.) How can I get the animation to work properly?
- (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath{
MyCustomCell *cell = [self.tableView cellForRowAtIndexPath:indexPath];
[UIView animateWithDuration:5.0
delay: 5.0
options: UIViewAnimationOptionCurveEaseIn
animations:^{
//NEXT TWO LINES HAVE NO EFFECT ON CELL SO COMMENTED OUT
//cell.nameLabel.text = #"Thank you. FIRST ANIMATE TRY";
// [self.tableView reloadRowsAtIndexPaths:#[indexPath] withRowAnimation:UITableViewRowAnimationFade];
//NEXT THREE LINES CHANGE TEXT BUT WITHOUT ANIMATION
[self.tableView beginUpdates];
cell.nameLabel.text = #"Thank you. Second try!";
[self.tableView endUpdates];
}
completion:^(BOOL finished){
NSLog(#"animation finished");
}];
}
BTW I also tried explicitly dispatching this in the main queue but it had no effect. It should already be in main queue.

First of all, you don't need to call beginUpdates or endUpdates. Second, you can't animate the change of a label's text value.
What you need to is have a label on the cell and initialize the alpha property to 0.0. When accessoryButtonTappedForRowWithIndexPath is called set the alpha property to 1.0 inside of your animation block.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
AwesomeCell *cell = [tableView dequeueReusableCellWithIdentifier:#"Cell" forIndexPath:indexPath];
cell.thankYouLabel.text = #"Thank you";
cell.thankYouLabel.alpha = 0.0;
return cell;
}
- (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath
{
AwesomeCell *cell = [tableView cellForRowAtIndexPath:indexPath];
[UIView animateWithDuration:1.0 animations:^{
cell.thankYouLabel.alpha = 1.0;
}];
}

Related

Insert UITableViewCell With Animation and Scroll to it

My requirement is simple , i just need to add a TableCell with rightRowAnimation and scroll to it. It happens as long as i am with within tableView height , as i cross the height of tableView to add cell further , it adds cell but displays no animation when scrolling to it.
Attached is a simple project with a UITableView for reference , Appreciate your help !!
Sample Project with a simple UItableView and Add Button
Code
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return self.dataArray.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:#"MyCell1"];
BOOL myBool = indexPath.row%2 == 0;
if(myBool){
cell.backgroundColor = [UIColor redColor];
}else{
cell.backgroundColor = [UIColor whiteColor];
}
cell.textLabel.text = [self.dataArray objectAtIndex:indexPath.row];
return cell;
}
-(IBAction)addTapped:(id)sender {
[self.dataArray addObject:#"New Object"];
// [_tableView beginUpdates];
[_tableView insertRowsAtIndexPaths:#[[NSIndexPath indexPathForRow:self.dataArray.count-1 inSection:0]] withRowAnimation:UITableViewRowAnimationRight];
// [_tableView endUpdates];
[_tableView scrollToRowAtIndexPath:[NSIndexPath indexPathForRow:self.dataArray.count-1 inSection:0] atScrollPosition:UITableViewScrollPositionBottom animated:YES];
}
Use bellow method for the animation.
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
cell.alpha = 0;
cell.layer.transform = CATransform3DMakeScale(0.5, 0.5, 0.5);
[UIView animateWithDuration:0.7 animations:^{
cell.alpha = 1;
cell.layer.transform = CATransform3DScale(CATransform3DIdentity, 1, 1, 1);
}];
}
change what ever your requirements
you can try this to animate row put in table.
-(void)viewWillAppear:(BOOL)animated
{
dispatch_async(dispatch_get_main_queue(), ^{
[UIView transitionWithView:yourtablename
duration:5.1f
options:UIViewAnimationOptionTransitionFlipFromTop
animations:^(void) {
[yourtablename reloadData];
} completion:NULL];
});
}
also you can change animation style.

How to scroll top UITextview "on UITableViewCell"

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
..
//this cell is custom cell.
[cell.textview setContentOffset:CGPointZero animated:YES]; //did not work
..
}
////////////////
- (void)tableView:(UITableView *)tableView willDisplayCell:(CustomCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
..
[cell.textview setContentOffset:CGPointZero animated:YES]; //did not work
..
}
all of them not effect. textview scroll was shown bottom.
I got it myself
solution here.
- (void)tableView:(UITableView *)tableView willDisplayCell:(CouponCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
CGPoint bottomOffset = CGPointMake(0, cell.textview.frame.size.height - cell.textview.contentSize.height);
if (cell.textview.contentSize.height >= cell.textview.bounds.size.height) {
[cell.textview setContentOffset:bottomOffset animated:NO];
}else{
[cell.textview setContentOffset: CGPointMake(0,0) animated:NO];
}
}
scrolled positon is set (0,0) by iOS inner...maybe.
so setting minus y values.
thanks for answer.
have a good day all!
Try to use without animation
[cell.textview setContentOffset:CGPointZero]
Or add animation block
[UIView animateWithDuration:0.5 animations:^{
[cell.textview setContentOffset:CGPointZero]
}];
Hope this help
Try with below code:
[cell.textview scrollRangeToVisible:NSMakeRange(0, 0)];
OR
[cell.textview setContentOffset:CGPointZero animated:NO];
This is a hack that works well. In cellForRow you disable textView scrolling. Then in viewDidAppear you find the specific index path that contains the textView and you enable scrolling again. If you want you can delete padding from textView:
NSIndexPath *indexPath = [NSIndexPath indexPathForRow:4 inSection:0];
FileInfoNotesTableViewCell *cell = [self.tableView cellForRowAtIndexPath:indexPath];
cell.notesTextView.scrollEnabled = YES;
//I cut the padding from the textview
cell.notesTextView.textContainerInset = UIEdgeInsetsMake(0, 0, 0, 0);

Animation in TableViewCell at reloading data time

I have UITableViewCell with detailed arrow that points to top or to down.
Than I tap on this cell I want to expand it. So I will reload UITableView and I want to animate rotation ofUIImageView`.
Question - is it possible to animate rotation of UIImageView simultaneously with reloading data in UITableView?
Yes, you can create a table with expandable/contactable cell's, also while expanding you can animate the containers of the cell's.
But, one thing until and unless it is a requirement to reload table, I'll suggest you to reload row with the animations performed simultaneously.
Also as you asked in comment what's the best way to track whether the cell needs to be shown simple or detailed, I think it depends on your requirements, like if you need to show only one cell expanded at a time, then you just keep the index of current expanded cell in the class else if you need to show more than one cell expanded at a time than you can use the data source to keep the information whether the cell needs to be show as simple or detailed. If you do not have the data source then you can do the same by creating a list of cell's index path keeping track of detailed cells.
Programmatically you need to do following things to show simple/ detailed cells-
Note: I have assumed to show only one cell expanded at a time.
1) Create a member variable to keep track of expanded cell.
NSIndexPath *expandedCellIndexPath;
2) Return height for expanded cell(if expanded) otherwise for simple cell
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
if([expandedCellIndexPath compare:indexPath] == NSOrderedSame)
return 100.0f;
return 50.0f;
}
3) Create cell as-
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *cellIdentifier = #"cellId";
CustomCell *customCell = nil;
customCell = (CustomCell *) [tableView dequeueReusableCellWithIdentifier:cellIdentifier];
if(customCell == nil)
{
NSString *nibName = #"CustomCell_iPhone";
customCell = (CustomCell *)[[[NSBundle mainBundle] loadNibNamed:nibName owner:self options:nil] lastObject];
customCell.selectionStyle = UITableViewCellSelectionStyleNone;
}
if([expandedCellIndexPath compare:indexPath] == NSOrderedSame)
{
[customCell.m_arrowImageView setImage:[UIImage imageNamed:DOWN_ARROW_KEY]];
[self showSelectedCellAnimations:customCell];
}
else
{
[customCell.m_arrowImageView setImage:[UIImage imageNamed:UP_ARROW_KEY]];
[self showUnSelectedCellAnimations:customCell];
}
// you can also set default up arrow image and rotate it with down arrow image and vice versa
return customCell;
}
4) Rotate Up/Down arrow image using-
- (void)rotateImage:(UIImageView *)image duration:(NSTimeInterval)duration
curve:(int)curve degrees:(CGFloat)degrees
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:duration];
[UIView setAnimationCurve:curve];
[UIView setAnimationBeginsFromCurrentState:YES];
CGAffineTransform transform =
CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(degrees));
image.transform = transform;
[UIView commitAnimations];
}
5) Call above method as-
[self rotateImage:customCell.m_helpImage duration:0.25
curve:UIViewAnimationCurveEaseIn degrees:0.0];
6) Inside didSelectRowAtIndexPath: set the expandedCellIndexPath to the current index path which needs to be expanded and reload previous expanded row to contract and reload current expandedCellIndexPath row to expand, like-
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
[tableView deselectRowAtIndexPath:indexPath animated:NO];
CustomCell *customCell = nil;
customCell = (CustomCell *)[tableView cellForRowAtIndexPath:indexPath];
NSIndexPath *previousIndexPath = expandedCellIndexPath;
if([expandedCellIndexPath compare:indexPath] != NSOrderedSame)
expandedCellIndexPath = indexPath;
[self.m_tableView reloadRowsAtIndexPaths:#[previousIndexPath]
withRowAnimation:UITableViewRowAnimationFade];
[self.m_tableView reloadRowsAtIndexPaths:#[expandedCellIndexPath]
withRowAnimation:UITableViewRowAnimationFade];
[self.m_tableView scrollToRowAtIndexPath:indexPath
atScrollPosition:UITableViewScrollPositionBottom animated:YES];
}

UITableViewCell expand animation?

I would like to make something like expandable cells. Result I'm trying to achieve is:
Actually I have:
Here is my code:
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
DoctorCell *cell = self.prototypeCell;
DoctorModel *doctor = [self.fetchController objectAtIndexPath:frcIndexPath];
// depending on isActive property I add (or do not add) some content.
[cell cellForDoctor:doctor isActiveCell:[self.activeCellIndexPath isEqual:indexPath]];
[cell setNeedsUpdateConstraints];
[cell setNeedsLayout];
[cell layoutIfNeeded];
CGFloat height = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;
return height + 1;
}
Here is my cell selection method
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
[tableView deselectRowAtIndexPath:indexPath animated:NO];
NSIndexPath *oldIndexPath = self.activeCellIndexPath;
if ([indexPath isEqual:self.activeCellIndexPath]) {
self.activeCellIndexPath = nil;
oldIndexPath = nil;
} else {
self.activeCellIndexPath = indexPath;
}
[self.doctorTableView beginUpdates];
[self.doctorTableView reloadRowsAtIndexPaths:[NSArray arrayWithObjects:indexPath, oldIndexPath, nil] withRowAnimation:UITableViewRowAnimationNone];
[self.doctorTableView endUpdates];
[self.doctorTableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionTop animated:YES];
}
As you can see, my animation looks weird (kind of moving to wrong position, jumps, etc). What I'm doing wrong? Or do I need to pick another approach for expanding cells?
You can use UITableViews animation automation like this:
Call [tableView beginUpdates];
Change the data source.
Insert or delete rows and sections, or reload them
This should cause new heights to be calculated, etc.
Make sure you use something appropriate for the withRowAnimation parameter of these methods
Call [tableView endUpdates];
Your animation should now perform as expected.
Maybe your problem is that you selected UITableViewRowAnimationNone for the row animation.

UITableViewCell animate improperly at the very first time

I'm actually going to DELETE a cell on aTableView when a cell on bTableView is deselected. And also, I'm using UIViewController instead of UITableViewController just because there'r lots of things on my app, and for sure, I've adopted UITableViewDelegate, UITableViewDataSource.
- (void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath
if (tableView == bTableView) { ......
MyCustomCell *cell = (MyCustomCell *)[aTableView cellForRowAtIndexPath:indexPath];
[convertResultTableView beginUpdates];
// some data updates stuff..
[UIView beginAnimations:#"quitRotation" context:NULL];
CATransform3D rotation;
rotation = CATransform3DMakeRotation((70.0 * M_PI) / 180, 0.0, 0.0, 1.0);
cell.layer.transform = rotation;
cell.layer.anchorPoint = CGPointMake(-1, 0.5);
cell.alpha = 0;
cell.layer.shadowOffset = CGSizeMake(0, 0);
[UIView commitAnimations];
[convertResultTableView endUpdates];
The problem is the cells animate proper only when it animate at the second, third, forth.. time but NOT the first time. (which means it appear, disappear, appear and disappear <- this time)
It still do some animation but it is just not as what I expected, and there'r a lot different between that WRONG animation and the proper animation.
Any ideas?
You should try to do this animation in method cellForRowAtIndexPath
Something like this:
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
self.selectedIndexPath = indexPath;
[tableView reloadData];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
MyCustomCell *cell = (MyCustomCell *)[tableView cellForRowAtIndexPath:indexPath];
if([self.selectedIndexPath isEqual: indexPath]) {
// do the animation
}
}
Really a silly mistake!
Here's my mistake:
My aTableView will do some animation when first show, but my code have some silly mistake so that only my first row of cell of the aTableView do the animate, therefore, cell.layer.position will be different. However, after it disappear and appear again, the cell.layer.position all go to the right place because the code is right, so it works when it's 2th, 3rd... time.
How I found the mistake: I just do NSLog(...); to log basically all the property of cell.layer because I'm really new to CoreAnimation, fortunately, my first try is cell.layer.position, and I found the mistake immediately.

Resources