TableViewCell animation in fast

I follow THIS , and get this animation with this code:

func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) { cell.layer.transform = CATransform3DMakeScale(0.1,0.1,1) UIView.animateWithDuration(0.25, animations: { cell.layer.transform = CATransform3DMakeScale(1,1,1) }) } 

But I want to update something in this cell animation, for example, when I scroll in the tableView, the cell is small, like (0.1,0.1,1) at the beginning, and after that it scales as (1,1,1) , but I I want to apply it as an effect like a bubble at the initial stage, it is small, but in the original scale it is (1,1,1) , and the other scaled and reappears in the original scale, for example (1,1,1) .

please call me, how can I achieve this animation?

EDIT:

I tried this, but it was not so smooth and not exact what I want.

  func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) { cell.layer.transform = CATransform3DMakeScale(0.1,0.1,1) UIView.animateWithDuration(0.3, animations: { cell.layer.transform = CATransform3DMakeScale(1,1,1) }) UIView.animateWithDuration(1, animations: { cell.layer.transform = CATransform3DMakeScale(2,2,2) }) UIView.animateWithDuration(0.3, animations: { cell.layer.transform = CATransform3DMakeScale(1,1,1) }) } 
+8
source share
5 answers

You need light animation. For more information, visit http://easings.net

You can do parametric animation using this library https://github.com/jjackson26/JMJParametricAnimation/tree/master/JMJParametricAnimationDemo

At the moment, the effect you are trying to do can be done roughly using the following code. You must do the zoom animation one by one. As you did, all animations start together.
Adding the following animation code to the completion block starts it after the animation. You can further adjust the timings to get the effect you need.

  cell.layer.transform = CATransform3DMakeScale(0.1,0.1,1) UIView.animateWithDuration(0.3, animations: { cell.layer.transform = CATransform3DMakeScale(1.05,1.05,1) },completion: { finished in UIView.animateWithDuration(0.1, animations: { cell.layer.transform = CATransform3DMakeScale(1,1,1) }) }) 
+21
source

Swift 4

 func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) { cell.transform = CGAffineTransform(scaleX: 0.8, y: 0.8) UIView.animate(withDuration: 0.4) { cell.transform = CGAffineTransform.identity } } 
+14
source

Swift 3 version works like a charm!

 cell.layer.transform = CATransform3DMakeScale(0.1, 0.1, 1) UIView.animate(withDuration: 0.3, animations: { cell.layer.transform = CATransform3DMakeScale(1.05, 1.05, 1) },completion: { finished in UIView.animate(withDuration: 0.1, animations: { cell.layer.transform = CATransform3DMakeScale(1, 1, 1) }) }) 
+9
source

Use this code to get the animation of spiral cells in a table view

 func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) { //1. Setup the CATransform3D structure var rotation = CATransform3DMakeRotation( CGFloat((90.0 * M_PI)/180), 0.0, 0.7, 0.4); rotation.m34 = 1.0 / -600 //2. Define the initial state (Before the animation) cell.layer.shadowOffset = CGSize(width: 10.0, height: 10.0) cell.alpha = 0; cell.layer.transform = rotation; cell.layer.anchorPoint = CGPoint(x: 0.0, y: 0.5) //3. Define the final state (After the animation) and commit the animation cell.layer.transform = rotation UIView.animate(withDuration: 0.8, animations:{cell.layer.transform = CATransform3DIdentity}) cell.alpha = 1 cell.layer.shadowOffset = CGSize(width: 0, height: 0) UIView.commitAnimations() } 
+2
source

Use this code to achieve tabular animation

 func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) { let rotationAngleInRadians = 360.0 * CGFloat(.pi/360.0) // let rotationTransform = CATransform3DMakeRotation(rotationAngleInRadians, -500, 100, 0) let rotationTransform = CATransform3DMakeRotation(rotationAngleInRadians, 0, 0, 1) cell.layer.transform = rotationTransform UIView.animate(withDuration: 1.0, animations: {cell.layer.transform = CATransform3DIdentity}) } 
+2
source

Source: https://habr.com/ru/post/980650/


All Articles