iOS 图形拉伸变换
首先在iOS中,CALayer 是UIView 的内容承载,UIView是为图层提供了底层的事件处理,本身更像是一个CALayer的管理器。
-
UIView
@property(nonatomic) CGAffineTransform transform; // default is CGAffineTransformIdentity. animatable
-
CALayer
@property CATransform3D transform; - (CGAffineTransform)affineTransform; - (void)setAffineTransform:(CGAffineTransform)m;
那么各种拉伸变换,其中最相关的几个属性是 Frame 、 center 、 transform
frame 是由center、bounds和transform共同计算而来,transform改变,frame会受到影响,但是center和bounds不会受到影响。
CMT (CGAffineTransform)
CoreGraphics Frameworks
默认情况下transform为 CGAffineTransformIdentify,可以使用frame但是一旦进行了变换,则矩阵变化 frame则相对不可信,使用 bounds+center 进行计算。
UIView transform的原点是该View 的center,基于自己的坐标系进行变换。
关于 CGAffineTransform 结构体的 矩阵变换,可在参考链接中查看。
UIView animation动画block中,进行frame前后变换,平移是相关的缩放就会存在渲染树问题:
因为缩放会影响平移,而平移却不会影响缩放,所以先平移到中心和目标frame一致,然后缩放。
CGAffineTransform moveTrans = CGAffineTransformMakeTranslation(CGRectGetMidX(toRect) - CGRectGetMidX(fromRect), CGRectGetMidY(toRect) - CGRectGetMidY(fromRect));
CGAffineTransform scaleTrans = CGAffineTransformMakeScale(toRect.size.width / fromRect.size.width, toRect.size.height / fromRect.size.height);
//先平移后旋转
CGAffineTransformConcat(scaleTrans, moveTrans);
CATransform3D
QuartzCore Frameworks 中CoreAnimation
CALayer 中frame、bounds、position和anchorPoint 相关属性。
所有的变换支点都是以 anchorPoint 进行的,默认(0.5 ,0.5),改变 anchorPoint则会对 frame.original 产生影响;而position 属性值其实是 CALayer 的 anchorPoint 点在其 superLayer 中的位置坐标。
position.x = frame.origin.x + anchorPoint.x * bounds.size.width;
position.y = frame.origin.y + anchorPoint.y * bounds.size.height;
position 和 anchorPoint,单一改变,只会影响 frame 根据另一个属性进行变化、
frame.origin.x = position.x - anchorPoint.x * bounds.size.width;
frame.origin.y = position.y - anchorPoint.y * bounds.size.height;
frame.size.width = bounds.size.width;
frame.size.height = bounds.size.height;
CATransform3D 和 CGAffineTransform 可通过接口 CATransform3DGetAffineTransform 相互转换.
注意点: UIkit 下坐标系和 Quartz 坐标系不同,这就是为什么用 UIGraphicsGetCurrentContext 的context 需要添加转换 坐标系
CGContextScaleCTM(ctx, 1.0, -1.0);
CALayer 下 3D变换矩阵,结构体参数详解:
- 待续
- m34 透视
- m44
//根据图片的旋转矩阵求旋转角度
- (CGFloat)angleFromTransform:(CATransform3D)transform
{
CGFloat angle = 0.0f;
angle = atan2f(transform.m21,transform.m11);
return angle;
}
GPUImageTransformFilter
GPUImageStretchDistortionFilter
其他相关属性
resizableImageWithCapInsets
UIEdgeInsets insets = UIEdgeInsetsMake(0, 0, 100, 0);
UIImage *tempImage = [self.currentImage resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];
这个接口主要使用在UI设计的资源使用中,不需要设计师给定icon的固定大小,是一个可变的展示处理方式,和 Assets 中,资源右下角 slicing 模式下调整一样。
UIViewContentMode 则是UIView 用来内容填充模式的一个属性;
参考