繪圖的步驟：1.獲取上下文 2.創建路徑（描述路徑）3.把路徑添加到上下文4.渲染上下文
為什么要在drawRect里繪圖，只有在這個方法里面才能獲取到跟View的layer相關的圖形上下文
什么時候調用：當這個view要現實的時候才會調用drawRect繪制圖形，一般在viewWillAppear之后(調用一次跟viewDidLoad一樣加載的時候調用一次，自己可以實現調用)
1.自己創建路徑的方法
- (void)drawRect:(CGRect)rect
{
//1.獲取圖形上下文
CGContextRef context=UIGraphicsGetCurrentContext();
//2.描述路徑
//創建路徑
CGMutablePathRef path=CGPathCreateMutable();
//設置起點 path：給哪個路徑設置起點
CGPathMoveToPoint(path, NULL, 50, 50);
//添加一根線到某個點
CGPathAddLineToPoint(path, NULL, 100, 100);
//3.把路徑添加到上下文
CGContextAddPath(context, path);
//4.渲染上下文
CGContextStrokePath(context);
}
2.用系統的默認路徑繪圖
- (void)drawRect:(CGRect)rect
{
//獲取圖形上下文
CGContextRef context=UIGraphicsGetCurrentContext();
//描述路徑
CGContextMoveToPoint(context, 50, 50);
CGContextAddLineToPoint(context, 100, 100);
//默認下一根線的起點就是上一根線的終點
CGContextAddLineToPoint(context, 120, 100);
//多根線 但是是一個路徑不能分別設置顏色（可以用自創建路徑或UIBezierPath）
CGContextMoveToPoint(context, 50, 50);
CGContextAddLineToPoint(context, 100, 100);
//繪制曲線
CGContextMoveToPoint(context, 80, 50);
//cpx cpy :控制點的x,y
// CGContextAddQuadCurveToPoint(<#CGContextRef _Nullable c#>, <#CGFloat cpx#>, CGFloat cpy, <#CGFloat x#>, <#CGFloat y#>)
CGContextAddQuadCurveToPoint(context, 150, 20, 120, 100);
//設置繪圖狀態，一定要在渲染之前
//顏色
[[UIColor greenColor] setStroke];
//線寬
CGContextSetLineWidth(context, 10);
//設置連接樣式
CGContextSetLineJoin(context, kCGLineJoinBevel);
//設置頂角樣式
CGContextSetLineCap(context, kCGLineCapRound);
//渲染上下文
CGContextStrokePath(context);
}
3.用UIBezierPath 繪圖
- (void)drawRect:(CGRect)rect
{
//UIKit 已經封裝了一些繪圖的功能
//貝塞爾路徑
//創建路徑
UIBezierPath*path=[UIBezierPath bezierPath];
//設置起點
[path moveToPoint:CGPointMake(50, 50)];
//添加一根線到某個點
[path addLineToPoint:CGPointMake(100, 100)];
path.lineWidth=10;
[[UIColor greenColor]set];
path.lineCapStyle=kCGLineCapRound;
path.lineJoinStyle=kCGLineJoinBevel;
//繪制路徑
[path stroke];
//創建路徑
UIBezierPath*path1=[UIBezierPath bezierPath];
//設置起點
[path1 moveToPoint:CGPointMake(80, 50)];
//添加一根線到某個點
[path1 addLineToPoint:CGPointMake(130, 100)];
path1.lineWidth=10;
[[UIColor blueColor]set];
path1.lineCapStyle=kCGLineCapRound;
path1.lineJoinStyle=kCGLineJoinBevel;
//繪制路徑
[path1 stroke];
//圓弧
//Center:圓心
//startAngle:開始弧度
//clockwise:YES:順時針 NO:逆時針
UIBezierPath *path3=[UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:100 startAngle:0 endAngle:M_PI_2 clockwise:YES];
//添加一根線到圓心
[path3 addLineToPoint:CGPointMake(100, 100)];
//封閉路徑，從路徑的終點到起點
// [path3 closePath];
// [path3 stroke];
//填充：必須是一個完整的封閉路徑，默認就會自動關閉路徑
[path3 fill];
}
自己實現圓形進度條
#import <UIKit/UIKit.h>
@interface DrawView : UIView
@property(nonatomic,assign)CGFloat progress;
@end
-(void)setProgress:(CGFloat)progress
{
_progress=progress;
//重繪 ，系統會先創建與view相關的上下文，然后再調用
[self setNeedsDisplay];
}
//注意：drawRect不能手動調用，因為圖形上下文我們自己創建不了，只能由系統幫我們創建，并且傳遞給我們
- (void)drawRect:(CGRect)rect
{
CGFloat radius=rect.size.width*0.5;
CGPoint center=CGPointMake(radius, radius);
//-M_PI_2 開始弧度圓的定點
//_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很少用于繪畫，因為調度優先級比較低，并不會準時調用
-(void)awakeFromNib
{
// [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];
CADisplayLink*link=[CADisplayLink displayLinkWithTarget:self selector:@selector(timeChange)];
//想讓定時器工作,必須得要把它添加到主運行循環
[link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
}
//在繪圖當中, 我們一般使用CADisplayLink.因為他和setNeedsDisplay調用時機是一樣的,都是當下一次屏幕刷新的時候調用.
//CADisplayLink:每次屏幕刷新的時候就會調用，屏幕一般一秒刷新60次
-(void)timeChange
{
//注意：這個方法并不會馬上調用drawRect，其實這個方法只是給當前控件添加刷新的標記，等下一次屏幕刷新的時候才會調用drawRect
[self setNeedsDisplay];
}
