猫猫分享，必须精品
原创文章，欢迎转载。转载请注明：翟乃玉的博客
地址：http://www.jianshu.com/notebooks/4236923/latest
一：效果图
思路
- 界面主要由一个滑杆，一个进度条组成，拖动滑竿的时候就是在上面画弧。从最上面,按顺时针画,所以,它的起始角度是-90度.结束角度也是-90度，也是从起始角度开始画,起始角度-90度, 看你下载进度是多少。假如说你下载进度是100,就是1 * 360度也就是说这个进度占你360度多少分之一。
二：代码实现
#import "ProgressView.h"
@implementation ProgressView
-(void)setProgress:(CGFloat)progress{
_progress = progress;
//如果我们手动调用drawRect,系统是不会给我们生成跟View相关联的上下文.
//系统调用drawRect的时候,才会生成跟View相关联上下文.
[self drawRect:self.bounds];
//调用setNeedsDisplay系统底层就会自动调用drawRect
[self setNeedsDisplay];
}
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
//上下文
CGContextRef ref = UIGraphicsGetCurrentContext();
//画弧路径的参数以及路径
CGPoint center = CGPointMake(rect.size.width * 0.5 , rect.size.height * 0.5 );
CGFloat radius = rect.size.width * 0.5 - 10;
CGFloat startA = -M_PI_2;
CGFloat endA = -M_PI_2 + self.progress * M_PI * 2;
//路径
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];
//设置颜色
[[UIColor greenColor] set];
//设置线的宽度
CGContextSetLineWidth(ref, 16);
//设置线条起点和终点的样式为圆角
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
//设置线条的转角的样式为圆角
CGContextSetLineJoin(UIGraphicsGetCurrentContext(), kCGLineJoinRound);
//将路径添加到上下文
CGContextAddPath(ref, path.CGPath);
//渲染
CGContextStrokePath(ref);
}
@end
三：注意问题
drawRect方法调用问题
- 当progress每次被传递的时候都需要调用，重新绘制圆弧。
- drawRect方法是不能手动调用,因为在drawRect方法中才能获取跟View相关联的上下文， 系统在调用DrawRect方法时,会自动帮你创建一个跟View相关联的上下文,并且传递给它。自己调用的,没有给drawRect方法传递上下文，所以在draw方法中拿不到上下文。
- 想要重绘,调用[self setNeedsDisplay]; 这个方法的作用就是告诉系统重新绘制View,系统就会自动帮你调用drawRect方法,系统在调用drawRect方法,它会帮你创建上下文。
ps：来简书没多久，发现好多朋友关注我，谢谢大家，虽然猫猫写博客的初衷是督促自己学习，不过能帮助别人那是再好不过的了。
ps1：博客大多是猫自己学习的过程，有错误希望及时大家指正，在此猫先谢了_ 。
ps2：有朋友问我能不能把素材发出来，之前猫猫在csdn写博客的时候很多朋友就会问我要素材或者源码学习资料之类的，在这儿，猫不会直接把代码贴出来，这里是猫最新的复习或者学习的过程总结，而不是拿来能用的东东，（当然也会有一些可以拿来直接用的东西的），如果个人需要某些资料，可以在评论里面留言或者说直接加我的微信QQ都可以，猫猫看到会第一时间回复的。
