Quart2D 畫圖一 (簡單畫線、形狀)

自我使用學習畫圖的一些用法,可以由簡單開始,實現復雜畫圖操作

畫線

#pragma mark - 繪制曲線
- (void)drawCurve
{
    /** 繪制曲線 */
    
    /** 1.獲取上下文 */
    CGContextRef ctf = UIGraphicsGetCurrentContext();
    
    /** 2.描述路徑 */
    /** 一定要有起點 */
    CGContextMoveToPoint(ctf, 50, 50);
    CGContextAddQuadCurveToPoint(ctf, 150, 20, 250, 50);
    
    /** 3.渲染上下文 */
    CGContextStrokePath(ctf);
}

#pragma mark - 線的狀態(tài)
/**
 * beaier 封裝的畫法
 */
- (void)drawStateBezier
{
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    [path moveToPoint:CGPointMake(50, 50)];
    
    [path addLineToPoint:CGPointMake(200, 200)];
    
    path.lineWidth = 10;
    
    [path stroke];
    
    
    UIBezierPath *path1 = [UIBezierPath bezierPath];
    
    [path1 moveToPoint:CGPointMake(50, 50)];
    
    [path1 addLineToPoint:CGPointMake(200, 200)];
    
    path1.lineWidth = 10;
    
    [path1 stroke];
}

/**
 * 系統(tǒng)畫法
 */
- (void)drawContextRefState
{
    /** 獲取圖形上下文 */
    CGContextRef ctf = UIGraphicsGetCurrentContext();
    
    /** 獲取路徑 */
    CGContextMoveToPoint(ctf, 50, 50);
    CGContextAddLineToPoint(ctf, 50, 200);
    
    /** 重新設置起點,兩根線會分開 */
    //    CGContextMoveToPoint(ctf, 50, 50);
    /** 默認上一根線的終點是下一根線的起點 */
    CGContextAddLineToPoint(ctf, 200, 50);
    
    /** 設置繪圖狀態(tài), 一定要在渲染之前 */
    /** 顏色 */
    [[UIColor redColor] setStroke];
    /** 線寬 */
    CGContextSetLineWidth(ctf, 30);
    /** 設置連接樣式 */
    CGContextSetLineJoin(ctf, kCGLineJoinRound);/** 圓拐角 */
    /** 設置頂角樣式 */
    CGContextSetLineCap(ctf, kCGLineCapRound);
    
    CGContextStrokePath(ctf);
}

#pragma mark - 畫線的三種方式
/**
 * bezier畫線
 */
- (void)drawBezierLines
{
    /** UIKit封裝了繪圖功能 */
    
    /** 貝塞爾曲線 */
    
    /** 創(chuàng)建路徑 */
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    /** 設置起點 */
    [path moveToPoint:CGPointMake(50, 50)];
    
    /** 添加一個線 */
    [path addLineToPoint:CGPointMake(200, 200)];
    
    /** 渲染 */
    [path stroke];
}

/**
 * 系統(tǒng)畫線
 */
- (void)drawLine
{
    /** 1.獲取圖形上下文 */
    /** 目前我們用的上下文都是UIGraphics開頭 */
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    /** 2.描述路徑 */
    /** 創(chuàng)建路徑 */
    CGMutablePathRef path = CGPathCreateMutable();
    /** 設置起點 */
    CGPathMoveToPoint(path, NULL, 50, 30);
    /** 添加一根線到莫個點 */
    CGPathAddLineToPoint(path, NULL, 200, 200);
    
    /** 3.路徑添加到上下文 */
    CGContextAddPath(ctx, path);
    
    /** 4.渲染上下文到view的圖層上 */
    CGContextStrokePath(ctx);

}

/**
 * 省略的系統(tǒng)畫線方法
 */
- (void)drawLineSimple
{
    /** 獲取上下文 */
    CGContextRef ctf = UIGraphicsGetCurrentContext();
    
    /** 描述路徑 */
    /** 設置起點 */
    CGContextMoveToPoint(ctf, 50, 50);
    /** 設置終點 */
    CGContextAddLineToPoint(ctf, 200, 200);
    
    /** 渲染上下文 */
    CGContextStrokePath(ctf);
    
}

畫形狀

#pragma mark - 畫簡單形狀
- (void)drawCycleLine
{
    /** 圓角矩形  */
    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(40, 50, 40, 60) cornerRadius:5];
    
    [path stroke];
    
    /** 圓弧
     * Center: 圓心
     * angle:  弧度
     * clockwise: yes是順時針
     */
    UIBezierPath *path1 = [UIBezierPath bezierPathWithArcCenter:CGPointMake(125, 125) radius:100 startAngle:0 endAngle:M_PI clockwise:YES];
    
    [path1 stroke];
    
    //    [path fill];/** 一個完整的封閉路徑,用填充,整個路徑的面都是一樣的 */
}

#pragma mark - 畫扇形
- (void)drawSector
{
    CGPoint center = CGPointMake(125, 125);
    
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:80 startAngle:0 endAngle:M_PI_2 clockwise:YES];
    
    [path addLineToPoint:center];
    
    /** 關閉路徑
     * 默認從終點畫到起點
     */
//    [path closePath];
    
    /** 如果使用填充,會自動關閉路徑 */
    [path fill];
    
}

注意: 這些方法一定要在視圖的 drawRect 方法中調用

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    [self drawSector];

}
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 發(fā)現 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,255評論 4 61
  • 一. Quartz2D Quartz 2D 是一個二維繪圖引擎,它能夠支持: 1、繪制圖形: 線條、三角形、矩形、...
    純情_小火雞閱讀 1,059評論 0 0
  • 我家后邊的一家的孩子今天結婚了,是倒插門,那家人只有這一個兒子。 我們是一個“門里”的,按輩分那家男主人是我大...
    放羊的二狗閱讀 147評論 0 0
  • 源碼基于Picasso 2.5.2。 一,概括 從Picasso最簡單的調用來一觀Picasso的整體流程。給個圖...
    wang_zd閱讀 419評論 0 0
  • 文/涼樹姑娘 前兩天,看了薛之謙在上海演唱會上為前妻高磊鑫唱《安和橋》的視頻,才發(fā)現,原來這個總說“你神經病啊”的...
    涼樹姑娘閱讀 596評論 4 1