I really like your AQGridView. I had a quick question about relating to it. When I tap on a cell, I want a full-screen view controller to show. But instead of just adding it, I want it to animate from the cell (kind of like in iWork, where when you tap on a document, it 'animates out' of the thumbnail in the document chooser). How would I do this?
Anonymous
We do something similar to this in the Kobo application, where we animate the book cover to fill the screen, then fade it out to reveal the book.
If you’re moving an image, as we are, then it’s a reasonably simple process:
- Define a method on your cell which will return the frame rectangle (in the cell’s coordinates) of the item you want to ‘expand’.
- When the cell is tapped, grab this rectangle and convert it to the coordinates system of a shared superview (for instance, the UIWindow) by calling -convertRect:toView: on the cell.
- Create a UIImageView containing your fullscreen image, and place it at these new coordinates (it will overlay the cell’s version exactly).
- Calculate where it will be when it fills the screen (i.e. its finishing frame rect).
- In an animation block, set its frame to its new destination.
- When the animation finishes, take the UIImageView off the screen and replace it with the real view. It’ll look like it just expanded up out of the cell!
If you’re not using a canned image to expand, then you’ll need to prepare the new view first (offscreen, naturally) and get an image representation of it to animate into place as described above.
Here’s some code which will get you a UIImage from any given view (this is from AQGridViewUpdateInfo.m):
- (UIImageView *) _imageViewForView: (UIView *) view
{
UIGraphicsBeginImageContext(view.bounds.size);
[view.layer renderInContext: UIGraphicsGetCurrentContext()];
CGImageRef img = UIGraphicsGetImageFromCurrentImageContext();
UIImageView * result = [[UIImageView alloc] initWithImage: img];
UIGraphicsEndImageContext();
return ( [result autorelease] );
}
