Quart2D 知識(shí)點(diǎn)

1> Quartz2D簡(jiǎn)介
*  PPT簡(jiǎn)介
    什么是Quartz2D?二維的繪圖引擎
    什么是二維?平面
    什么是引擎?經(jīng)包裝的函數(shù)庫(kù)蔫缸，方便開發(fā)者使用惫皱。也就是說蘋果幫我們封裝了一套繪圖的函數(shù)庫(kù)
    同時(shí)支持iOS和Mac系統(tǒng)什么意思?用Quartz2D寫的同一份代碼，既可以運(yùn)行在iphone上又可以運(yùn)行在mac上晃痴，可以跨平臺(tái)開發(fā)曹铃。
    開發(fā)中比較常用的是截屏/裁剪/自定義UI控件缰趋。
    Quartz2D在iOS開發(fā)中的價(jià)值就是自定義UI控件。
    圖形上下文的數(shù)據(jù)類型和作用。
    有多少種上下文秘血。
    自定義控件的步驟味抖。
    為什么要實(shí)現(xiàn)drawRect:方法，因?yàn)橹挥性赿rawRect:方法中才能獲取到上下文

2>  Quartz2D繪圖演練
    在哪畫? storyboard拖一個(gè)view灰粮，在這個(gè)view里面畫一些東西仔涩。
    自定義view:需要繪圖，就必須重寫drawRect:方法
*   HMLineView:繪制線段 必須畫圖分析
    drawRect:方法自動(dòng)生成粘舟，意味著什么?這個(gè)方法很重要熔脂。
        1> 什么時(shí)候調(diào)用:視圖要顯示的時(shí)候，才會(huì)調(diào)用,viewDidLoad后才會(huì)調(diào)用蓖乘，因?yàn)槟菚r(shí)候還沒顯示視圖锤悄。
        2> 作用:用來繪圖
    * 畫一條線
    1> 獲取圖形上下文
    CG:表示這個(gè)類在CoreGraphics框架里  Ref:引用
    目前學(xué)的上下文都跟UIGraphics有關(guān)，想獲取圖形上下文嘉抒，首先敲UIGraphics零聚。
    2> 拼接路徑：一般開發(fā)中用貝塞爾路徑，里面封裝了很多東西些侍，可以幫我畫一些基本的線段隶症，矩形，圓等等岗宣。
        創(chuàng)建貝塞爾路徑
        起點(diǎn):moveToPoint
        終點(diǎn):addLineToPoint
    3> 把路徑添加到上下文
        CGPath轉(zhuǎn)換：UIKit框架轉(zhuǎn)CoreGraphics直接CGPath就能轉(zhuǎn)
    4> 把上下文渲染到視圖蚂会，圖形上下文本身不具備顯示功能。
        PPT畫圖分析為什么要這樣做?首先獲取圖形上下文耗式，然后描述路徑胁住，把路徑添加到上下文，渲染到視圖刊咳，圖形上下文相當(dāng)于一個(gè)內(nèi)存緩存區(qū)彪见，在內(nèi)存里面操作是最快的，比直接在界面操作快多了娱挨。

    * 在添加一根線
        直接addLineToPoint余指，因?yàn)槁窂绞瞧唇拥模J(rèn)下一條線的起點(diǎn)是上一條線的終點(diǎn)跷坝。

    * 畫兩跟不連接的線
        1> 第二次畫的時(shí)候酵镜，重新設(shè)置起點(diǎn)，然后畫線柴钻。一個(gè)路徑可以包含多條線段淮韭。
        2> 新創(chuàng)建一個(gè)路徑，添加到上下文贴届。開發(fā)中建議使用這種靠粪，比較容易控制每根線足丢。

    * 設(shè)置繪圖狀態(tài)
        線段怎么加粗。
        繪圖狀態(tài)調(diào)用順序：只要在渲染之前就好了庇配，在渲染的時(shí)候才會(huì)去看繪圖的最終狀態(tài)。

    * 畫曲線
    PPT分析：3個(gè)點(diǎn)绍些，起點(diǎn)捞慌，終點(diǎn)，控制點(diǎn)柬批。

*   HMShapeView:繪制圖形
    * triangle三角形（畫圖分析）
    * 關(guān)閉路徑closePath：從路徑的終點(diǎn)連接到起點(diǎn)
    * 填充路徑CGContextFillPath：有了封閉的路徑就能填充啸澡。
    * 設(shè)置填充顏色 [[UIColor blueColor] setFill];
    * 設(shè)置描邊顏色 [[UIColor redColor] setStroke];
    * 不顯示描邊顏色，為什么?沒有設(shè)置線寬
    * 設(shè)置線寬氮帐，還是不顯示嗅虏，為什么?因?yàn)槔L制路徑不對(duì)。
    * 即填充又描邊CGContextDrawPath:kCGPathFillStroke上沐。

    * rectangle矩形

    * circle圓：為什么傳入矩形皮服，因?yàn)閳A內(nèi)切與矩形

    * arc圓弧
    PPT分析:
        1> 圓弧屬于圓的一部分，因此先要有圓参咙，才有弧龄广。
        2> 圓需要起點(diǎn)嗎？畫線需要蕴侧，圓也不另外择同。
        3> 起點(diǎn)在哪? 圓心右邊
        4> 畫圓弧還需要起始角度，結(jié)束角度净宵，方向敲才，角度必須是弧度


    * Quarter 1/4圓
      * 畫個(gè)1/4圓弧，Stroke
      * 填充路徑择葡，F(xiàn)ill
      * 必須有封閉路徑才能填充紧武，沒有封閉路徑，系統(tǒng)會(huì)自動(dòng)關(guān)閉路徑刁岸，再去填充
      * 畫線連接圓心脏里，自動(dòng)關(guān)閉路徑。



2.1 基本圖形繪制:
    先畫PPT在寫代碼
    講解順序: 繪制線段(Line)：繪制直線->在添加一條直線->繪制兩條直線(路徑填充虹曙、設(shè)置路徑屬性迫横，顏色，線寬等)->曲線->分析
    講解順序: 繪制圖形(Shape)：繪制三角形(超人內(nèi)褲)->矩形->圓->圓弧->1/4圓

3>  重繪-下載進(jìn)度條(setNeedsDisplay) 必須畫圖分析
    * 分析有幾個(gè)控件：UISliderView,自定義view用來畫圖,UILabel
    * 分析思路：滑動(dòng)UISliderView的時(shí)候酝碳，把UISliderView的值傳給自定義view,改變的顯示矾踱。
    * 怎么監(jiān)聽UISliderView，valueChange事件
    * 自定義view搞一個(gè)屬性接收滑動(dòng)的值
    * 接下來先搞label,因?yàn)樗容^簡(jiǎn)單疏哗，做東西呛讲，先從簡(jiǎn)單的著手。
    * 懶加載label,位置居中，文字居中
    * label怎么顯示?重寫progress的set方法,有數(shù)據(jù)就展示在label上贝搁。
    * 繪制圓弧吗氏，PPT分析，從哪開始畫圓弧雷逆。
    * 每次轉(zhuǎn)多少°弦讽？ 角度 = 進(jìn)度 * M_PI * 2
    * startAngle = -M_PI_2
    * endAngle = -M_PI_2 + 進(jìn)度 * M_PI * 2
    * 不會(huì)及時(shí)更新視圖顯示?為什么，因?yàn)閐rawRect只會(huì)在視圖顯示的時(shí)候調(diào)用一次膀哲。
    * 怎么重繪往产？
    * 手動(dòng)調(diào)用drawRect方法，不行某宪，因?yàn)槟阕约翰荒軇?chuàng)建上下文仿村，必須系統(tǒng)調(diào)用來調(diào)用
    * setNeedsDisplay：在view上做一個(gè)重繪的標(biāo)記，在下一次繪圖的周期來臨兴喂，就會(huì)先創(chuàng)建好上下文蔼囊，然后自動(dòng)調(diào)用drawRect重繪。


4>  繪制餅圖
    * PPT分析 -> 找規(guī)律 -> 得出startA,endA,angle的結(jié)論
    * startA = endA angle = 比例 * 總度數(shù)360° endA = startA + angle
    * angle = 自己 / 100.0 * 360
    * 一個(gè)一個(gè)扇形畫
5>  繪制柱狀圖
    * PPT分析 -> 找規(guī)律 -> 得出w,h,y,x的結(jié)論
    * w = viewW / (2 * count - 1)
    * h = viewH * 比例

6>  UIKit封裝繪圖方法演練(不需要上下文)
6.0 繪制文本
6.1 繪制矩形
6.2 繪制圖像
6.4 圖像裁切 -> 指定裁切區(qū)域之后瞻想，所有繪圖信息都只顯示裁切區(qū)域內(nèi)

7>  模仿UIImageView/雪花(定時(shí)器)

8>  圖形上下文棧

9>  矩陣變換