IOS CAShapeLayer CAGradientLayer UIBezierPath 使用实例

CGRect rect = CGRectMake(100, 100, 100, 100);

UIView * bgView = [[UIView alloc]initWithFrame:rect];

bgView.backgroundColor = [UIColor grayColor];

[self.view addSubview:bgView];

CAShapeLayer * trackLayer = [CAShapeLayer layer];

trackLayer.frame = bgView.bounds;

[bgView.layer addSublayer:trackLayer];

trackLayer.fillColor = [[UIColor blackColor] CGColor];//填充颜色,这里应该是  clearColor

trackLayer.strokeColor = [[UIColor redColor] CGColor];//边框颜色

trackLayer.opacity = 0.5;

trackLayer.lineCap = kCALineCapRound;

trackLayer.lineWidth = 4.0;  // 红色的边框宽度

UIBezierPath * path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(50, 50) radius:48 startAngle:degreesToRadians(-210) endAngle:degreesToRadians(30) clockwise:YES];

//角度是从 -210到30度,具体可以看如下图所示

trackLayer.path = [path CGPath];

运行后的结果如下

基于以上的代码,下面添加渐变的效果

CALayer * gradinetLayer = [CALayer layer];

CAGradientLayer * gradLayer1 = [CAGradientLayer layer];

gradLayer1.frame = CGRectMake(0, 0, bgView.frame.size.width/2, bgView.frame.size.height);

[gradLayer1 setColors:[NSArray arrayWithObjects:(id)[[UIColor redColor] CGColor],(id)[UIColorFromRGB(0xfde802) CGColor], nil]];

[gradLayer1 setLocations:@[@0.5,@0.9,@1 ]];

[gradLayer1 setStartPoint:CGPointMake(0.5, 1)];

[gradLayer1 setEndPoint:CGPointMake(0.5, 0)];

[gradinetLayer addSublayer:gradLayer1];

CAGradientLayer * gradLayer2 = [CAGradientLayer layer];

gradLayer2.frame = CGRectMake(bgView.frame.size.width/2, 0, bgView.frame.size.width/2, bgView.frame.size.height);

[gradLayer2 setColors:[NSArray arrayWithObjects:(id)[UIColorFromRGB(0xfde802) CGColor],(id)[[UIColor blueColor] CGColor], nil]];

[gradLayer2 setStartPoint:CGPointMake(0.5, 0)];

[gradLayer2 setEndPoint:CGPointMake(0.5, 1)];

[gradinetLayer addSublayer:gradLayer2];

//[gradinetLayer setMask:trackLayer];

[bgView.layer addSublayer:gradinetLayer];

本文转自  张江论坛   转载请注明 http://www.999dh.net/home.php?mod=space&uid=1&do=blog&quickforward=1&id=328

以上的代码运行后得到的结果如下:

解释如下:

setLocations  理论上来说,是设置 colors的显示区域的(这里还未弄清楚原理)

setStartPoint 是颜色的开始渐变的开始点,默认的是(0,0)也就是左上角

setEndPoint 是颜色的停止渐变的点,默认的是(1,1)

如果按默认的来,gradLayer1 的颜色渐变应该是从左上角由redcolor渐变到右下角(颜色为 0xfde802)

而代码中设置的 startPoint为(0.5,1),指的是在x轴中间,y轴底部;endPoint为(0.5,0)指的是在x轴中间,y轴顶部。

最后将代码[gradinetLayer setMask:trackLayer]; 注释去掉,得到如下的运行结果

这里主要的作用就是 setMask的功劳,但是为什么trackLayer的strokeColor没有生效,这里也不是很清楚。(哎,不懂的太多了哎)

IOS CAShapeLayer CAGradientLayer UIBezierPath 使用实例,布布扣,bubuko.com

时间: 2024-10-25 11:56:00

IOS CAShapeLayer CAGradientLayer UIBezierPath 使用实例的相关文章

iOS关于CAShapeLayer与UIBezierPath的知识内容

使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 . 1:UIBezierPath: UIBezierPath是在 UIKit 中的一个类,继承于NSObject,可以创建基于矢量的路径.此类是Core Graphics框架关于path的一个OC封装.使用此类可以定义常见的圆形.多边形等形状 .我们使用直线.弧(arc)来创建复杂的曲线形状.每一个直线段或者曲线段的结束的地方是下一个的开始的地方.每一个连接的直线或者曲线段的集

iOS学习:CAShapeLayer与UIBezierPath动画

CAShapeLayer与UIBezierPath动画: CAShapeLayer与UIBezierPath的动画,就离不开 CABasicAnimation:也将会使用到 strokeEnd.strokeStart.lineWidth 三个属性: 先做一条贝塞尔曲线: UIBezierPath *path = [UIBezierPath bezierPath]; [path moveToPoint:CGPointMake(40, 80)]; [path addCurveToPoint:CGPo

IOS Animation-CAShapeLayer、UIBezierPath与Animation的结合

在阅读本文之前,对CAShapeLayer.UIBezierPath不熟悉的话,可以先阅读文章 贝塞尔曲线与Layer 如果对动画不熟悉的话,先阅读文章 动画基础.深入 Layer是绘图的画板,Bezier是画图的画笔,Animation是画图的动作.现在我们可以通过下面例子更好的让它们更好地结合在一起. 1)画一个小屋子动画 我们首先通过定义CAShapeLayer画板,然后定义path来确定画图路径.最后使用动画.如下面代码 1 //让一个屋子的线画起来的动画效果 2 func addCAS

使用CAShapeLayer和UIBezierPath画一个自定义半圆弧button

通常我们使用系统自带的UIButton时,一般都是Rect矩形形式的,或则美工给出一张半圆弧的按钮,如图为一张半圆加三角形的按钮,而此时,如果给按钮添加点击事件时,响应事件依然为矩形区域,不符合我们的需求: 本文为解决这样的按钮问题: 如下图:使用CAShapeLayer和UIBezierPath画了一个button,这个按钮由一个半圆弧和三角形构成,现在我们需要点击黄颜色区域时,响应按钮点击事件,弹出对话框,其他白色区域,不响应点击事件: 第一步: 如下图,自定义一个类,CustomButto

使用CAShapeLayer与UIBezierPath画出想要的图形(转)

使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 步骤: 1.新建UIBezierPath对象bezierPath 2.新建CAShapeLayer对象caShapeLayer 3.将bezierPath的CGPath赋值给caShapeLayer的path,即caShapeLayer.path = bezierPath.CGPath 4.把caShapeLayer添加到某个显示该图形的layer中 下面的小例子是一个环形的p

使用CAShapeLayer与UIBezierPath画出想要的图形

使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 步骤: 1.新建UIBezierPath对象bezierPath 2.新建CAShapeLayer对象caShapeLayer 3.将bezierPath的CGPath赋值给caShapeLayer的path,即caShapeLayer.path = bezierPath.CGPath 4.把caShapeLayer添加到某个显示该图形的layer中 下面的小例子是一个环形的p

iOS开发- UICollectionView详解+实例

iOS开发- UICollectionView详解+实例 本章通过先总体介绍UICollectionView及其常用方法,再结合一个实例,了解如何使用UICollectionView. UICollectionView 和 UICollectionViewController 类是iOS6 新引进的API,用于展示集合视图,布局更加灵活,可实现多列布局,用法类似于UITableView 和 UITableViewController 类. 使用UICollectionView 必须实现UICol

ios CoreData 用父类的实例对象person接收存有子类的数组,打印person.class ,结果是子类类名?还是父类类名(已解决)

新建Person类 person的子类 Student Teacher 今天做数据库封装时想到的,因为查询出的结果都继承自NSManagerObject,但是他的子类属性又不一定一样,所以我就想我在在查询之后能不能判断他是那个子类并且按照子类的属性进行赋值,所以首先我要数组存的对象的类进行判断 测试如下:(把主要代码贡献如下,其他文件自己建议下吧,很简单) NSMutableArray * array = [NSMutableArray array]; NSMutableArray * arra

用CAShapeLayer和UIBezierPath和CABaseAnimation制作动画折线图

// 创建layer并设置属性 CAShapeLayer *layer = [CAShapeLayer layer]; layer.fillColor = [UIColor clearColor].CGColor; layer.lineWidth = 2.0f; layer.lineCap = kCALineCapRound; layer.lineJoin = kCALineJoinRound; layer.strokeColor = [UIColor redColor].CGColor; [s