iOS CALayer 簡單介紹

標籤：shape   dash   die   obj   需要   demo   asi   dem   png   

https://www.jianshu.com/p/09f4e36afd66

什麼是CALayer：

 

總結：能看到的都是uiview，uiview能顯示在螢幕上是因為它內部的一個層calyer層。

在建立uiview的時候，uiview的內部會自動建立一個層（calayer對象）通過uiview的layer屬性可以訪問這個層。當uiview需要顯示在螢幕上時，會調用drawrect 方法進行繪製，並將所有的內容繪製在自己的層上，繪製完畢之後，系統會將層拷貝到螢幕上，於是uiview就顯示了。

換句話說，uiview本身並不具備顯示功能，它的內部的層才有顯示功能。

 

CALayer的準系統

通過操作CALayer對象，可以調整uiview的一些外觀屬性。比如陰影，圓角，邊框的顏色等、

項目中的具體使用

1.做漸層。有時候項目中可能要用到一個漸層的圖片，如果用圖片的話 是會簡單很多，但是也會相應的佔用記憶體，增加開銷，而Calayer的效率相對來說就會高很多。

下邊附上代碼：

 //1.漸層的簡單實現demo    UIView *bgView = [[UIView alloc]initWithFrame:CGRectMake(0, 15, 100, 100)];    bgView.layer.cornerRadius = 10;    bgView.layer.masksToBounds = YES;    bgView.backgroundColor  =[UIColor blackColor];    [self.view addSubview:bgView];        CAGradientLayer *gradientLayer2 = [CAGradientLayer layer];    gradientLayer2.colors = @[(__bridge id)[UIColor redColor].CGColor, (__bridge id)[UIColor yellowColor].CGColor, (__bridge id)[UIColor blueColor].CGColor];    gradientLayer2.locations = @[@0.3, @0.4, @1.0];    gradientLayer2.startPoint = CGPointMake(0, 0);    gradientLayer2.endPoint = CGPointMake(1.0, 0);    gradientLayer2.frame = CGRectMake(0, 0, 100, 100);    [bgView.layer addSublayer:gradientLayer2];

 2. 實作類別似於載入圖的載入效果。兩種方式，一種是使用 n張圖片去迴圈，這樣的話對記憶體的開銷比較大，不建議使用，第二種就是採用CALayer的相關屬性  加上核心動畫來實現：代碼如下：

//2.漸層轉換為圖形形成動畫    CALayer *layer = [CALayer layer];    layer.backgroundColor = [UIColor redColor].CGColor; //圓環底色    layer.frame = CGRectMake(100, 100, 110, 110);//    //    //    //建立一個圓環    UIBezierPath *bezierPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(55, 55) radius:50 startAngle:0 endAngle:M_PI*2 clockwise:YES];////    //圓環遮罩    CAShapeLayer *shapeLayer = [CAShapeLayer layer];    shapeLayer.fillColor = [UIColor clearColor].CGColor;    shapeLayer.strokeColor = [UIColor redColor].CGColor;    shapeLayer.lineWidth = 5;    shapeLayer.strokeStart = 0;    shapeLayer.strokeEnd = 0.8;    shapeLayer.lineCap = @"round";    shapeLayer.lineDashPhase = 0.8;    shapeLayer.path = bezierPath.CGPath;////    //色彩坡形    NSMutableArray *colors = [NSMutableArray arrayWithObjects:(id)[UIColor redColor].CGColor,(id)[UIColor whiteColor].CGColor, nil];    CAGradientLayer *gradientLayer = [CAGradientLayer layer];    gradientLayer.shadowPath = bezierPath.CGPath;    gradientLayer.frame = CGRectMake(50, 50, 60, 60);    gradientLayer.startPoint = CGPointMake(0, 1);    gradientLayer.endPoint = CGPointMake(1, 0);    [gradientLayer setColors:[NSArray arrayWithArray:colors]];    [layer addSublayer:gradientLayer]; //設定色彩坡形    [layer setMask:shapeLayer]; //設定圓環遮罩    [self.view.layer addSublayer:layer];////    //動畫    CABasicAnimation *scaleAnimation1 = [CABasicAnimation animationWithKeyPath:@"transform.scale"];    scaleAnimation1.fromValue = [NSNumber numberWithFloat:1.0];    scaleAnimation1.toValue = [NSNumber numberWithFloat:1.5];    scaleAnimation1.autoreverses = YES;    //    scaleAnimation1.fillMode = kCAFillModeForwards;    scaleAnimation1.duration = 0.8;        CABasicAnimation *rotationAnimation2 = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];    rotationAnimation2.fromValue = [NSNumber numberWithFloat:0];    rotationAnimation2.toValue = [NSNumber numberWithFloat:6.0*M_PI];    rotationAnimation2.autoreverses = NO;//此行是控制是否倒轉，yes為倒轉，no為不倒轉    rotationAnimation2.repeatCount = MAXFLOAT;    rotationAnimation2.beginTime = 0.8; //延時執行，注釋掉動畫會同時進行    rotationAnimation2.duration = 2;    ////    //    //組合動畫    CAAnimationGroup *groupAnnimation = [CAAnimationGroup animation];    groupAnnimation.duration = 4;//    groupAnnimation.autoreverses = YES;    groupAnnimation.animations = @[scaleAnimation1, rotationAnimation2];//    groupAnnimation.animations = @[ rotationAnimation2];    groupAnnimation.repeatCount = MAXFLOAT;    [layer addAnimation:groupAnnimation forKey:@"groupAnnimation"];

 下邊附上以上代碼的：

iOS CALayer 簡單介紹