iOS 中 CAShapeLayer 的使用( 等待删除的博文)

本文深入探讨了CAShapeLayer在CoreAnimation框架中的作用及其与贝塞尔曲线结合实现高效图形渲染的技术原理。通过设置贝塞尔曲线路径、调整线条属性和动画效果,展示了如何在无需调用view的drawRect方法的情况下,实现复杂图形的绘制。重点介绍了StrokeStart与StrokeEnd动画的使用,以及如何利用这些技术特性实现圆形进度条的效果。

 等待删除。

 

1、CAShapeLayer 简介

  • 1、CAShapeLayer继承至CALayer,可以使用CALayer的所有属性值
  • 2、CAShapeLayer需要与贝塞尔曲线配合使用才有意义
  • 3、使用CAShapeLayer与贝塞尔曲线可以实现不在view的drawRect方法中画出一些想要的图形
  • 4、CAShapeLayer属于CoreAnimation框架,其动画渲染直接提交到手机的GPU当中,相较于view的drawRect方法使用CPU渲染而言,   其效率极高,能大大优化内存使用情况
 
 

 
效果:
 
 
2、贝塞尔曲线与 CAShapeLayer 的关系

  • 1、CAShapeLayer中有Shape这个单词,顾名思义,它需要一个形状才能生效
  • 2、贝塞尔曲线可以创建基于矢量的路径
  • 3、贝塞尔曲线给CAShapeLayer提供路径,CAShapeLayer在提供的路径中进行渲染,路径会闭环,所以路径绘制出了Shape
  • 4、用于CAShapeLayer的贝塞尔曲线作为path,其path是一个首尾相接的闭环的曲线,即使该贝塞尔曲线不是一个闭环的曲线
 
一阶贝塞尔曲线
二阶贝塞尔曲线
三阶贝塞尔曲线
四阶贝塞尔曲线
五阶贝塞尔曲线
 
然后是通过代码直接体现贝塞尔曲线和CAShapeLayer之间的关系:
 
 
3、StrokeStart 与 StrokeEnd 动画

  • 1、将ShapeLayer的fillColor设置成透明背景
  • 2、设置线条的宽度(lineWidth)的值
  • 3、设置线条的颜色
  • 4、将strokeStart值设定成0,然后让strokeEnd的值变化触发隐式动画
 
 
然后为了能实现圆形进度条的效果:
效果就是:
 
将上面的strokeStart也设置,但是注意:strokeStart必须要小于strokeEnd,否则会不画出线的情况。
 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值