視覺效果

圓角

CALayer有一個叫做conenerRadius的屬性控制著圖層角的曲率芒帕。float類型伦吠，默認為0.并且吧masksToBounds設置成為YES的話根暑，圖層里面的所有東西都會被截取毒涧，呈現(xiàn)出圓角狀態(tài)贮预。

邊框

CALayer中的borderWidth和borderColor，兩者共同定義了圖層邊的繪制樣式。這條線沿著圖層的bouds繪制仿吞，同時也包含圖層的角滑频。
borderWidth為float類型，默認為0唤冈，
borderColor為CGColorRef類型峡迷，默認黑色。

陰影

CALayer中的shadowOpacity屬性控制著陰影你虹，float類型绘搞，默認為0，
shadowColor控制著陰影的顏色傅物，CGColorRef類型夯辖，默認黑色，
shadowOffset控制著陰影的方向和距離董饰，CGSize的值楼雹，寬度控制這陰影橫向的位移，高度控制著縱向的位移尖阔，默認值{0，-3}榨咐，即陰影相對于Y軸有3個點的向上位移介却，
shadowRadius控制著陰影的模糊度，float類型块茁，默認為0齿坷，
shadowPath控制陰影的形狀，CGPathRef類型（一個指向CGPath的指針）

變換

仿射變換

1.png

CGAffineTransform中的“防射”的意思是無論變換矩陣用什么值数焊，圖層中平行的兩條線在變換之后仍然保持平行永淌。
x按照a值得比例縮放，
y按照d值得比例縮放
x按照c值比例拉伸
y按照b值比例拉伸
x跟著tx進行平移
y會跟著ty進行平移

CGAffineTransformMakeRotation(CGFloat angle)
CGAffineTransformMakeScale(CGFloat sx, CGFloat sy) 
CGAffineTransformMakeTranslation(CGFloat tx, CGFloat ty)

UIView可以通過設置transform屬性做變換佩耳，但實際上它只是封裝了內部圖層的變換
CALayer同樣也有一個transform屬性遂蛀，但它的類型是CATransform3D
將一個圖片旋轉45度

  UIImage *image = [UIImage imageNamed:@"111"];
  self.layerView.layer.contents = (__bridge id)image.CGImage;
  CGAffineTransform transform = CGAffineTransformMakeRotation(M_PI_4);
  self.layerView.layer.affineTransform = transform;

2.png

混合變換

Core Graphics提供了一系列的函數(shù)可以在一個變換的基礎上做更深層次的變換，

CGAffineTransformRotate(CGAffineTransform t, CGFloat angle) 
CGAffineTransformScale(CGAffineTransform t, CGFloat sx, CGFloat sy) 
CGAffineTransformTranslate(CGAffineTransform t, CGFloat tx, CGFloat ty)

Tranform類型

1干厚、平移

• 根據(jù)本身的transform進行平移 CGAffineTransformMakeTranslation(CGFloat tx,CGFloat ty)
• 根據(jù)本身的transform后另外的transform進行平移
  CGAffineTransformTranslate(CGAffineTransform t,CGFloat tx,CGFloat ty)

2李滴、縮放

• 修改本身的transform進行縮放CGAffineTransformMakeScale(CGFloat sx,CGFloat sy)
• 根據(jù)本身的transform后者另外的transform進行縮放CGAffineTransformRotate(CGAffineTransform t,CGFloat angle)

3、反向旋轉
CGAffineTransformInvert(CGAffineTransform t)
4蛮瞄、合并
將兩個transform合并起來CGAffineTransformConcat(CGAffineTransform t1,CGAffineTransform t2)
5所坯、放射矩陣應用

• 得到新的中心CGPoint CGPointApplyAffineTransform(CGPoint point,CGAffineTransform t)
• 得到新的size CGSize CGSizeApplyAffineTransform(CGSize size,CGAffineTransform t)
• 得到新的rect CGRect CGRectApplyAffineTransform(CGRect rect,CGAffineTransform t)
  放射矩陣一個常用的情形就是根據(jù)用戶的收拾來相應的改變試圖的變換。

//縮放50%挂捅，旋轉30度芹助，X軸移動50像素
UIImage *image = [UIImage imageNamed:@"111"];
self.layerView.layer.contents = (__bridge id)image.CGImage;
CGAffineTransform transform = CGAffineTransformIdentity;
transform = CGAffineTransformScale(transform, 0.5, 0.5);//縮放50%
transform = CGAffineTransformRotate(transform, M_PI / 180.0 * 30.0);//旋轉30度
transform = CGAffineTransformTranslate(transform, 50, 0);//X軸移動50像素
self.layerView.layer.affineTransform = transform;

3.png

斜切變換

沒有提供直接的函數(shù)，需要自己定義

CGAffineTransform CGAffineTransformMakeShear(CGFloat x, CGFloat y) {
    CGAffineTransform transform = CGAffineTransformIdentity;
    transform.c = -x;
    transform.b = y;
    return transform;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UIImage *image = [UIImage imageNamed:@"111"];
    self.layerView.layer.contents = (__bridge id)image.CGImage;
    self.layerView.layer.affineTransform = CGAffineTransformMakeShear(1, 0);
    
}

4.png

3D變換

CATransform3D是一個可以在三維空間內做變換的4*4矩陣

5.png

和CGAffineTransform矩陣類似，Core Animation提供了一系列的方法用來創(chuàng)建和組合CATransform3D類型的矩陣

//angle旋轉的弧度状土，
CATransform3DMakeRotation(CGFloat angle, CGFloat x, CGFloat y, CGFloat z) 
//sx x軸縮放 sy y軸縮放 sz z軸縮放
CATransform3DMakeScale(CGFloat sx, CGFloat sy, CGFloat sz)
//tx x平移无蜂， ty y平移 tz z平移 
CATransform3DMakeTranslation(Gloat tx, CGFloat ty, CGFloat tz)

CATransform3D中的M34元素，用來做透視變換效果（-1.0/d）d表示了想象中視角相機和屏幕之間的距離
sublayerTransform屬性表示父視圖變換声诸，里面的子試圖也隨之變換酱讶。

CAShapeLayer

CAShapeLayer是CALayer的子類，是通過一個矢量圖而不是bitmap來繪制的圖層子類彼乌。具有渲染速度快泻肯、高效實用內存、不會被圖層邊界裁掉慰照、不會出現(xiàn)像素化等優(yōu)點灶挟。

UIBezierPath *path = [[UIBezierPath alloc] init];
    [path moveToPoint:CGPointMake(175, 100)];
    
    [path addArcWithCenter:CGPointMake(150, 100) radius:25 startAngle:0 endAngle:2 * M_PI clockwise:YES];
    [path moveToPoint:CGPointMake(150, 125)];
    [path addLineToPoint:CGPointMake(150, 175)];
    [path addLineToPoint:CGPointMake(125, 225)];
    [path moveToPoint:CGPointMake(150, 175)];
    [path addLineToPoint:CGPointMake(175, 225)];
    [path moveToPoint:CGPointMake(100, 150)];
    [path addLineToPoint:CGPointMake(200, 150)];
    
    
    CAShapeLayer *shapLayer = [CAShapeLayer layer];
    shapLayer.strokeColor = [UIColor redColor].CGColor;
    shapLayer.fillColor = [UIColor clearColor].CGColor;
    shapLayer.lineWidth = 5;
    shapLayer.lineJoin = kCALineJoinRound;
    shapLayer.lineCap = kCALineCapRound;
    shapLayer.path = path.CGPath;
    [self.view.layer addSublayer:shapLayer];

6.png