iOS繪圖

一、畫圓的幾種方式

前言

iOS支持兩套圖形API族：Core Graphics/QuartZ 2D 和OpenGL ES。OpenGL ES是跨平臺的圖形API，屬于OpenGL的一個簡化版本。QuartZ 2D是蘋果公司開發(fā)的一套API，它是Core Graphics Framework的一部分。需要注意的是：OpenGL ES是應(yīng)用程序編程接口，該接口描述了方法、結(jié)構(gòu)、函數(shù)應(yīng)具有的行為以及應(yīng)該如何被使用的語義。也就是說它只定義了一套規(guī)范，具體的實現(xiàn)由設(shè)備制造商根據(jù)規(guī)范去做。而往往很多人對接口和實現(xiàn)存在誤解。舉一個不恰當(dāng)?shù)谋扔鳎荷习l(fā)條的時鐘和裝電池的時鐘都有相同的可視行為，但兩者的內(nèi)部實現(xiàn)截然不同。因為制造商可以自由的實現(xiàn)Open GL ES，所以不同系統(tǒng)實現(xiàn)的OpenGL ES也存在著巨大的性能差異。 iOS系統(tǒng)自身提供了兩套繪圖的框架，即UIBezierPath 和 Core Graphics。而前者所屬UIKit，其實是對Core Graphics框架關(guān)于path的進一步封裝，所以使用起來比較簡單。但是畢竟Core Graphics更接近底層，所以它更加強大。

Core Graphics

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

MyView1

- (void) drawRect: (CGRect) rect {
    UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
    [[UIColor blueColor] setFill];
    [p fill];
}

MyView2

- (void) drawRect: (CGRect) rect {
    CGContextRef con = UIGraphicsGetCurrentContext();
    CGContextAddEllipseInRect(con, CGRectMake(0,0,100,100));
    CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor);
    CGContextFillPath(con);
}

在UIView子類的drawLayer:inContext：方法中實現(xiàn)繪圖任務(wù)。drawLayer:inContext：方法是一個繪制圖層內(nèi)容的代理方法。為了能夠調(diào)用drawLayer:inContext：方法，我們需要設(shè)定圖層的代理對象。但要注意，不應(yīng)該將UIView對象設(shè)置為顯示層的委托對象，這是因為UIView對象已經(jīng)是隱式層的代理對象，再將它設(shè)置為另一個層的委托對象就會出問題。輕量級的做法是：編寫負(fù)責(zé)繪圖形的代理類

MyView3

- (void)drawLayer:(CALayer*)lay inContext:(CGContextRef)con {
    UIGraphicsPushContext(con);
    UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
    [[UIColor orangeColor] setFill];
    [p fill];
    UIGraphicsPopContext();
}

MyView4

- (void)drawLayer:(CALayer*)lay inContext:(CGContextRef)con {
    CGContextAddEllipseInRect(con, CGRectMake(0,0,100,100));
    CGContextSetFillColorWithColor(con, [UIColor orangeColor].CGColor);
    CGContextFillPath(con);
}

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

MyImageView1

- (void) awakeFromNib {
    [super awakeFromNib];
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(100,100), NO, 0);
    CGContextRef con = UIGraphicsGetCurrentContext();
    CGContextAddEllipseInRect(con, CGRectMake(0,0,100,100));
    CGContextSetFillColorWithColor(con, [UIColor yellowColor].CGColor);
    CGContextFillPath(con);
    UIImage* im = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.image = im;
}

MyImageView2

- (void) awakeFromNib {
    [super awakeFromNib];
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(100,100), NO, 0);
    UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
    [[UIColor yellowColor] setFill];
    [p fill];
    UIImage* im = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.image = im;
}
QQ20180322-151401@2x.png
QQ20180322-151527@2x.png

繪圖的步驟總結(jié)：

  • 1、 獲取上下文
  • 2、 創(chuàng)建路徑（描述路徑）
  • 3、把路徑添加到上下文
  • 4、 渲染上下文

關(guān)于drawRect方法

1、通常在drawRect里面繪圖，只有在這個方法里面才能獲取到跟 View的layer相關(guān)聯(lián)的圖形上下文

2、drawRect在以下情況下會被調(diào)用：

  • 1、如果在UIView初始化時沒有設(shè)置rect大小，將直接導(dǎo)致drawRect不被自動調(diào)用。drawRect調(diào)用是在Controller->loadView, Controller->viewDidLoad 兩方法之后掉用的.所以不用擔(dān)心在控制器中,這些View的drawRect就開始畫了.這樣可以在控制器中設(shè)置一些值給View(如果這些View draw的時候需要用到某些變量值).

  • 2、該方法在調(diào)用sizeToFit后被調(diào)用，所以可以先調(diào)用sizeToFit計算出size。然后系統(tǒng)自動調(diào)用drawRect:方法。

  • 3、通過設(shè)置contentMode屬性值為UIViewContentModeRedraw。那么將在每次設(shè)置或更改frame的時候自動調(diào)用drawRect:。

  • 4、直接調(diào)用setNeedsDisplay，或者setNeedsDisplayInRect:觸發(fā)drawRect:，但是有個前提條件是rect不能為0。
    以上1,2推薦；而3,4不提倡

3、drawRect方法使用注意點：

  • 1、若使用UIView繪圖，只能在drawRect：方法中獲取相應(yīng)的contextRef并繪圖。如果在其他方法中獲取將獲取到一個invalidate的ref并且不能用于畫圖。drawRect：方法不能手動顯示調(diào)用，必須通過調(diào)用setNeedsDisplay 或者 setNeedsDisplayInRect，讓系統(tǒng)自動調(diào)該方法。
  • 2、若使用CAlayer繪圖，只能在drawInContext: 中（類似于drawRect）繪制，或者在delegate中的相應(yīng)方法繪制。同樣也是調(diào)用setNeedDisplay等間接調(diào)用以上方法
  • 3、若要實時畫圖，不能使用gestureRecognizer，只能使用touchbegan等方法來掉用setNeedsDisplay實時刷新屏幕
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容