Quart2D绘图

iOS 可以用的画笔:

本文参考:
http://www.360doc.com/content/15/0929/15/11764545_502227892.shtml

相关库

1, CGPath
CoreGraphics--CGPath.h

2, CGContext
CoreGraphics--CGContext.h

3,UIBezierPath
UIKit---UIBezierPath

流程总结

1、画布-》

2、
构建路径:开始、构建、闭合-》
或者直接在画布上构建路径

3、设置描边颜色、填充颜色、线条连接样式、收尾两端样式-》

4、给画布增加路径-》

5、绘制: 描边 或是 填充

代码实践

#import "MyDrawView.h"
#define rad(x) ((x)*M_PI/ 180.0)

@implementation MyDrawView

-(void)drawRect:(CGRect)rect {
    // 在画布上直接操作路径。
    [self line];
    
    
    //    [self arc];
    
    // 先操作路径, 然后添加到画布上。当画布绘制后,路径就没有了。  所以才有了保存路径的
    //    [self pathLine];
}

-(void)pathLine{
    
    
    // 1、画布
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    // 2、路径
    CGMutablePathRef path= CGPathCreateMutable();
    CGPathAddArc(path, NULL, CGRectGetMidX(self.frame), 300, 200, 0, 2*M_PI, 1);
    CGPathCloseSubpath(path);
    
    
    
    
    
    // 添加一个路径到画布
    [self track:context];
    CGContextAddPath(context, path);// 画布上有路径了
    [self track:context];
    
    
    // 3、设置  颜色、线的样式
    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
    CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
    
    // 两条线连接处的样式
    CGContextSetLineJoin(context, kCGLineJoinRound);
    
    // 线的收尾两端的样式
    CGContextSetLineCap(context, kCGLineCapButt);
    
    // 线的宽度
    CGContextSetLineWidth(context, 30);
    
    
    
    
    // 4、绘制
    [self track:context];
    CGContextDrawPath(context, kCGPathFillStroke);
    // 画布清空了
    [self track:context];
    
}
-(void)line{
    CGFloat top=50;
    CGFloat left=30;
    CGFloat w=200;
    CGFloat h=60;
    // 1、画布
    CGContextRef context= UIGraphicsGetCurrentContext();
    
    
    // 2、路径
    // 构建路径之前,先标记
    CGContextBeginPath(context);
    //CGContextMoveToPoint(context, 100, 100);
    CGPoint p[6] = {
        {left+w, top},
        {left, top},
        {left, top+h},
        {left+w, top+h},
        {left+w, top+2.0*h},
        {left, top+2.0*h}
    };
    [self track:context];
    CGContextAddLines(context, p, 6);// 画布上有路径了
    [self track:context];
    
    // 闭合当前路径, 随后为一个新路径, 新路径起点为当前点
    CGContextClosePath(context);
    [self track:context];
    
    
    // 测一下新的子路径
    top = top+3.0*h;
    CGPoint p2[6] = {
        {left+w, top},
        {left, top},
        {left, top+h},
        {left+w, top+h},
        {left+w, top+2.0*h},
        {left, top+2.0*h}
    };
    CGContextAddLines(context, p2, 6);// 画布上有路径了
    
    
    // 3、设置  颜色、线的样式
    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
    CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
    
    // 两条线连接处的样式
    //    kCGLineJoinMiter, 斜切连接
    //    kCGLineJoinRound, 圆角连接
    //    kCGLineJoinBevel, 斜角连接
    CGContextSetLineJoin(context, kCGLineJoinRound);
    
    // 线的收尾两端的样式
    CGContextSetLineCap(context, kCGLineCapButt);
    
    // 线的宽度
    //    kCGLineCapButt,
    //    kCGLineCapRound,
    //    kCGLineCapSquare
    CGContextSetLineWidth(context, 5);
    
    // 虚线模式
    //    (CGContextRef cg_nullable c,
    //     CGFloat phase, // 虚线的起始点
    //     const CGFloat * __nullable lengths, // 绘制片段 与 未绘制片段 交替
    //     size_t count)
    //CGFloat a[] = { 1.0f, 2.0f, 30.0f };
    //CGContextSetLineDash(context, 0, a , 3);
    
    // 4、绘制
    //    kCGPathFill,
    //    kCGPathEOFill,
    //    kCGPathStroke,
    //    kCGPathFillStroke,
    //    kCGPathEOFillStroke
    // 描边当前路径
    [self track:context];
    CGContextDrawPath(context, kCGPathFillStroke);
    [self track:context];
    
    // 便捷函数:
    //    CGContextFillPath(context)
    // 描边当前路径
    //    CGContextStrokePath(context)
    //    CGContextEOFillPath(context)
    
    // 描边指定矩形的内切圆
    
    CGContextStrokeEllipseInRect(context, self.bounds);
    // 画布上的路径被清空了吗
    [self track:context];
    
    
    // 用指定的线宽来描边矩形
    CGContextStrokeRectWithWidth(context, CGRectInset(self.bounds, 30, 30), 10);
    
    top = top+6.0*h;
    CGPoint p3[6] = {
        {left+w, top},
        {left, top},
        {left, top+h},
        {left+w, top+h},
        {left+w, top+2.0*h},
        {left, top+2.0*h}
    };
    // 描边线段序列--指定起点、终点的成对的点,来描每一条线段。点1,点2组成一条线段,点3,点4组成一条线段,以此类推
    CGContextStrokeLineSegments(context, p3, 6);
    // 描边指定矩形
    CGContextStrokeRect(context, CGRectInset(self.bounds, 60, 60));
    
    
    // 画布上的路径被清空了
    [self track:context];
}
-(void)arc{
    // 1,画布
    CGContextRef context= UIGraphicsGetCurrentContext();
    
    // 2、设置
    [[UIColor redColor] set];
    
    // 3、路径
    CGContextBeginPath(context);
    CGContextAddArc(context, 160, 230, 100, 0, 2*M_PI, 1);
    CGContextClosePath(context);
    // 4、绘制
    CGContextStrokePath(context);
    
    
}

-(void)track:(CGContextRef)context {
    
    // 测试一下画布上有没有路径,  或者说画布有没有被清空
    CGPoint point= CGContextGetPathCurrentPoint(context);
    CGRect rect= CGContextGetPathBoundingBox(context);
    NSLog(@"%@,  %@",  NSStringFromCGRect(rect), NSStringFromCGPoint(point));
    
}

@end


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,607评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,047评论 2 379
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,496评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,405评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,400评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,479评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,883评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,535评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,743评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,544评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,612评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,309评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,881评论 3 306
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,891评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,136评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,783评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,316评论 2 342

推荐阅读更多精彩内容