IOS Quartz2D簡介，iosquartz2d簡介

IOS Quartz2D簡介，iosquartz2d簡介
Quartz2D 簡介( 後續會有相關應用)

第一部分 繪製直線

程式碼範例：

- (void)drawRect:(CGRect)rect{    //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();        //開始畫圖    //設定直線起點    CGContextMoveToPoint(cxContext, 0, 20);    //設定直線中點    CGContextAddLineToPoint(cxContext, 100, 20);    //渲染    CGContextStrokePath(cxContext);}

：

我們只用了四行代碼就在view畫出了一條直線，但是會覺得很枯燥，知識一條黑色的直線而已。

這樣我們給他添點屬性。

為了測試我首先只給他添加了顏色

範例程式碼：

- (void)drawRect:(CGRect)rect{    //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();        //開始畫圖    //設定直線起點    CGContextMoveToPoint(cxContext, 0, 20);    //設定直線中點    CGContextAddLineToPoint(cxContext, 100, 20);    //設定顏色    CGContextSetRGBStrokeColor(cxContext, 1, 0, 0, 1);    //渲染    CGContextStrokePath(cxContext);}

 

：

可以看到他變為了紅色。

再分析我所添加的代碼，可以猜想還有寬度等等。

下面我在添加一下寬度。

範例程式碼：

- (void)drawRect:(CGRect)rect{    //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();        //開始畫圖    //設定直線起點    CGContextMoveToPoint(cxContext, 0, 20);    //設定直線中點    CGContextAddLineToPoint(cxContext, 100, 20);    //設定顏色    CGContextSetRGBStrokeColor(cxContext, 1, 0, 0, 1);    //設定寬度    CGContextSetLineWidth(cxContext, 10);    //渲染    CGContextStrokePath(cxContext);}

 

：

到這裡簡單繪製直線我們已經可以掌握了，但是如果多考率一下的話不難想到，如果我們現在花兩條沒有交點的線（我們可以通過CGContextAddLineToPoint繼續添加線）該如何區分呢。

下面介紹一下路徑path，我們可以通過它繪製線並且區分。

範例程式碼：

- (void)drawRect:(CGRect)rect{    //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();    //建立2條路徑    CGMutablePathRef path1 = CGPathCreateMutable();    CGMutablePathRef path2 = CGPathCreateMutable();    //開始畫圖    //繪製第一條直線    CGPathMoveToPoint(path1, NULL, 0, 20);    CGPathAddLineToPoint(path1, NULL, 100, 20);    //繪製第二條直線    CGPathMoveToPoint(path2, NULL, 0, 50);    CGPathAddLineToPoint(path2, NULL, 100, 50);    //把路徑添加到上下文中    CGContextAddPath(cxContext, path1);    CGContextAddPath(cxContext, path2);    //渲染    CGContextStrokePath(cxContext);    //釋放 因為是CG所以需要手動釋放    CGPathRelease(path1);    CGPathRelease(path2);}

: 

第二部分 繪製圖形

範例程式碼：

- (void)drawRect:(CGRect)rect{    //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();    //繪製矩形    CGContextAddRect(cxContext, CGRectMake(20, 20, 100, 100));    //渲染    CGContextStrokePath(cxContext);    }

：

範例程式碼：

- (void)drawRect:(CGRect)rect{        //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();    //繪製圓    CGContextAddArc(cxContext, 100, 100, 25, 0, M_PI, 0);    //渲染    CGContextStrokePath(cxContext);    }

：

第三部分 繪製文字

範例程式碼：

- (void)drawRect:(CGRect)rect{    //擷取圖形上下文    CGContextRef cxContext = UIGraphicsGetCurrentContext();    //繪製矩形    CGContextAddRect(cxContext, CGRectMake(20, 20, 100, 100));    //渲染    CGContextStrokePath(cxContext);    //文字內容    NSString *str = @"旭寶愛吃魚旭寶愛吃魚旭寶愛吃魚旭寶愛吃魚旭寶愛吃魚";    //將文字繪製到指定地區 自動換行 抽出範圍後不顯示    [str drawInRect:CGRectMake(20, 20, 100, 100) withAttributes:nil];    //將文字繪製到指定點//    [str drawAtPoint:CGPointMake(0, 0) withAttributes:nil];    }

：

第四部分 繪製圖片

執行個體代碼：

- (void)drawRect:(CGRect)rect{        UIImage * image = [UIImage imageNamed:@"2.jpg"];        //平鋪    [image drawAsPatternInRect:self.bounds];    }

：

範例程式碼：

- (void)drawRect:(CGRect)rect{        UIImage * image = [UIImage imageNamed:@"2.jpg"];        //展開    [image drawInRect:self.bounds];    }

:

執行個體代碼：

- (void)drawRect:(CGRect)rect{        UIImage * image = [UIImage imageNamed:@"2.jpg"];        //原圖指定位置（圖片的左上點）    [image drawAtPoint:self.center];    }

：