变更记录
序号 | 录入时间 | 录入人 | 备注 |
---|---|---|---|
1 | 2015-03-02 | Alfred Jiang | - |
2 | 2015-12-22 | Alfred Jiang | - |
方案名称
动画 - Core Animation 之 CATransform3D
关键字
动画 \ Core Animation \ CALayer \ CATransform3D
需求场景
- 使用 Core Animation 实现动画需求
参考链接
- CSDN - iPhone/iOS Core Animation开发总结(CALayer)
- Sina - CATransform3D 特效详解
- Core Animation编程指南(三)几何变换
- 博客园 - Core Animation编程指南(译文)(推荐)
- Apple documentation - Core Animation Programming Guide(英文好的推荐)
- 简书 - 干货系列之手把手教你使用Core animation 做动画 (推荐)
- 《核心动画编程指南》
详细内容
1. 使用CATransform3D函数
表 1 CATransform3D 变换函数 :偏移、旋转和缩放
Function | Use |
---|---|
CATransform3DMakeTranslation | Returns a transform that translates by '(tx, ty, tz)'. t' = [1 0 0 0; 0 1 0 0; 0 0 1 0; tx ty tz 1]. |
CATransform3DTranslate | Translate 't' by '(tx, ty, tz)' and return the result: t' = translate(tx, ty, tz) t. |
CATransform3DMakeScale | Returns a transform that scales by `(sx, sy, sz)': * t' = [sx 0 0 0; 0 sy 0 0; 0 0 sz 0; 0 0 0 1]. |
CATransform3DScale | Scale 't' by '(sx, sy, sz)' and return the result: t' = scale(sx, sy, sz) t. |
CATransform3DMakeRotation | Returns a transform that rotates by 'angle' radians about the vector '(x, y, z)'. If the vector has length zero the identity transform is returned. |
CATransform3DRotate | Rotate 't' by 'angle' radians about the vector '(x, y, z)' and return the result. t' = rotation(angle, x, y, z) * t. |
表 2 CATransform3D 与 CGAffineTransform 转换
Function | Use |
---|---|
CATransform3DMakeAffineTransform | Returns a CATransform3D with the same effect as the passed affine transform. |
CATransform3DIsAffine | Returns YES if the passedCATransform3D can be exactly represented an affine transform. |
CATransform3DGetAffineTransform | Returns the affine transform represented by the passedCATransform3D. |
表 3 CATransform3D 相等测试
Function | Use |
---|---|
CATransform3DIsIdentity | Returns YES if the transform is the identity transform. |
CATransform3DEqualToTransform | Returns YES if the two transforms are exactly equal. |
[UIView animateWithDuration:0.5 animations:^{
// sender.layer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMakeScale(1, 1)); //原位置
// sender.layer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMakeScale(1, -1)); //上下颠倒
// sender.layer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMakeScale(-1, 1)); //左右颠倒
// sender.layer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMakeScale(-1, -1)); //上下左右颠倒
// //CATransform3D系列方法
// sender.layer.transform = CATransform3DMakeScale(1, 1, 1);
// sender.layer.transform = CATransform3DMakeScale(-1, 1, 1);//Y轴颠倒
// sender.layer.transform = CATransform3DMakeScale(1, -1, 1);//X轴颠倒
// sender.layer.transform = CATransform3DMakeScale(1, 1, -1);//Z轴颠倒
// sender.layer.transform = CATransform3DScale(CATransform3DMakeScale(2, 2, 2), 1, -1, 1); //XYZ放大到2倍,再X轴颠倒
sender.layer.transform = CATransform3DIdentity; //恢复最初状态 如果不恢复初始状态可能导致按钮无法点击
}];
2. 直接修改数据结构的成员
struct CATransform3D
{
CGFloat m11, m12, m13, m14;
CGFloat m21, m22, m23, m24;
CGFloat m31, m32, m33, m34;
CGFloat m41, m42, m43, m44;
};
3. 通过键值路径修改变换
表 4 CATransform3D key paths
Field Key Path | Description |
---|---|
rotation.x | The rotation, in radians, in the x axis. |
rotation.y | The rotation, in radians, in the y axis. |
rotation.z | The rotation, in radians, in the z axis. |
rotation | The rotation, in radians, in the z axis. This is identical to setting the rotation.z field. |
scale.x | Scale factor for the x axis. |
scale.y | Scale factor for the y axis. |
scale.z | Scale factor for the z axis. |
scale | Average of all three scale factors. |
translation.x | Translate in the x axis. |
translation.y | Translate in the y axis. |
translation.z | Translate in the z axis. |
translation | Translate in the x and y axis. Value is an NSSize or CGSize. |
你不可以通过Objective-C 2.0的属性来设置结构域的值,比如下面的代码将会无法正常运行:
myLayer.transform.rotation.x=0;
替换的办法是,你必须通过setValue:forKeyPath:或者valueForKeyPath:方法,具体如下:
[myLayer setValue:[NSNumber numberWithInt:0] forKeyPath:@"transform.rotation.x"];
效果图
(无)