說到繪圖, 就想到UIView中的一個(gè)方法: drawRect方法, 那么簡(jiǎn)單介紹一下它的作用:
1. 可以將圖形繪制到, view上(因?yàn)樵谠摲椒ㄖ? 可以獲取到跟view相關(guān)聯(lián)的圖形上下文.)
2. 什么時(shí)候被調(diào)用?
2.1 在View第一次顯示到屏幕上時(shí).(被加載到UIWindow上顯示出來的時(shí)候);
2.2 在調(diào)用View的setNeedsDisplay: 或者 setNeedsDisplayInRect: 的時(shí)候
3. rect : 是當(dāng)前控件的bounds ```
***
>###UIBezierPath的基本使用:
- UIBezierPath對(duì)象, 是對(duì)CGPathRef數(shù)據(jù)類型的封裝. path如果是基于矢量圖(面向?qū)ο髨D形, 或者是繪圖圖像), 都用直線或者曲線去創(chuàng)建.
- 使用直線, 創(chuàng)建矩形和多邊形 / 使用曲線段, 創(chuàng)建弧, 圓形或者其他復(fù)雜曲線形狀.
- 每一段都包括一個(gè),或者多個(gè)點(diǎn).
- 每一個(gè)直線段/曲線段結(jié)束的地方, 就是下一個(gè)線段開始的地方.
- 每一個(gè)連接的直線段或者曲線段的集合, 稱為: subPath.
- 一個(gè)UIBezierPath對(duì)象, 定義一個(gè)完整的路徑, 包括一個(gè)或者多個(gè)subPath.
- 創(chuàng)建path對(duì)象, 使用Path對(duì)象的過程, 是分開的, 創(chuàng)建path是第一步,具體步驟如下:
7.1: 創(chuàng)建一個(gè)Path對(duì)象.
7.2: 使用moveToPoint: 去設(shè)置出線段的起點(diǎn).```
繪圖實(shí)例(一下所有方法, 都必須在drawRect方法中調(diào)用), 一下代碼都是必要的基礎(chǔ)代碼, 路徑的屬性進(jìn)行簡(jiǎn)單描述.
1. 繪制值線段
- (void)path1{
//1. 創(chuàng)建路徑
UIBezierPath *path = [UIBezierPath bezierPath];
//2. 設(shè)置起始點(diǎn)
[path moveToPoint:CGPointMake(20, 20)];
//3. 設(shè)置結(jié)束點(diǎn)(即第二條線段的開始點(diǎn))
[path addLineToPoint:CGPointMake(100, 100)];
//4. 連線
[path stroke];
#********************************************************
#描述:
線和多邊形是一些簡(jiǎn)單形狀, 可以使用moveToPoint: 或者addLineToPoint: 方法去構(gòu)建.
moveToPoint: 設(shè)置我們想要?jiǎng)?chuàng)建形狀的起點(diǎn), 從該點(diǎn)開始我們可以使用方法addLineToPoint:
去創(chuàng)建一個(gè)形狀的線段, 也可以連續(xù)的創(chuàng)建line, 每一個(gè)line的起點(diǎn)都是先前線段的終點(diǎn),
終點(diǎn)就是制定的點(diǎn)CGPointMake.
#路徑屬性:(路徑的屬性都應(yīng)該寫在繪制路徑前面才能有效)
線寬
path.lineWidth = 5.0;
線段顏色
UIColor *color = [UIColor orangeColor];
[color set];
線條拐角
path.lineCapStyle = kCGLineCapRound;
連接點(diǎn)
path.lineJoinStyle = kCGLineJoinRound;
#********************************************************
}```
####2. 繪制多邊型(在繪制線段的基礎(chǔ)上)
```code
- (void)path2{
//1. 繪制路徑
UIBezierPath *path = [UIBezierPath bezierPath];
//2. 設(shè)置起始點(diǎn)
[path moveToPoint:CGPointMake(20, 100)];
//3. 添加線段(通過給出的點(diǎn), 連接出路徑)
[path addLineToPoint:CGPointMake(100, 100)];
[path addLineToPoint:CGPointMake(30, 200)];
[path addLineToPoint:CGPointMake(50, 50)];
[path addLineToPoint:CGPointMake(70, 200)];
//4. 閉合路徑
[path closePath];
//5. 繪制路徑
[path stroke];
}```
####3. 利用圖形上下文繪制直線
```code
- (void)contextDraw{
//1. 獲取當(dāng)前的上下文
CGContextRef cxt = UIGraphicsGetCurrentContext();
//2. 設(shè)置起始點(diǎn)
CGContextMoveToPoint(cxt, 20, 100);
//3. 設(shè)置中的
CGContextAddLineToPoint(cxt, 100, 50);
//4. 渲染上下文
CGContextDrawPath(cxt, kCGPathStroke);
#屬性: 圖形上下文的屬性************************************
//線寬
CGContextSetLineWidth(cxt, 50.0);
//顏色
CGContextSetRGBStrokeColor(cxt, 0, 1, 0, 1);
//[[UIColor redColor] set];
//線的樣式
CGContextSetLineCap(cxt, kCGLineCapRound);
//填充
[[UIColor greenColor] setFill];
#********************************************************
}```
####4. 利用上下文繪制曲線
```code
- (void)drawCurveLine{
//1. 獲取圖形上下文
CGContextRef cxt = UIGraphicsGetCurrentContext();
//2. 創(chuàng)建路徑
UIBezierPath *path = [UIBezierPath bezierPath];
//3. 設(shè)置起始點(diǎn)
[path moveToPoint:CGPointMake(20, 50)];
* //4. 設(shè)置曲線
[path addCurveToPoint:CGPointMake(200, 50) controlPoint1:CGPointMake(50, 20) controlPoint2:CGPointMake(80, 90)];
//5. 將路徑添加到上下文
CGContextAddPath(cxt, path.CGPath);
//6. 渲染上下文
CGContextDrawPath(cxt, kCGPathStroke);
}```
####5. 利用上下文繪制矩形
```code
- (void)drawSquare{
//1. 獲取圖形上下文
CGContextRef cxt = UIGraphicsGetCurrentContext();
* //2. 繪制路徑
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 20, 150, 150) cornerRadius:0];
//3. 將路徑添加到上下文
CGContextAddPath(cxt, path.CGPath);
//4. 渲染
CGContextDrawPath(cxt, kCGPathStroke);
}```
####6. 利用上下文繪制弧形
```code
- (void)drawBow{
//1. 獲取圖形上下文
CGContextRef cxt = UIGraphicsGetCurrentContext();
* //2. 繪制路徑
//參數(shù)一: 表示弧形的終點(diǎn)
//參數(shù)二: 表示起始角度(0代表: X軸正半軸, Y為0 的角度)
//參數(shù)三: 表示結(jié)束位置的角度
//參數(shù)四: 表示是否是順時(shí)針繪制
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 50) radius:50 startAngle:0 endAngle:M_PI_2 clockwise:YES];
//3. 添加到上下文
CGContextAddPath(cxt, path.CGPath);
//4. 渲染
CGContextDrawPath(cxt, kCGPathStroke);
}```
