swift 中的 TableViewCell 动画

Question

我正在学习 THIS 教程并使用以下代码实现该动画：

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)
    })

}

但是我想更新这个单元格动画中的一些东西，比如当我滚动到 tableView 时，单元格在开始时像 (0.1,0.1,1) 一样小，之后它像 (1,1,1) 一样缩放，但我想应用就像气泡类型的效果一样，它在开始时很小，然后它达到其原始比例，如 (1,1,1)，一个是缩放，然后再次进入其原始比例，如 (1,1,1)。

请指导我如何实现该动画？

编辑：

我试过了，但不是很流畅，也不是我想要的。

    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)
    })

}

Answer 1

您需要的是缓出后退动画。有关详细信息，请查看 http://easings.net

您可以使用此库制作参数化动画https://github.com/jjackson26/JMJParametricAnimation/tree/master/JMJParametricAnimationDemo

目前，您尝试做的效果可以使用下面的代码大致完成。你必须一个接一个地做缩放动画。您所做的方式使所有动画一起开始。
在 完成块 中添加下一个动画代码会在动画之后启动它。您可以进一步调整时间以获得您需要的粗略效果。

    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)
            })
    })

Answer 2

Swift 3 版本很有魅力！

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)
        })
    })

Answer 3

使用此代码在您的表格视图中获得螺旋形单元格动画

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()
}

Answer 4

使用这段代码在你的tableview中实现动画

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})
}

Answer 5

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
    }
}

Answer 6

使用此代码为左侧的 Tableview 单元格设置动画

    func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {

    let rotationTransform = CATransform3DTranslate(CATransform3DIdentity, -200, 0, 0)
    cell.layer.transform = rotationTransform
    cell.alpha = 0.5

    UIView.animate(withDuration: 0.5){
        cell.layer.transform = CATransform3DIdentity
        cell.alpha = 1.0
    }
}

swift 中的 TableViewCell 动画

TableViewCell animation in swift

animation

uitableview

swift