iOS Android Material Design Hierarchical Timing using UICollectionView

Question

I want to do the animation introduced by Android Material Design Hierarchical Timing in iOS using UICollectionView

Lets say its a collectionView, and resizing the view i

Answer 1

Subclass your collection view cell and add this method:

class YourCollectionViewCell: UICollectionViewCell {  
   //Some IBOutlets if needed

   func popAfter(delay: NSTimeInterval){
      transform = CGAffineTransformMakeScale(0, 0)
      UIView.animateWithDuration(0.7, delay: delay, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in
         self.transform = CGAffineTransformMakeScale(1, 1)
      }, completion: nil)      
   }
}

Set your collection view's delegate and dataSource to your view controller (this can be done in Interface Builder). Add constants to your view controller and reload collection view in viewDidAppear to animate cells:

class YourViewController{
   private let numberOfCellsInLine = 3
   private let numberOfVisibleCellsOnTheScreen = 12
   private let baseDelay = 0.15

   override func viewDidAppear(animated: Bool) {
      super.viewDidAppear(animated)
      collectionView.reloadData()
   }
}

Add extension to your view controller for UICollectionView datasource & delegate:

extension YourViewController: UICollectionViewDataSource, UICollectionViewDelegateFlowLayout{
   func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int{
      return numberOfCells
   }

   // The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath:
   func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell{
      let cell = collectionView.dequeueReusableCellWithReuseIdentifier("YourCellID", forIndexPath: indexPath) as YourCollectionViewCell
      //set cell's content
      let index = indexPath.row
      let yIndex = index / numberOfCellsInLine
      let delay = Double(index % numberOfCellsInLine + (index >= numberOfVisibleCellsOnTheScreen ? 0 : yIndex)) * baseDelay
      cell.popAfter(delay)
      return cell
   }
}

You can adjust baseDelay and animation duration in Cell's popAfter values to achieve desired timing. Hope this helps and good luck with your app! Feel free to ask any questions.