iOS开发UI篇—Quartz2D使用(绘制基本图形)

一、简单说明

图形上下文(Graphics Context):是一个CGContextRef类型的数据

图形上下文的作用:保存绘图信息、绘图状态

决定绘制的输出目标(绘制到什么地方去?)(输出目标可以是PDF文件、Bitmap或者显示器的窗口上)


相同的一套绘图序列,指定不同的Graphics Context,就可将相同的图像绘制到不同的目标上。


Quartz2D提供了以下几种类型的Graphics Context:

Bitmap Graphics Context

PDF Graphics Context

Window Graphics Context

Layer Graphics Context

Printer Graphics Context

只要上下文不同,绘制的地方就不同。

本文说明如何把图片绘制到Bitmap上面去,即要求生成一张图片,图片上面保存了绘图信息。

Bitmap就是图片,相当于系统的UIimage。一个UIImage就是一个Bitmap

二、怎么把图片绘制到Bitmap上?

注意:不能在drawRect:方法中直接获取Bitmap的上下文,需要我们自己进行创建。

代码示例:

 1 //  2 // YYViewController.m
 3 // 06-绘制基本图形
 4 //  5 // Created by apple on 14-6-22.
 6 // Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8  9 #import "YYViewController.h" 10 11 @interface YYViewController ()
12 @property (weak, nonatomic) IBOutlet UIImageView *iv;
13 @end 14 15 @implementation YYViewController
16 17 - (void)viewDidLoad
18 {
19  [super viewDidLoad];
20 21 //加载图片
22 //0.创建一个Bitmap上下文
23 //c语言的方法
24 // CGBitmapContextCreate(<#void *data#>, <#size_t width#>, <#size_t height#>, <#size_t bitsPerComponent#>, <#size_t bytesPerRow#>, <#CGColorSpaceRef space#>, <#CGBitmapInfo bitmapInfo#>)
25 //oc中封装的方法
26 //方法1
27 // UIGraphicsBeginImageContext(<#CGSize size#>);
28 //方法2 29 UIGraphicsBeginImageContextWithOptions( CGSizeMake(200, 200), NO, 0);
30 //1.获取bitmap上下文 31 CGContextRef ctx = UIGraphicsGetCurrentContext();
32 //2.绘图(画一个圆) 33 CGContextAddEllipseInRect(ctx, CGRectMake(0, 0, 100, 100));
34 //3.渲染 35  CGContextStrokePath(ctx);
36 //4.获取生成的图片 37 UIImage *image=UIGraphicsGetImageFromCurrentImageContext();
38 //5.显示生成的图片到imageview 39 self.iv.image=image;
40 //6.保存绘制好的图片到文件中
41 //先将图片转换为二进制数据,然后再将图片写到文件中
42 // UIImageJPEGRepresentation(image, 1); //第二个参数为保存的图片的效果 43 NSData *data=UIImagePNGRepresentation(image);
44 [data writeToFile:@"/Users/apple/Desktop/abc.png" atomically:YES];
45 }
46 47 - (void)didReceiveMemoryWarning
48 {
49  [super didReceiveMemoryWarning];
50 // Dispose of any resources that can be recreated. 51 }
52 53 @end


程序执行效果:


程序执行完毕后,会在指定的位置创建一个abc.png的图片


补充说明:

1.创建Bitmap图形上下文的方法

//方法1 UIGraphicsBeginImageContext(<#CGSize size#>);

//方法2 UIGraphicsBeginImageContextWithOptions(CGSize size, BOOL opaque, CGFloat scale)

使用两个方法同样都可以创建,但是使用第一个方法将来创建的图片清晰度和质量没有第二种方法的好。

方法2接收三个参数:

CGSize size:指定将来创建出来的bitmap的大小

BOOL opaque:设置透明YES代表透明,NO代表不透明

CGFloat scale:代表缩放,0代表不缩放

创建出来的bitmap就对应一个UIImage对象

2.Quartz2D的内存管理

使用含有“Create”或“Copy”的函数创建的对象,使用完后必须释放,否则将导致内存泄露

使用不含有“Create”或“Copy”的函数获取的对象,则不需要释放

如果retain了一个对象,不再使用时,需要将其release掉

可以使用Quartz 2D的函数来指定retain和release一个对象。例如,如果创建了一个CGColorSpace对象,则使用函数CGColorSpaceRetain和CGColorSpaceRelease来retain和release对象。

也可以使用Core Foundation的CFRetain和CFRelease。注意不能传递NULL值给这些函数

时间: 2024-09-16 07:52:12

iOS开发UI篇—Quartz2D使用(绘制基本图形)的相关文章

iOS开发UI篇—Quartz2D简单介绍

一.什么是Quartz2D Quartz 2D是⼀个二维绘图引擎,同时支持iOS和Mac系统 Quartz 2D能完成的工作: 绘制图形 : 线条\三角形\矩形\圆\弧等 绘制文字 绘制\生成图片(图像) 读取\生成PDF 截图\裁剪图片 自定义UI控件 二.Quartz2D在iOS开发中的价值 为了便于搭建美观的UI界面,iOS提供了UIKit框架,⾥⾯有各种各样的UI控件 UILabel:显⽰文字 UIImageView:显示图片 UIButton:同时显示图片和⽂字(能点击) 利⽤UIKi

iOS开发UI篇—Quartz2D(自定义UIImageView控件)

一.实现思路 Quartz2D最大的用途在于自定义View(自定义UI控件),当系统的View不能满足我们使用需求的时候,自定义View. 使用Quartz2D自定义View,可以从模仿系统的ImageView的使用开始. 需求驱动开发:模仿系统的imageview的使用过程 1.创建 2.设置图片 3.设置frame 4.把创建的自定义的view添加到界面上(在自定义的View中,需要一个image属性接收image图片参数->5). 5.添加一个image属性(接下来,拿到image之后,应

iOS开发UI篇—Quartz2D使用(截屏)

一.简单说明 在程序开发中,有时候需要截取屏幕上的某一块内容,比如捕鱼达人游戏.如图: 完成截屏功能的核心代码:- (void)renderInContext:(CGContextRef)ctx;调用某个view的layer的renderInContext:方法即可 二.代码示例 storyboard界面搭建: 代码: 1 // 2 // YYViewController.m 3 // 01-截屏 4 // 5 // Created by apple on 14-6-12. 6 // Copyr

iOS开发UI篇—Quartz2D使用(绘图路径)

一.绘图路径 A.简单说明 在画线的时候,方法的内部默认创建一个path.它把路径都放到了path里面去. 1.创建路径 cgmutablepathref 调用该方法相当于创建了一个路径,这个路径用来保存绘图信息. 2.把绘图信息添加到路径里边. 以前的方法是点的位置添加到ctx(图形上下文信息)中,ctx 默认会在内部创建一个path用来保存绘图信息. 在图形上下文中有一块存储空间专门用来存储绘图信息,其实这块空间就是CGMutablePathRef. 3.把路径添加到上下文中. 代码示例:

iOS开发UI篇—Quartz2D使用(图片剪切)

一.使用Quartz2D完成图片剪切 1.把图片显示在自定义的view中 先把图片绘制到view上.按照原始大小,把图片绘制到一个点上. 代码: 1 - (void)drawRect:(CGRect)rect 2 { 3 UIImage *image2=[UIImage imageNamed:@"me"]; 4 [image2 drawAtPoint:CGPointMake(100, 100)]; 5 } 显示: 2.剪切图片让图片圆形展示 思路:先画一个圆,让图片显示在圆的内部,超出

iOS开发UI篇—Quartz2D使用(图形上下文栈)

一.qurza2d是怎么将绘图信息和绘图的属性绘制到图形上下文中去的? 说明: 新建一个项目,自定义一个view类和storyboard关联后,重写该类中的drowrect方法. 画线的三个步骤: (1)获取上下文 (2)绘图 (3)渲染 要求:画两条单独的线 代码和效果图: 1 - (void)drawRect:(CGRect)rect 2 { 3 //获取上下文 4 CGContextRef ctx=UIGraphicsGetCurrentContext(); 5 //绘图 6 //第一条线

iOS开发UI篇—Quartz2D使用(矩阵操作)

一.关于矩阵操作 1.画一个四边形 通过设置两个端点(长和宽)来完成一个四边形的绘制. 代码: 1 - (void)drawRect:(CGRect)rect 2 { 3 //画四边形 4 //获取图形上下文 5 CGContextRef ctx=UIGraphicsGetCurrentContext(); 6 //绘图 7 CGContextAddRect(ctx, CGRectMake(20, 50, 100, 100)); 8 //渲染 9 CGContextStrokePath(ctx)

iOS开发UI篇—Quartz2D简单使用(三)

一.通过slider控制圆的缩放 1.实现过程 新建一个项目,新建一个继承自UIview的类,并和storyboard中自定义的view进行关联. 界面搭建,如图: 代码示例: YYViewController.m文件 1 // 2 // YYViewController.m 3 // 04-对圆进行缩放 4 // 5 // Created by apple on 14-6-11. 6 // Copyright (c) 2014年 itcase. All rights reserved. 7 /

iOS开发UI篇—Quartz2D简单使用(二)

一.画文字 代码: 1 // 2 // YYtextview.m 3 // 04-写文字 4 // 5 // Created by 孔医己 on 14-6-10. 6 // Copyright (c) 2014年 itcast. All rights reserved. 7 // 8 9 #import "YYtextview.h" 10 11 @implementation YYtextview 12 13 14 - (void)drawRect:(CGRect)rect 15 {