Quartz2D.png

首先，我們看下本文學(xué)習(xí)的大綱，在本文中我們可以了解到以下知識(shí)點(diǎn)。

• Quartz2D的概念及用途
• drawRect方法的調(diào)用
• 使用Quartz2D繪制簡單圖形

Quartz2D的概念及用途

基本概念

Quartz 2D是一個(gè)二維繪圖引擎，同時(shí)支持iOS和Mac系統(tǒng)。

用途

1.繪制圖形 : 線條\三角形\矩形\圓\弧等
2.繪制文字
3.繪制\生成圖片(圖像)
4.讀取\生成PDF
5.截圖\裁剪圖片
6.自定義UI控件

我們?cè)谑褂肣uartz2D繪圖時(shí)，主要是通過圖形上下文來繪制，圖形上下文就相當(dāng)于畫布，不同類型的畫布就是決定著畫得內(nèi)容將展示在哪里。

 * Quartz2D提供了以下幾種類型的Graphics Context：
 * Bitmap Graphics Context 位圖上下文，在這個(gè)上下文上繪制或者渲染的內(nèi)容，可以獲取成圖片（需要主動(dòng)創(chuàng)建一個(gè)位圖上下文來使用，使用完畢，一定要銷毀）
 * PDF Graphics Context
 * Window Graphics Context
 * Layer Graphics Context 圖層上下文，針對(duì)UI控件的上下文
 * Printer Graphics Context

drawRect的介紹

我們通過Quartz2D繪圖，通常都是在drawRect方法中來實(shí)現(xiàn)繪制操作。
在drawRect方法中取得上下文后，就可以繪制東西到view上了。

View內(nèi)部有個(gè)layer（圖層）屬性，drawRect:方法中取得的是一個(gè)Layer Graphics Context，因此，繪制的東西其實(shí)是繪制到view的layer上去了

為什么要實(shí)現(xiàn)drawRect:方法才能繪圖到view上？

因?yàn)樵赿rawRect:方法中才能取得跟view相關(guān)聯(lián)的圖形上下文

drawRect:方法的調(diào)用？

1.當(dāng)view第一次顯示到屏幕上時(shí)，系統(tǒng)會(huì)創(chuàng)建好一個(gè)跟當(dāng)前view相關(guān)的Layer上下文
2.系統(tǒng)會(huì)通過此上下文，在drawRect:方法中繪制好當(dāng)前view的內(nèi)容
3.主動(dòng)讓view重繪內(nèi)容的時(shí)候，調(diào)用setNeedsDisplay或者setNeedsDisplayInRect:。我們主動(dòng)調(diào)用drawRect:方法是無效的。
4.調(diào)用view的setNeedsDisplay或者setNeedsDisplayInRect:時(shí)。
5.注意：setNeedsDisplay和setNeedsDisplayInRect:方法調(diào)用后，屏幕并不是立即刷新，而是會(huì)在下一次刷新屏幕的時(shí)候把繪制的內(nèi)容顯示出來。

使用Path 對(duì)象時(shí)的內(nèi)存管理問題?
使用Path對(duì)象的時(shí)候，一定要注意內(nèi)存的問題，一定要注意內(nèi)存釋放。

1.凡是遇到 retain 、 copy 、 create 出的對(duì)象, 都需要進(jìn)行 release
2.但是CGPathCreateMutable()不是 OC 方法, 所以不是調(diào)用 某個(gè)對(duì)象的 release方法
3.CGXxxxxCreate 對(duì)應(yīng)的就有 CGXxxxxRelease。
4.通過 CFRelease(任何類型)可以釋放任何類型。
 CFRelease屬于更底層的cocafoundation框架
5.ARC僅僅是處理oc的引用計(jì)數(shù)的問題

繪制基本圖形

1.繪制直線

直線.png

//1.獲取圖形上下文,目前我們現(xiàn)在使用的都是UIGraphics開頭,CoreGraphics,項(xiàng)目的簡稱CG
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //2.描述路徑
    //2.1 創(chuàng)建路徑
    CGContextMoveToPoint(ctx, 0, 0);
    //2.2 添加線到一個(gè)點(diǎn)
    CGContextAddLineToPoint(ctx, 50, 30);
    //3.完成路線
    CGContextStrokePath(ctx);

2.繪制圓弧

圓弧.png

    CGContextRef ctx = UIGraphicsGetCurrentContext();
    /*
     * cg_nullable  上下文
     * x 圓點(diǎn)坐標(biāo) x
     * x 圓點(diǎn)坐標(biāo) y
     * radius   半徑
     * startAngle 起點(diǎn)弧度
     * endAngle   重點(diǎn)弧度
     * clockwise  0代表順時(shí)針 1代表逆時(shí)針
     */
    CGContextAddArc(ctx, 20, 20,20, M_PI_2, M_PI, 1);
    CGContextStrokePath(ctx);

繪制圓弧閉合

圓弧閉合.png

CGContextRef ctx = UIGraphicsGetCurrentContext();
    /*
     * cg_nullable  上下文
     * x 圓點(diǎn)坐標(biāo) x
     * x 圓點(diǎn)坐標(biāo) y
     * radius   半徑
     * startAngle 起點(diǎn)弧度
     * endAngle   重點(diǎn)弧度
     * clockwise  0代表順時(shí)針 1代表逆時(shí)針
     */
    CGContextAddArc(ctx, 50, 50,20, M_PI_2, M_PI, 1);
    CGContextClosePath(ctx);
    CGContextStrokePath(ctx);

3.繪制矩形

矩形.png

 // 獲取context對(duì)象
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    // 創(chuàng)建路勁
    CGContextAddRect(ctx, CGRectMake(20,20, 100, 100));
    // 渲染
    CGContextStrokePath(ctx);

4.繪制扇形

扇形.png

//1.獲取圖形上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //繪制曲線
    CGFloat centerX = 50;
    CGFloat centerY = 100;
    CGFloat radius = 50;
    //添加一根線 重點(diǎn)需要一根線，否則直接閉合的話，會(huì)把圓弧的起點(diǎn)和重點(diǎn)直接連接起來
    CGContextMoveToPoint(ctx, centerX, centerY);
    /*
     CGContextRef: 圖形上下文
     x,y: 開始畫的坐標(biāo)
     radius: 半徑
     startAngle, endAngle: 開始的弧度,結(jié)束的弧度
     
     */
    CGContextAddArc(ctx, centerX, centerY, radius, M_PI, M_PI_2, NO);
    [[UIColor cyanColor] set]; // 填充顏色
    CGContextFillPath(ctx); // 填充 填充就是填滿，不填充就是一個(gè)輪廓
    //關(guān)閉線段
    CGContextClosePath(ctx);
    //渲染
    CGContextStrokePath(ctx);

5.繪制橢圓

橢圓.png

// 獲取context對(duì)象
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    // 創(chuàng)建內(nèi)切橢圓
    CGContextAddEllipseInRect(ctx, CGRectMake(20, 20, 100, 50));
    // 渲染
    CGContextStrokePath(ctx);

6.繪制三角形

三角形.png

    // 獲取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    // 設(shè)置起點(diǎn)
    CGContextMoveToPoint(ctx, 50, 50);
    // 設(shè)置兩條線的點(diǎn)
    CGContextAddLineToPoint(ctx, 50, 150);
    CGContextAddLineToPoint(ctx, 150, 150);
    // 閉合path
    CGContextClosePath(ctx);
    // 開始渲染
    CGContextStrokePath(ctx);

附上git地址：
使用Quartz2D繪制直線、矩形、三角形、橢圓和圓弧git地址