iOS中的繪圖教程品讀后的頓悟篇(一)

圖形上下文的由來.

之所以叫頓悟,也算不上什么有很高深的理解,相對之前對繪圖在api層面上,復制過來的代碼是有了一層深的認識.
iOS繪圖教程 :http://www.cocoachina.com/industry/20140115/7703.html

1.我也是從別處搬過來,順便總結一下,增加一些自己的看法.
(對自己說一句:每次看別人的博客,看完以后就忘了,不能深入的理解別人說的是什么意思,有可能是不理解,但更多的是自己太粗心,沒看到作者的用心良苦.ps:當然好的博客是這樣的,好的作者不多,其實.)

好文章就是要一句一句來品讀:接下來我要開始品讀了.

(開篇)繪圖開始的圖形上下文

Core Graphics Framework是一套基于C的API框架,使用了Quartz作為繪圖引擎。它提供了低級別、輕量級、高保真度的2D渲染。該框架可以用于基于路徑的繪圖、變換、顏色管理、脫屏渲染,模板、漸變、遮蔽、圖像數(shù)據(jù)管理、圖像的創(chuàng)建、遮罩以及PDF文檔的創(chuàng)建、顯示和分析。為了從感官上對這些概念做一個入門的認識,你可以運行一下官方的example code

這段要注意的是 這個框架是基于C的. 使用的引擎,以及這個框架的一些功能.最后的PDF文檔的創(chuàng)建和顯示,不要忽略了.App中需要PDF一些功能的,就要注意了.

iOS支持兩套圖形API族:Core Graphics/QuartZ 2D 和OpenGL ES。OpenGL ES是跨平臺的圖形API,屬于OpenGL的一個簡化版本。QuartZ 2D是蘋果公司開發(fā)的一套API,它是Core Graphics Framework的一部分。需要注意的是:OpenGL ES是應用程序編程接口,該接口描述了方法、結構、函數(shù)應具有的行為以及應該如何被使用的語義。也就是說它只定義了一套規(guī)范,具體的實現(xiàn)由設備制造商根據(jù)規(guī)范去做。而往往很多人對接口和實現(xiàn)存在誤解。舉一個不恰當?shù)谋扔鳎荷习l(fā)條的時鐘和裝電池的時鐘都有相同的可視行為,但兩者的內部實現(xiàn)截然不同。因為制造商可以自由的實現(xiàn)Open GL ES,所以不同系統(tǒng)實現(xiàn)的OpenGL ES也存在著巨大的性能差異。

這段要注意: 對IOS支持圖形的API進行了概括,說明兩套.一個是可以跨平臺的.一個是只針對ios.這個時候就要注意了.要在不同的平臺進行繪圖方面的開發(fā),可以考慮使用OpenGL這個API族.后面我感覺對我來說感覺有就行了,考慮性能,那就太高級了.

Core Graphics API所有的操作都在一個上下文中進行。所以在繪圖之前需要獲取該上下文并傳入執(zhí)行渲染的函數(shù)中。如果你正在渲染一副在內存中的圖片,此時就需要傳入圖片所屬的上下文。獲得一個圖形上下文是我們完成繪圖任務的第一步,你可以將圖形上下文理解為一塊畫布。如果你沒有得到這塊畫布,那么你就無法完成任何繪圖操作。當然,有許多方式獲得一個圖形上下文,這里我介紹兩種最為常用的獲取方法。

這段話,就更重要了,我第一次讀的時候,完全沒有意識到. 上下文 這是一個很重要的概念.我用了一年知道代碼怎么寫,只會整段復制,然后小改下,成為自己想要的樣子.讓我自己寫的時候,心里就沒底.
這段話告訴我們使用Core Graphics API (這個Api 是什么,暫時不用管),只要繪圖,必須有一個上下文.所以繪圖的第一步就關鍵了.先獲取上下文 .什么時候獲取 ? 怎么獲取 ? 這段話后面說介紹兩種常用的方法.

第一步: 開始獲取上下文

第一種方法就是創(chuàng)建一個圖片類型的上下文。調用UIGraphicsBeginImageContextWithOptions函數(shù)就可獲得用來處理圖片的圖形上下文。利用該上下文,你就可以在其上進行繪圖,并生成圖片。調用UIGraphicsGetImageFromCurrentImageContext函數(shù)可從當前上下文中獲取一個UIImage對象。記住在你所有的繪圖操作后別忘了調用UIGraphicsEndImageContext函數(shù)關閉圖形上下文。

第二種方法是利用cocoa為你生成的圖形上下文。當你子類化了一個UIView并實現(xiàn)了自己的drawRect:方法后,一旦drawRect:方法被調用,Cocoa就會為你創(chuàng)建一個圖形上下文,此時你對圖形上下文的所有繪圖操作都會顯示在UIView上。

這兩段話讀起來,上面的兩個問題就有答案了.并不是任何時候都要去主動獲取上下文的.
第一段:
我們就可以寫代碼了,而且步驟大致是這樣:
(1.獲取上下文,注意我們并沒有拿到上下文的 CGContextRef 引用 :

UIGraphicsBeginImageContextWithOptions(CGRectMake(0,0,100,100), NO, 0.0);

(2. 在上下文中進行繪制.

暫無代碼

(3.最后生成繪制的圖片

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

(4.關閉上下文

UIGraphicsEndImageContext();

下面對第二段進行品讀。
什么是 cocoa為你生成的圖形上下文
先舉一個例子:

- (void) drawRect: (CGRect) rect { 

 CGContextRef con = UIGraphicsGetCurrentContext(); 

  CGContextAddEllipseInRect(con, CGRectMake(0,0,100,100)); 
 CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor); 

CGContextFillPath(con); 

} 

這個時候可以直接使用當前上下文,而不用自己去創(chuàng)建。

判斷一個上下文是否為當前圖形上下文需要注意的幾點:
1.UIGraphicsBeginImageContextWithOptions函數(shù)不僅僅是創(chuàng)建了一個適用于圖形操作的上下文,并且該上下文也屬于當前上下文。
2.當drawRect方法被調用時,UIView的繪圖上下文屬于當前圖形上下文。
3.回調方法所持有的context:參數(shù)并不會讓任何上下文成為當前圖形上下文。此參數(shù)僅僅是對一個圖形上下文的引用罷了。

這段更加不能忽略了,這個是對上面所說的一個總結。
第一句的意思。
UIGraphicsBeginImageContextWithOptions創(chuàng)建的上下文,就是
CGContextRef con = UIGraphicsGetCurrentContext(); 可以利用這行代碼來獲取我們創(chuàng)建的上下文。

第二句也容易理解。drawRect 的方法中繪圖,也可以用 CGContextRef con = UIGraphicsGetCurrentContext();來獲取要繪圖的上下文。

第三句,就有點迷糊了。一個字一個字來讀,回調方法所持有的Context.這個回調方法是這那個方法???。先不急,我們接著往下讀。我自己先往下讀了五段.認真讀了這句話四五遍,才理解.這句話中回調方法可能我們先不知道,但是這個回調方法會有一個context參數(shù).也就是這個方法會傳遞一個context過來.下面就好理解了,這個context的參數(shù)并不是我們上面的上下文,參數(shù)只是一個引用.這里就要注意了,這個context只是引用,并不是我們之前所說的上下文.怎么理解呢?

就像這是一塊畫布,一個是真的可以作畫的布,一個只是叫畫布的名字.
那這個context 引用有什么用呢? 我們接著往下讀.我在下面發(fā)現(xiàn)了答案.

(未完待續(xù)......)

寫在最后:
參考的繪圖的博客:
iOS開發(fā)UI篇—Quartz2D使用(繪圖路徑):http://www.cnblogs.com/wendingding/p/3782679.html

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,739評論 6 534
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 98,634評論 3 419
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,653評論 0 377
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,063評論 1 314
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,835評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 55,235評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,315評論 3 442
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,459評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,000評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,819評論 3 355
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,004評論 1 370
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,560評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,257評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,676評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,937評論 1 288
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,717評論 3 393
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,003評論 2 374

推薦閱讀更多精彩內容