UIView绘图

在Mac OS X中兼容很多种绘图技术,例如Quartz, OpenGL, Core Image, Core Video, Quartz Composer, PDF Kit, and QuickTime,iphone中主要通过OpenGL, Quartz, UIKit, or Core Animation来绘图。Quartz会自动开启图形加速,是当前应用最广泛的绘图技术。Application Kit framework (AppKit.framework)框架中包含了从原始图形,到复杂图形的一系列的类和方法,而它就是基于Quartz的。

Quartz有时候也认为是CoreGraphics。共有两种部分组成,Quartz Compositor(合成视窗系统,管理和合成幕后视窗影像来建立Mac OS X使用者接口)和Quartz 2D(是iOS和Mac OS X环境下的二维绘图引擎)。Quartz采用的是Painter’s Model,就是说图画会一层一层的覆盖上去,后面画上去的会修改或者覆盖前面已经画好的。UIKit 是非线程安全的,所以最好把所有的绘图都放在主线程上执行。不管使用的哪个技术来绘图,所有的绘图都是在 UIView object 中进行, view决定绘图在那里进行。

view绘图介绍

绘图环境包含了两个东西,一是画布,决定了你在什么地方进行绘画;二是图形设置,决定颜色,大小,质量和方向。图形上下文(Graphics Context) 就是画图的目的,大多图形上下文都在主线程上,当然为了更好的完成画图,也可以在辅助线程上。大多数情况下,cocoa都会在你绘图前为你创建好和配置好图形上下文。图形上下文封装了所有的在画布上的绘图信息,包括当前绘画属性。Graphics Context大多用在window和在window上面的view, 每一个window或者view都有一个图形上下文。

当一个view需要更新某一部分内容的时候,view会请求 drawRect: 方法,在view第一次请求drawRect方法的时候,传递的rectangle 参数一般是view的整个rectangle ,后续更新的时候,传递的一般是需要更新的那部分rectangle 。当请求了一个 drawRect:方法,view会标志自己已经被更新了,然后等待下一个更新请求的到达。

当请求drawRect:方法 ,view object会自动配置图形环境,作为环境的一部分,UIView会创建一个图形上下文,图形上下文定义基本图形属性,如颜色,剪切区域,线的宽度和样式信息,字体信息,合成选项等。也可以自己创建图形上下文用 CGBitmapContextCreate 或者CGPDFContextCreate 函数。需要注意的是,自己创建的图形上下文的原点是在左下角。

下面几种情况下,view会重新绘图:
1.移动或者移除另外一个view
2.设置view的hidden 属性为NO, view重新出现
3.滚动view,当滚出或者滚进来的时候
4.明确的请求setNeedsDisplay和setNeedsDisplayInRect:方法

绘图使用

- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext(); // 获得图形上下文

// 构建描绘路径
CGContextMoveToPoint(context, 100, 100);
CGContextAddLineToPoint(context, 100, 200);
CGContextAddLineToPoint(context, 240, 220);

//闭合描绘路径
CGContextClosePath(context);

[[UIColor blackColor] setStroke]; // 为闭合路径描边
[[UIColor redColor] setFill];// 设置要填充颜色

CGContextDrawPath(context, kCGPathFillStroke);// 设置描绘路径方式
}

路径用于描述由一序列线和Bézier曲线构成的2D几何形状。 Bézier曲线是法国数学家“贝塞尔”在工作中发现,任何一条曲线都可以通过与它相切的控制线两端的点的位置来定义。Core Graphics中也有一些用于创建简单路径(比如矩形和椭圆形)的便利函数。对于更为复杂的路径,必须用Core Graphics框架提供的函数自行创建。

CGContextAddCurveToPoint(cgContext, 333, 0, 332, 26, 330, 26); // Bézier曲线

结果如下:

Quartz技术最开始为Mac OS X系统设计的图形技术,它的坐标原点位于左下角。UIKit坐标与Quartz不同,原点位于左上角。Quartz 2D和UIKit的坐标系是在Y轴方向上的镜像。

UIImage *img = [UIImage imageNamed:@"catjump_015"];

[img drawAsPatternInRect:CGRectMake(0, 0, img.size.width, img.size.height)]; // 此时画出来的图片是正的。

- (void)drawRect:(CGRect)rect {

UIImage *img = [UIImage imageNamed:@"catjump_015"];

CGImageRef image = img.CGImage;

CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context); // 将当前图形状态要入到图形堆栈

CGContextRotateCTM(context, radians(180.)); //顺时针旋转180度
CGContextScaleCTM(context, -1, 1); // 水平旋转
CGContextTranslateCTM(context, 0, -img.size.height); //调整位置偏移


CGRect touchRect = CGRectMake(0, 0, img.size.width, img.size.height);
CGContextDrawImage(context, touchRect, image); // 在上下文中绘制图形
CGContextRestoreGState(context); // 回复当前图形状态


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

推荐阅读更多精彩内容