Quartz 2D之进度条

Quartz 2D之进度条_第1张图片

先来个样子看看效果

首先想要做这个进度条,你得先会画圆

初始化一个view并在drawRect方法中实现


Quartz 2D之进度条_第2张图片


bezierPathWithArcCenter:radius:startAngle:endAngle:clockwise: 的参数定义了我们想要的arc的圆,以及arc的起点和终点。

所以我们只需要将 ‘’radius‘’ 变成slider的value就可以了

在view的.h文件中初始化一个进度值


Quartz 2D之进度条_第3张图片

在slider的方法中将值传递过去


Quartz 2D之进度条_第4张图片

在.m文件中的drawRect重新写好赋值


Quartz 2D之进度条_第5张图片

这时千万别以为就ok拉。

注意:drawRect如果是手动调用的话,是不会创建跟view相关联的上下文

所以,重点来了 调用progressValue的set方法 并在其中完成重绘


Quartz 2D之进度条_第6张图片

setNeedsDisplay:重绘(系统自动帮你调用drawRect:)

此时进度条完成

你可能感兴趣的:(Quartz 2D之进度条)