CAGradientLayer + UIBezierPath 為視圖畫漸變背景色


CAGradientLayer 繼承於CALayer的漸變層

效果圖:

![漸變背景色](http://images2015.cnblogs.com/blog/910416/201609/910416-20160918220141379-1791801200.png "漸變背景色")

示例代碼:

    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(CGRectGetMidX(self.view.frame) - 100 , CGRectGetMidY(self.view.frame) - 100, 200, 200)];
    
    view.backgroundColor = [UIColor lightGrayColor];
    
    [self.view addSubview:view]; 

  CAGradientLayer *gradLayer = [CAGradientLayer layer];
   
    gradLayer.frame = CGRectMake(100, 100, 100, 100);
    
    gradLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,(__bridge id)[UIColor greenColor].CGColor,(__bridge id)[UIColor orangeColor].CGColor];

    gradLayer.startPoint = CGPointMake(0, 1);
    gradLayer.endPoint = CGPointMake(1, 1);
    gradLayer.locations = @[@0.2,@0.5,@0.7];
    gradLayer.type = kCAGradientLayerAxial;
   
    [view.layer addSublayer:gradLayer];
    

屬性說明:

frame : 漸變層的位置及大小
colors: 各個漸變范圍的顏色
startPoint 、endPoint: 漸變層起點 endPoint 漸變層終點 確定漸變的方向 如: (0,0)->(1,1) 左上到右下漸變 (0,0)->(0,1) 從上到下漸變 (0,0)->(1,0) 從左到右漸變
locations: 開始漸變的停止位置即非漸變色的位置,為遞增數組,默認會根據顏色個數均勻分布,如三個顏色默認數組為@[0,0.5,1],即在0處為紅色0.5處為綠色1處為橘色,之間為漸變色 NSNumber 對象數組 每一個number的范圍為[0,1]
type: 漸變方式,默認 kCAGradientLayerAxial軸向方式,也只有之一種方式

特殊形狀的漸變

效果圖:

![特殊形狀漸變背景色](http://images2015.cnblogs.com/blog/910416/201609/910416-20160918220141535-368920939.png)

示例代碼:

    //給漸變層設置 mask 屬性 
    {
        // 設置只顯示一個三角形范圍的漸變色
        UIBezierPath *shapeLayerPath = [[UIBezierPath alloc] init];
        // 點的坐標是相對於漸變層的
        [shapeLayerPath moveToPoint:CGPointMake(0,100)];
        [shapeLayerPath addLineToPoint:CGPointMake(50, 50)];
        [shapeLayerPath addLineToPoint:CGPointMake(100, 100)];
        
        CAShapeLayer *shapeLayer = [CAShapeLayer layer];
        shapeLayer.path = shapeLayerPath.CGPath;
        
		gradLayer.mask = shapeLayer;
  }

mask: 遮蓋層,CALayer類型,能夠讓漸變色顯示特殊形狀

用途 :折線圖畫漸變陰影等。



免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM