tableView简单的动画效果

tableView 中一些动画效果一般都是实现willDisplayCell的方法来展现出一些动画的效果动画

(1).带有3D效果的小型动态展现spa

-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{3d

  

 CATransform3D rotation;orm

    rotation = CATransform3DMakeRotation( (-48.0*M_PI)/180, 0.0, 0.7, 0.4);animation

    rotation.m34 = 1.0/ -600;  //关于catransform3d m34,我会在最下方给出一些理解 it

 

    cell.layer.shadowColor = [[UIColor blackColor]CGColor];io

    cell.layer.transform = rotation;table

    cell.layer.anchorPoint = CGPointMake(0.5, 0.5);form

//CATransform3DIdentitytransform

    

    [UIView animateWithDuration:0.8 animations:^{

        cell.layer.transform = CATransform3DMakeRotation( (18.0*M_PI)/180, 0.0, 0.7, 0.4);

        cell.alpha = 1;

    } completion:^(BOOL finished) {

        [UIView beginAnimations:@"rotation" context:NULL];

        [UIView setAnimationDuration:0.8];

        cell.layer.transform = CATransform3DIdentity;

        cell.alpha = 1;

        [UIView commitAnimations];

    }];

}

 

 

 

(2).进入界面或者下拉时显示一种弹出效果的cell效果

-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{

//xy方向缩放的初始值为0.4

    cell.layer.transform = CATransform3DMakeScale(0.4, 0.4, 1);

    

//    设置动画时间为1.25秒,xy方向缩放的最终值为1

    [UIView animateWithDuration:1.25 animations:^{

        cell.layer.transform = CATransform3DMakeScale(1, 1, 1);

    }];

 }

 

(3).catransform3d m34的理解

  transform的结构以下:
  struct CATransform3D
  {
    CGFloat m11, m12, m13, m14;
    CGFloat m21, m22, m23, m24;
    CGFloat m31, m32, m33, m34;
    CGFloat m41, m42, m43, m44;
  };

  首先要实现view(layer)的透视效果(就是近大远小),是经过设置m34的:

  CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
  rotationAndPerspectiveTransform.m34 = 1.0 / -500;

  m34负责z轴方向的translation(移动),m34= -1/D,  默认值是0,也就是说D无穷大,这意味layer in projection plane(投射面)和layer in world   coordinate重合了。

  D越小透视效果越明显。
  所谓的D,是eye(观察者)到投射面的距离。

 

具体详情可参考下方连接:

http://www.jianshu.com/p/9cbf52eb39dd

相关文章
相关标签/搜索