CAShapeLayer

一 简介

1,CAShapeLayer继承至CALayer,可以使用CALayer的所有属性

2,CAShapeLayer需要与贝塞尔曲线配合使用才有意义;单独使用毫无意义

3,使用CAShapeLayer与贝塞尔可以实现不在view的drawRect方法中画出一些想要的图形;

4,CAShapeLayer属于Core  Animation框架,其动画渲染直接提交到手机的GPU当中,相较于view的drawRect方法使用CPU渲染而言,其效率极高,

能大大优化内存使用情况。

drawRect 属于Core Graphics 框架,走CPU,耗性能较大。

5,示例:

    // 创建shapeLayer
    _shapeLayer = [CAShapeLayer layer];
    _shapeLayer.frame         = (CGRect){CGPointMake(0, 0), CGSizeMake(200, 200)};
    _shapeLayer.position      = self.view.center;
    _shapeLayer.path          = [self getStar1BezierPath].CGPath; //从贝塞尔曲线中获取path
    _shapeLayer.fillColor     = [UIColor clearColor].CGColor;   //填充色
    _shapeLayer.strokeColor   = [UIColor redColor].CGColor;     //路径-线颜色
    _shapeLayer.lineWidth     = 2.f;        //stroker宽度
    [self.view.layer addSublayer:_shapeLayer];

二贝赛尔曲线与CAShapeLayer的关系

1,CAShapeLayer,含shape,顾名思义,它需要一个形状才能生效;

2,贝塞尔曲线可以创建基于矢量的路径

3,贝塞尔曲线给CAShapeLayer提供路径,CAShapeLayer在提供的路径中进行渲染,路径会闭环,所以路径绘制出了shape。

4,用于CAShapeLayer的贝塞尔曲线作为path,其path是一个首尾相接的闭环的曲线,即使该贝塞尔曲线不是一个闭环的曲线。

shape.masksToBounds = YES ; //禁止内容显示超出CAShapeLayer的frame值。

贝塞尔曲线的frame值与CAShapeLayer的frame值互不干扰,CAShaperLayer的frame值不能小于贝塞尔曲线的frame值。

三strokeStart与strokeEnd动画

1,将shapeLayer的fillColor设置为透明背景

2,设置线条的宽度(lineWidth)的值

3,设置线条的颜色

4,将strokeStart值设定为0,然后让stokeEnd的值变化触发隐式动画

四 用CAShaperLayer实现圆形进度条效果

时间: 2024-10-24 21:49:42

CAShapeLayer的相关文章

CAShapeLayer使用

UIView *showView = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)]; [self.view addSubview:showView]; showView.backgroundColor = [UIColor whiteColor]; UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100 / 2.f, 100

CAShapeLayer的path动画

效果 源码 https://github.com/YouXianMing/Animations // // CAShapeLayerPathController.m // Animations // // Created by YouXianMing on 15/11/17. // Copyright © 2015年 YouXianMing. All rights reserved. // #import "CAShapeLayerPathController.h" #import &

用CAShapeLayer写股市K线图动画效果

说明 入市有风险,炒股需谨慎.(因项目需求,本人提供了写这种效果的源码) 效果 源码 // // ViewController.m // Path // // Created by YouXianMing on 15/5/11. // Copyright (c) 2015年 YouXianMing. All rights reserved. // #import "ViewController.h" @interface ViewController () @property (non

[控件] 动态实时设置CAShapeLayer贝塞尔曲线的坐标点

动态实时设置CAShapeLayer贝塞尔曲线的坐标点 效果图: 源码: PathDirectionView.h 与 PathDirectionView.m // // PathDirectionView.h // Path // // Created by XianMingYou on 15/2/27. // Copyright (c) 2015年 XianMingYou. All rights reserved. // #import <UIKit/UIKit.h> #import &qu

iOS学习:CAShapeLayer与UIBezierPath动画

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

粒子效果 QQ粘性布局 (CAShapeLayer形状图层)

CAShapeLayer 可以根据一个路径生成一个形状: 1.基本功能的实现:(1)添加一个button:自定义button,创建一个类:绑定按钮:(2)在自定义的button类中,在awakeFromNib中对这个按钮进行初始化:设置圆角,背景颜色,字体颜色,字体大小:(3)调用取消高亮状态的方法:-setHightLighted:(4)awakeFromNib添加pan手势,(5)在pan方法中:获取偏移量:修改self.transform=CGAffine...:进行复位操作:(6)在aw

iOS关于CAShapeLayer与UIBezierPath的知识内容

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

IOS开发基础篇--CAShapeLayer的strokeStart和strokeEnd属性

http://blog.csdn.net/yixiangboy/article/details/50662704 一.案例演示 最近有一个小需求,就是要做一个圆形进度条,大概样子如下: . 在不知道有CAShapeLayer的strokeStart和strokeEnd属性的时候,我采取的方法就是实时的 移除旧的CAShapeLayer 然后重绘这个圆形的CAShapeLayer.显然这种方式的效率是不高的.后来在一次看别人Demo的时候,发现别人使用了CAShapeLayer的strokeSta

UIBezierPath 和 CAShapeLayer 画画图

画一个头戴小圆的五边形: - (void)drawPentagon{ //(1)UIBezierPath对象 UIBezierPath *aPath = [UIBezierPath bezierPath]; //开始点 [aPath moveToPoint:CGPointMake(100.0, 1.0)]; //划线点 [aPath addLineToPoint:CGPointMake(200.0, 40.0)]; [aPath addLineToPoint:CGPointMake(160, 1