iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

时间:2022-09-10 16:36:40

前一篇几乎已经详细介绍了Quartz2D的所有知识,这一篇以及后面就不废话了,主要是用具体的实例来演示绘图效果。

这里我们先来绘制一些简单的图形(如直线、三角形、圆、矩形、文字、图像),它有两种方式可以绘制,一种是通过上下文绘制,另一种是通过路径绘制。下面对绘制三角形做了一个两种方式绘制的演示。

绘制基本的图形,如果自定义一个视图类,那么需要在操作的视图类中重写- (void)drawRect:(CGRect)rect方法,并在在该方法中绘制图形,该画图方法无需手动调用,是系统自动调用的。这里,我采用自定义一个视图类并将控制器的视图关联此自定义类的方式来绘制图形。具体实例如下:

1.创建一个自定义的视图类DemoView,关联控制器视图。

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等) iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)  iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

2.在自定义的视图类的- (void)drawRect:(CGRect)rect方法中进行绘图:

//所有的调用方法都写在- (void)drawRect:(CGRect)rect

- (void)drawRect:(CGRect)rect
{
//1.获取绘图的上下文
CGContextRef context = UIGraphicsGetCurrentContext(); //画直线
[self drawLine:context]; //画三角形
[self drawTriangle:context]; //画矩形
[self drawRectangle:context]; //画圆
[self drawCircle:context]; //路径的使用
[self drawByPath:context]; //画文字
[self drawString:context]; //画图像
[self drawImage]; }

//绘制直线

#pragma mark -画直线(实线和虚线)

-(void)drawLine:(CGContextRef) context
{
//2.添加绘图路径
CGContextMoveToPoint(context, , );
CGContextAddLineToPoint(context, , ); //终点 //3.设置绘图的属性
//描边的颜色
CGFloat redColor[] = {1.0,0.0,0.0,1.0};
CGContextSetStrokeColor(context, redColor); //填充的颜色
CGFloat greenColor[] = {0.0,1.0,0.0,1.0};
CGContextSetFillColor(context, greenColor); //线宽
CGContextSetLineWidth(context, ); //线的类型(虚线)
//CGFloat dash[2] = {1.0,2.0};
//CGContextSetLineDash(context, 0,dash, 2); //4.绘图(设置既填充有描边)
CGContextDrawPath(context, kCGPathFillStroke);
}

所画直线和虚线截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)  iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

//绘制三角形

#pragma mark -直接在上下文画三角形(第一种方式)

-(void)drawTriangle:(CGContextRef) context
{
//2.添加绘图路径
CGContextMoveToPoint(context, , );//起始点
CGContextAddLineToPoint(context, , ); //终点
CGContextAddLineToPoint(context, , ); //终点
CGContextAddLineToPoint(context, , ); //终点 //3.设置绘图的属性
//描边的颜色
CGFloat redColor[] = {1.0,0.0,0.0,1.0};
CGContextSetStrokeColor(context, redColor); //填充的颜色
CGFloat greenColor[] = {0.0,1.0,0.0,1.0};
CGContextSetFillColor(context, greenColor); //线宽
CGContextSetLineWidth(context, ); //线的连接点的类型(miter尖角、round圆角、bevel平角)
CGContextSetLineJoin(context, kCGLineJoinRound); //4.绘图(设置既填充有描边)
CGContextDrawPath(context, kCGPathFillStroke); }

所画的三角形截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

//绘制矩形

#pragma mark -画矩形

-(void)drawRectangle:(CGContextRef)context
{
//添加矩形
CGContextAddRect(context, CGRectMake(, , , )); //设置绘图的属性
//描边的颜色
CGFloat redColor[] = {1.0,0.0,0.0,1.0};
CGContextSetStrokeColor(context, redColor); //填充的颜色
CGFloat greenColor[] = {0.0,1.0,0.0,1.0};
CGContextSetFillColor(context, greenColor); //4.绘图
CGContextDrawPath(context, kCGPathFillStroke);
}

所画的矩形截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

//绘制圆

#pragma mark -画圆(正圆、椭圆)

-(void)drawCircle:(CGContextRef) context
{
//圆
CGContextAddEllipseInRect(context, CGRectMake(, , , )); //椭圆
CGContextAddEllipseInRect(context, CGRectMake(, , , )); //设置绘图的属性
//描边的颜色
CGFloat redColor[] = {1.0,0.0,0.0,1.0};
CGContextSetStrokeColor(context, redColor); //填充的颜色
CGFloat greenColor[] = {0.0,1.0,0.0,1.0};
CGContextSetFillColor(context, greenColor); //4.绘图
CGContextDrawPath(context, kCGPathFillStroke);
}

所画的正圆和椭圆截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等) iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

通过路径画三角形(第二种画图方式)

#pragma mark -先把路径添加到上下文,然后通过路径画三角形

-(void)drawByPath:(CGContextRef)context
{
//创建路径
CGMutablePathRef path = CGPathCreateMutable(); //往路径中添加图像
CGPathMoveToPoint(path, NULL, , );
CGPathAddLineToPoint(path, NULL, , );
CGPathAddLineToPoint(path, NULL, , ); //设置绘图的属性
[[UIColor redColor]setStroke];//描边
[[UIColor greenColor]setFill];//填充
//[[UIColor purpleColor]set]; //既描边又填充 //将路径添加到上下文中
CGContextAddPath(context, path); //闭合路径
CGContextClosePath(context); //绘图
CGContextDrawPath(context, kCGPathFillStroke); //清理
CGPathRelease(path);
}

所画三角形截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

//绘制文字

#pragma mark -画文字(不换行、换行)

-(void)drawString:(CGContextRef)context
{
NSString *str = @"hello world"; //以点开始画不换行
[str drawAtPoint:CGPointMake(, ) withAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:],NSForegroundColorAttributeName:[UIColor blueColor]}]; //在矩形中画,超出就换行
[str drawWithRect:CGRectMake(, , , ) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:[UIFont systemFontOfSize:],NSForegroundColorAttributeName:[UIColor blueColor]} context:nil];
}

不换行和换行的文字截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等) iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

//绘制图像

#pragma mark -画图像(将原图绘制、将原图按照矩形区域大小绘制、带花边绘制)

-(void)drawImage
{
UIImage *imageName = [UIImage imageNamed:@"1.png"]; //原始图像大小
[imageName drawAtPoint:CGPointMake(, )]; //改变图像大小
[imageName drawInRect:CGRectMake(, , , )]; //花纹样式画图像
[imageName drawAsPatternInRect:CGRectMake(, , , )];
}

三种绘制的图像截图为:

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等) iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)  iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)

iOS:quartz2D绘图(画一些简单的图形,如直线、三角形、圆、矩形、文字等)的更多相关文章

  1. iOS:quartz2D绘图 (动画)

    quartz2D可以用来绘制自己需要的图形,它们绘制出来的是一个静态的图形,那么如何绘制一个动态的图形呢?动态的图形就是动画,所谓动画,其实就是很多张图片在短时间内不停的切换所产生的一种视觉效果.qu ...

  2. (转载)C# GDI+ 画简单的图形:直线、矩形、扇形等

    GDI+是一种绘图装置接口, 当拖动窗体是,窗体发生移动,window默认为从窗体移动到另一个地方,先发生擦除后再重新画一个窗体: 而我们自己动手画的图(如下面的线),不会重新画:在属性中,Paint ...

  3. [WinAPI] API 1 [桌面上画一个简单彩色图形]

    #include<Windows.h> void GdiOut(HDC hdc); int WINAPI WinMain(HINSTANCE hInstance, HINSTANCE hP ...

  4. (转)第02节:在Canvas上画简单的图形

    我们现在已经可以在HTML中使用Fabric.js库了,那这节我们就详细的学习一下如何在canvas上画出简单的图形. 在画东西之前我们需要了解画任何东西的基本三个步骤: 声明画布(canvas),用 ...

  5. 【iOS】Quartz2D绘图路径Path

    一.绘图路径 A.简单说明 在画线的时候,方法的内部默认创建一个path.它把路径都放到了path里面去. 1.创建路径  cgmutablepathref 调用该方法相当于创建了一个路径,这个路径用 ...

  6. iOS:quartz2D绘图

    Quartz-2D:绘图 一.介绍: •Quartz 2D是一个二维图形绘制引擎,支持iOS环境和Mac OS X环境   •Quartz 2D API可以实现许多功能,如基于路径的绘图.透明度.阴影 ...

  7. 阶段性总结⓵触摸事件&手势识别⓶Quartz2D绘图⓷CALayer图层⓸CAAnimation⓹UIDynamic UI动力学⓺KVC&KVO

    知识点复习   1. 触摸事件&手势识别   1> 4个触摸事件,针对视图的 2> 6个手势识别(除了用代码添加,也可以用Storyboard添加)   附加在某一个特定视图上的, ...

  8. 使用C语言实现二维&comma;三维绘图算法&lpar;3&rpar;-简单的二维分形

    使用C语言实现二维,三维绘图算法(3)-简单的二维分形 ---- 引言---- 每次使用OpenGL或DirectX写三维程序的时候, 都有一种隔靴搔痒的感觉, 对于内部的三维算法的实现不甚了解. 其 ...

  9. iOSQuart2D绘图之UIImage简单使用

    代码地址如下:http://www.demodashi.com/demo/11609.html 人生得意须尽欢,莫使金樽空对月. 天生我材必有用,千金散尽还复来. 前记 说到UIImage大家都不会感 ...

随机推荐

  1. Intent传递数据的方法

    一.传递List 1.传递List<String>的方法 ArrayList<String> info = new ArrayList<String>(); inf ...

  2. ArrayList线程不安全

    ArrayList线程不安全分析 http://wsmajunfeng.iteye.com/blog/1493941   一个 ArrayList ,在添加一个元素的时候,它可能会有两步来完成:1. ...

  3. error C2664 转换错误汇总&lbrack;转&rsqb;

    vs2005提示 error C2664: “CWnd::MessageBoxW”: 不能将参数 1 从“const char [17]”转换为“LPCTSTR”. 在用vs2005编写mfc程序的时 ...

  4. SZU&colon;J38 Number Base Conversion

    Judge Info Memory Limit: 32768KB Case Time Limit: 1000MS Time Limit: 1000MS Judger: Number Only Judg ...

  5. 利用data属性来存json、和取数据还原json

    data属性用JSON.stringify转化为字符串存进去,,,取出来自动会变成json数组的

  6. 如何 dump jvm 内存及线程栈

    1. dump jvm 内存 命令格式: jmap -dump:format=b,file=dump_file_name pid举例:dump pid 为 3239 的 java 进程的内存到 aa. ...

  7. Linux开发黑客

    参考网站:http://blog.chinaunix.net/uid/20543672/abstract/1.html tekkamanninja

  8. Python中time模块详解&lpar;转&rpar;

    在平常的代码中,我们常常需要与时间打交道.在Python中,与时间处理有关的模块就包括:time,datetime以及calendar.这篇文章,主要讲解time模块. 在开始之前,首先要说明这几点: ...

  9. kali漏洞扫描

    nmap (apt-get install nmap)          nmap从初级到高级 ------------------------------ Nessus (dpkg -i Nessu ...

  10. VUE&period;js 中取得后台原生HTML字符串 原样显示问题

    今天使用vue调试页面,发现了页面上的一个问题,后台数据传过来的HTML字符串并没有被转换为正常的HTML代码,一拍脑门,发现忘记转换了,于是满心欢喜加上了{{{}}}.但是之后构建发现报错: 为此去 ...