iOS CAGradientLayer 详解

参考文章 http://blog.csdn.net/iunion/article/details/26221213
CAGradientLayer
产生平滑过渡色
//
//  ViewController.m
//  test_gradient_01
//
//  Created by admin on 2/3/16.
//  Copyright © 2016 jeffasd. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@property(nonatomic, strong)UIView *contentView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    _contentView = [UIView new];
    _contentView.frame = CGRectMake(100, 100, 100, 100);
    _contentView.backgroundColor = [UIColor redColor];
    [self.view addSubview:_contentView];
    
    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = self.contentView.bounds;
    [self.contentView.layer addSublayer:gradientLayer];
    
//    gradientLayer.colors = (__bridge NSArray * _Nullable)([UIColor blueColor].CGColor);
//    gradientLayer.colors = (__bridge NSArray * _Nullable)([UIColor cyanColor].CGColor);
    
    //渐变区域
    gradientLayer.locations = @[[NSNumber numberWithFloat:0.3], [NSNumber numberWithFloat:0.8]];
    
    gradientLayer.colors = @[(__bridge NSArray * _Nullable)([UIColor blueColor].CGColor), (__bridge NSArray * _Nullable)([UIColor redColor].CGColor)];
    
//    gradientLayer.startPoint = CGPointMake(0, 0);
    //最大值为 (1, 1),最小值为(0, 0)
    gradientLayer.startPoint = CGPointMake(1, 0);
    gradientLayer.endPoint = CGPointMake(1, 1);
    
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end





CAGradientLayer的属性设置

1. 类型
[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. @property(copyNSString *type  
目前只有NSString * const kCAGradientLayerAxial
即线性梯度变化

2. 颜色
[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. @property(copyNSArray *colors  

3. 位置参数
[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. @property(copyNSArray *locations  
颜色的区间分布,locations的数组长度和colors一致, 取值范围(0, 1),而且必须是单调递增的


修改例子6.6,增加
[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. <p class="p1">    gradientLayer.<span class="s1">locations</span> = <span class="s2">@[</span>[<span class="s1">NSNumber</span> <span class="s3">numberWithFloat</span>:<span class="s2">0.0</span>], [<span class="s1">NSNumber</span> <span class="s3">numberWithFloat</span>:<span class="s2">0.2</span>]<span class="s2">]</span>;</p>  

[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. gradientLayer.locations = @[[NSNumber numberWithFloat:0.5], [NSNumber numberWithFloat:0.7]];  


4. startPoint和endPoint
[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. @property CGPoint startPoint, endPoint;  
取值都是相对于layer的bounds的。startPoint默认值为(0.5, 0),endPoint默认值为(0.5, 1)

修改例子6.6

gradientLayer.startPoint 分别设为 CGPointMake(00); 



  CGPointMake( 0.250); 


  CGPointMake( 0.50); 


  CGPointMake( 0.750); 


  CGPointMake(1,  0); 



综合修改例子6.6
[objc]  view plain  copy
 print ? 在CODE上查看代码片 派生到我的代码片
  1. - (void)viewDidLoad  
  2. {  
  3.     [super viewDidLoad];  
  4.       
  5.     //create gradient layer and add it to our container view  
  6.     CAGradientLayer *gradientLayer = [CAGradientLayer layer];  
  7.     gradientLayer.frame = self.containerView.bounds;  
  8.     [self.containerView.layer addSublayer:gradientLayer];  
  9.       
  10.     //set gradient colors  
  11.     gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,  
  12.                              (__bridge id)[UIColor blueColor].CGColor];  
  13.       
  14.     gradientLayer.locations = @[[NSNumber numberWithFloat:0.5], [NSNumber numberWithFloat:0.7]];  
  15.   
  16.     //set gradient start and end points  
  17.     gradientLayer.startPoint = CGPointMake(0.750.0);  
  18.     gradientLayer.endPoint = CGPointMake(1.01.0);  
  19. }  



从以上可以看出startPoint和endPoint诗表示的渐变方向,locations是渐变区域。
也可以看出locations的取值是相对于startPoint和endPoint线段的。

在网上找的描述让我很是不能理解




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值