繪圖的步驟：1.獲取上下文 2.創(chuàng)建路徑（描述路徑）3.把路徑添加到上下文4.渲染上下文
為什么要在drawRect里繪圖淹仑，只有在這個(gè)方法里面才能獲取到跟View的layer相關(guān)的圖形上下文
什么時(shí)候調(diào)用：當(dāng)這個(gè)view要現(xiàn)實(shí)的時(shí)候才會(huì)調(diào)用drawRect繪制圖形，一般在viewWillAppear之后(調(diào)用一次跟viewDidLoad一樣加載的時(shí)候調(diào)用一次，自己可以實(shí)現(xiàn)調(diào)用)
1.自己創(chuàng)建路徑的方法
- (void)drawRect:(CGRect)rect
{
//1.獲取圖形上下文
CGContextRef context=UIGraphicsGetCurrentContext();
//2.描述路徑
//創(chuàng)建路徑
CGMutablePathRef path=CGPathCreateMutable();
//設(shè)置起點(diǎn) path：給哪個(gè)路徑設(shè)置起點(diǎn)
CGPathMoveToPoint(path, NULL, 50, 50);
//添加一根線到某個(gè)點(diǎn)
CGPathAddLineToPoint(path, NULL, 100, 100);
//3.把路徑添加到上下文
CGContextAddPath(context, path);
//4.渲染上下文
CGContextStrokePath(context);
}
2.用系統(tǒng)的默認(rèn)路徑繪圖
- (void)drawRect:(CGRect)rect
{
//獲取圖形上下文
CGContextRef context=UIGraphicsGetCurrentContext();
//描述路徑
CGContextMoveToPoint(context, 50, 50);
CGContextAddLineToPoint(context, 100, 100);
//默認(rèn)下一根線的起點(diǎn)就是上一根線的終點(diǎn)
CGContextAddLineToPoint(context, 120, 100);
//多根線 但是是一個(gè)路徑不能分別設(shè)置顏色（可以用自創(chuàng)建路徑或UIBezierPath）
CGContextMoveToPoint(context, 50, 50);
CGContextAddLineToPoint(context, 100, 100);
//繪制曲線
CGContextMoveToPoint(context, 80, 50);
//cpx cpy :控制點(diǎn)的x,y
// CGContextAddQuadCurveToPoint(<#CGContextRef _Nullable c#>, <#CGFloat cpx#>, CGFloat cpy, <#CGFloat x#>, <#CGFloat y#>)
CGContextAddQuadCurveToPoint(context, 150, 20, 120, 100);
//設(shè)置繪圖狀態(tài)浦妄，一定要在渲染之前
//顏色
[[UIColor greenColor] setStroke];
//線寬
CGContextSetLineWidth(context, 10);
//設(shè)置連接樣式
CGContextSetLineJoin(context, kCGLineJoinBevel);
//設(shè)置頂角樣式
CGContextSetLineCap(context, kCGLineCapRound);
//渲染上下文
CGContextStrokePath(context);
}
3.用UIBezierPath 繪圖
- (void)drawRect:(CGRect)rect
{
//UIKit 已經(jīng)封裝了一些繪圖的功能
//貝塞爾路徑
//創(chuàng)建路徑
UIBezierPath*path=[UIBezierPath bezierPath];
//設(shè)置起點(diǎn)
[path moveToPoint:CGPointMake(50, 50)];
//添加一根線到某個(gè)點(diǎn)
[path addLineToPoint:CGPointMake(100, 100)];
path.lineWidth=10;
[[UIColor greenColor]set];
path.lineCapStyle=kCGLineCapRound;
path.lineJoinStyle=kCGLineJoinBevel;
//繪制路徑
[path stroke];
//創(chuàng)建路徑
UIBezierPath*path1=[UIBezierPath bezierPath];
//設(shè)置起點(diǎn)
[path1 moveToPoint:CGPointMake(80, 50)];
//添加一根線到某個(gè)點(diǎn)
[path1 addLineToPoint:CGPointMake(130, 100)];
path1.lineWidth=10;
[[UIColor blueColor]set];
path1.lineCapStyle=kCGLineCapRound;
path1.lineJoinStyle=kCGLineJoinBevel;
//繪制路徑
[path1 stroke];
//圓弧
//Center:圓心
//startAngle:開始弧度
//clockwise:YES:順時(shí)針 NO:逆時(shí)針
UIBezierPath *path3=[UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:100 startAngle:0 endAngle:M_PI_2 clockwise:YES];
//添加一根線到圓心
[path3 addLineToPoint:CGPointMake(100, 100)];
//封閉路徑，從路徑的終點(diǎn)到起點(diǎn)
// [path3 closePath];
// [path3 stroke];
//填充：必須是一個(gè)完整的封閉路徑，默認(rèn)就會(huì)自動(dòng)關(guān)閉路徑
[path3 fill];
}
自己實(shí)現(xiàn)圓形進(jìn)度條
#import <UIKit/UIKit.h>
@interface DrawView : UIView
@property(nonatomic,assign)CGFloat progress;
@end
-(void)setProgress:(CGFloat)progress
{
_progress=progress;
//重繪 应又，系統(tǒng)會(huì)先創(chuàng)建與view相關(guān)的上下文，然后再調(diào)用
[self setNeedsDisplay];
}
//注意：drawRect不能手動(dòng)調(diào)用乏苦，因?yàn)閳D形上下文我們自己創(chuàng)建不了株扛，只能由系統(tǒng)幫我們創(chuàng)建，并且傳遞給我們
- (void)drawRect:(CGRect)rect
{
CGFloat radius=rect.size.width*0.5;
CGPoint center=CGPointMake(radius, radius);
//-M_PI_2 開始弧度圓的定點(diǎn)
//_progress*M_PI*2 _progress百分多少 M_PI*2 360度
CGFloat endA = -M_PI_2 + _progress*M_PI*2;
UIBezierPath*path=[UIBezierPath bezierPathWithArcCenter:center radius:radius-2 startAngle:-M_PI_2 endAngle:endA clockwise:YES];
[path stroke];
}
畫餅狀圖
- (void)drawRect:(CGRect)rect
{
NSArray*arr=@[@36,@34,@30];
CGFloat radius=rect.size.width*0.5;
CGPoint center=CGPointMake(radius, radius);
CGFloat startA=0;
CGFloat endA=0;
CGFloat angle=0;
for (int i=0; i<arr.count; i++)
{
startA=endA;
angle=[arr[i] doubleValue]/100.0*M_PI*2;
endA=startA+angle;
UIBezierPath*path=[UIBezierPath bezierPathWithArcCenter:center radius:radius-2 startAngle:startA endAngle:endA clockwise:YES];
[path addLineToPoint:center];
[[self colorRandom] set];
[path fill];
}
}
-(UIColor*)colorRandom
{
CGFloat r=arc4random_uniform(256)/255.0;
CGFloat g=arc4random_uniform(256)/255.0;
CGFloat b=arc4random_uniform(256)/255.0;
return [UIColor colorWithRed:r green:g blue:b alpha:1.0];
}
畫柱狀圖
- (void)drawRect:(CGRect)rect
{
NSArray*arr=@[@36,@34,@30];
CGFloat w=rect.size.width/(2*arr.count-1);
CGFloat x=0;
CGFloat y=0;
CGFloat h=0;
for (int i=0; i<arr.count; i++)
{
x=2*w*i;
h=[arr[i] floatValue]/100.0 *rect.size.height;
y=rect.size.height-h;
UIBezierPath*path=[UIBezierPath bezierPathWithRect:CGRectMake(x, y, w, h)];
[[self colorRandom] set];
[path fill];
}
}
-(UIColor*)colorRandom
{
CGFloat r=arc4random_uniform(256)/255.0;
CGFloat g=arc4random_uniform(256)/255.0;
CGFloat b=arc4random_uniform(256)/255.0;
return [UIColor colorWithRed:r green:g blue:b alpha:1.0];
}
NSTimer
//NSTimer很少用于繪畫邑贴，因?yàn)檎{(diào)度優(yōu)先級(jí)比較低席里，并不會(huì)準(zhǔn)時(shí)調(diào)用
-(void)awakeFromNib
{
// [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];
CADisplayLink*link=[CADisplayLink displayLinkWithTarget:self selector:@selector(timeChange)];
//想讓定時(shí)器工作,必須得要把它添加到主運(yùn)行循環(huán)
[link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
}
//在繪圖當(dāng)中, 我們一般使用CADisplayLink.因?yàn)樗蛃etNeedsDisplay調(diào)用時(shí)機(jī)是一樣的,都是當(dāng)下一次屏幕刷新的時(shí)候調(diào)用.
//CADisplayLink:每次屏幕刷新的時(shí)候就會(huì)調(diào)用，屏幕一般一秒刷新60次
-(void)timeChange
{
//注意：這個(gè)方法并不會(huì)馬上調(diào)用drawRect拢驾，其實(shí)這個(gè)方法只是給當(dāng)前控件添加刷新的標(biāo)記奖磁，等下一次屏幕刷新的時(shí)候才會(huì)調(diào)用drawRect
[self setNeedsDisplay];
}
