Expand/collapse UITableViewCell to achieve Evernote-like transition Expand/collapse UITableViewCell to achieve Evernote-like transition objective-c objective-c

Expand/collapse UITableViewCell to achieve Evernote-like transition


I think it uses a custom transition for the zoom in effect. It can be achieved by using this 3rd party framework: https://github.com/mluisbrown/LCZoomTransition as a pattern since the destination view controller looks like a modal and not a destination view controller.


An approach to consider: you can use a UICollectionView with two different layouts. The unexpanded layout can just be a UICollectionViewFlowLayout and the expanded layout can be a subclass that shrinks/fades all the cells except the one you want expanded. Then you can use setCollectionViewLayout:animated: to switch between them.

The green border would just be the background of the parent view, since this wouldn't involve a UINavigationController.

And if you want the interactive swipe gesture for going back from the expanded layout, you hook up a UIScreenEdgePanGestureRecognizer to an interactive collection view layout animation (see startInteractiveTransitionToCollectionViewLayout:completion:).


Judging by that border around places in full screen I would say it's not a UINavigationController but rather two view controllers with custom transition between them.

This was introduced with iOS7 and you can find few tutorials online to implement any custom transitions:

http://www.objc.io/issue-12/custom-container-view-controller-transitions.html

https://developer.apple.com/library/IOs/documentation/UIKit/Reference/UIViewControllerTransitioningDelegate_protocol/index.html