The UITableViewCell subclass drawn in the code activates the Delete button in

Question

I am working on a custom subclass of UITableViewCell where everything is drawn in code, not using UILabels, etc. (This exercise is for learning the part and partly because code drawing is much faster. I know that for a few shortcuts this will not matter much, but in the end I want to generalize this to more complex cells.)

I am currently struggling with the animation of the delete button: how to animate a cell that shrinks when the delete button is pressed.

First, I draw a custom sub-layer of the contents of cellView. In this subzone, everything is drawn.

I set the size of the subview by catching layoutSubviews on the cell itself and doing:

- (void)layoutSubviews { [super layoutSubviews]; CGRect b = [self.contentView bounds]; [subcontentView setFrame:b]; } 

I do this, and not just set the autoresist mask, because it seemed more reliable when testing, but if necessary, I can use the autoresist masking approach when testing.

Now, by default, what happens when someone gets negative, this view is compressed.

I can avoid this by tuning my cell by calling

 subcontentView.contentMode = UIViewContentModeRedraw; 

This gives me the correct end result (my user view is redrawn with a new size and laid out correctly, like the first image I posted), but the transition animation is unpleasant: it looks like the cell is stretched and reduced to size.

I know why the animation works like this: Core Animation does not request your view for redrawing for each frame, it receives it for redrawing for the final position of the animation, and then interpolates to find the middle bits.

Another solution is

 subcontentView.contentMode = UIViewContentModeLeft; 

It just draws a delete button above my cell, so it covers part of it.

If I also implement

 - (void) didTransitionToState:(UITableViewCellStateMask)state { [self setNeedsDisplay]; } 

after the delete button moves to the cell "jumps" to the desired size. This way there is no nice slide animation, but at least I get the correct result at the end.

I suppose that I could start my own animation in parallel with the appearance of the delete button, temporarily creating another view with a copy of the image of my view in the old size, setting mine to a new size and fading between them - this way, instead of a sharp jump, there will be a good transition. Does anyone use such a technique?

Now you may ask why I cannot use the contentStretch property and give it a region for resizing. The problem is that I am doing something reasonable, but this is not always possible. In this particular example, this will work, but a more complex cell cannot.

So my question (after all this background) is: what are you doing in this situation? Does anyone have an animated delete button that works for custom drawing cells? If not, what is the best compromise?

Answer 1

It worked for me at last. in a subclass of UITableViewCell

 subDrawContentView.contentMode = UIViewContentModeLeft; 

override the basement method

 - (void)layoutSubviews { CGRect b = [subDrawContentView bounds]; b.size.width = (!self.showingDeleteConfirmation) ? 320 : 300; [subDrawContentView setFrame:b]; [subDrawContentView setNeedsDisplay]; [super layoutSubviews]; } 

Answer 2

So I will insert the code first and then explain:

 -(void)startCancelAnimation{ [cancelButton setAlpha:0.0f]; [cancelButton setFrame:CGRectMake(320., cancelButton.frame.origin.y, cancelButton.frame.size.width, cancelButton.frame.size.height)]; cancelButton.hidden=NO; [UIView animateWithDuration:0.4 animations:^(void){ [progressView setFrame:CGRectMake(progressView.frame.origin.x, progressView.frame.origin.y, 159.0, progressView.frame.size.height)]; [text setFrame:CGRectMake(text.frame.origin.x, text.frame.origin.y, 159.0, text.frame.size.height)]; [cancelButton setFrame:CGRectMake(244., cancelButton.frame.origin.y, cancelButton.frame.size.width, cancelButton.frame.size.height)]; [cancelButton setAlpha:1.0f]; } ]; } -(void)stopCancelAnimation{ [UIView animateWithDuration:0.4 animations:^(void){ [cancelButton setFrame:CGRectMake(320., cancelButton.frame.origin.y, cancelButton.frame.size.width, cancelButton.frame.size.height)]; [cancelButton setAlpha:0.0f]; }completion:^(BOOL completion){ cancelButton.hidden=YES; [cancelButton setAlpha:1.0f]; [progressView setFrame:CGRectMake(progressView.frame.origin.x, progressView.frame.origin.y, DEFAULT_WIDTH_PROGRESS, progressView.frame.size.height)]; [text setFrame:CGRectMake(text.frame.origin.x, text.frame.origin.y, DEFAULT_WIDTH_TEXT, text.frame.size.height)]; } ]; } -(void)decideAnimation{ if([cancelButton isHidden]){ [self startCancelAnimation]; } else{ [self stopCancelAnimation]; } } 

So, I have a button that looks like this:

I have an IBOutlet . And what I am doing is UIProgressView and UITextField (you can resize whatever you want). As for the code, it's pretty simple, but if you need help understanding what is going on, please ask. Also, don't forget to add Swip Gesture to UITableView ... Like this:

  UISwipeGestureRecognizer *gesture = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(didSwipe:)]; gesture.numberOfTouchesRequired=1; gesture.direction = UISwipeGestureRecognizerDirectionRight; [table addGestureRecognizer:gesture]; [gesture release]; 

Finally, a method that does everything:

 -(void)didSwipe:(UIGestureRecognizer *)gestureRecognizer { if (gestureRecognizer.state == UIGestureRecognizerStateEnded) { //Get the cell of the swipe... CGPoint swipeLocation = [gestureRecognizer locationInView:self.table]; NSIndexPath *swipedIndexPath = [self.table indexPathForRowAtPoint:swipeLocation]; UITableViewCell* swipedCell = [self.table cellForRowAtIndexPath:swipedIndexPath]; //Make sure its a cell with content and not an empty one. if([swipedCell isKindOfClass:[AMUploadsTableViewCell class]]){ // It will start the animation here [(AMUploadsTableViewCell*)swipedCell decideAnimation]; // Do what you want :) } } } 

So, you can see that the entire animation is created manually, so you can precisely control what you want. :)