A cool custom transition between two or more UICollectionViewControllers

by iOS Example

CKWaveCollectionViewTransition

This is a cool custom transition between two or more UICollectionViewControllers with wave like cell animation. Could be used in e.g. galleries.

Cool wave like transition between two or more UICollectionView.

Animation idea was taken from Łukasz Frankiewicz Dribble project

Installation

There are two options:

  • Via CocoaPods.
  • Manually add the files into your Xcode project. Slightly simpler, but updates are also manual.

Usage

  • In storyboard add object in your NavigationController.

  • Set it's class to NavigationControllerDelegate

  • Set NavigationController delegate to this object.

or

Implement UINavigationControllerDelegate in your ViewController:

func navigationController(navigationController: UINavigationController, animationControllerForOperation operation: UINavigationControllerOperation,
        fromViewController fromVC: UIViewController, toViewController toVC: UIViewController) -> UIViewControllerAnimatedTransitioning? {
            
            let animator = CKWaveCollectionViewAnimator()
            
            if operation != UINavigationControllerOperation.Push {
                
                animator.reversed = true
            }
            
            return animator
    }
  • The last thing you have to set is self.selectedIndexPath property in your didSelectItemAtIndexPath method implementation.
override func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
        
        self.selectedIndexPath = indexPath
...

}

Properties

internal let animationDuration: Double! = 1.0

Total animation duration

internal let kCellAnimSmallDelta: Double! = 0.01

Small delay between cell animations

internal let kCellAnimBigDelta: Double! = 0.03

Big delay between cell animations

Requirements

  • iOS 7.0+

GitHub