欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

一、基本图形绘制-画线

程序员文章站 2022-07-04 15:00:11
...

Quarz 2D是一个二维绘图引擎,用它能够:
➤绘制图形:线条、三角形、矩形、圆、弧等
➤绘制文字
➤绘制\生成图片(图像)
➤读取\生成PDF
➤截取\裁剪图片
➤自定义UI控件

Quarz 2D实例:

Quarz 2D能做很多强大的事情,比如
➤裁剪图片\圆形裁剪,
➤ 涂鸦画板,
➤ 以及手势解锁,
➤ 报表(折线图,饼状图,柱状图)

自定义view

在你的view上画东西,首先你要明白“图形上下文(Graphics Context)”的概念

  • 图形上下文(Graphics Context):你可以想象理解成画板,它是一个CGContextRef类型的数据,属于CoreGraphics(核心绘图)框架。
  • 图形上下文的作用:
    ➤保存绘图信息、绘图状态
    ➤决定绘制的输出目标(绘制到什么地方)(输出的目标可以是PDF文件,Bitmap或者显示器的窗口上)
  • 相同的一套绘图序列,指定不同的Graphics Context,就可以将相同的图像绘制到不同的目标

☐ Quarz 2D提供了以下几种类型的图形上下文:

➢Bitmap Graphics Context
➢ PDF Graphics Context
➢Window Graphics Context
➢Layer Graphics Context
➢Printer Graphics Context

自定义view

  • 如何利用Quarz 2D绘制东西到view上?
    ➢首先得有图形上下文,因为它能保存绘图信息,并且决定着绘制到什么地方去
    ➢其次,哪个图形上下文必须跟view相关联,才嫩将内容绘制到view上面
  • 自定义View步骤:
    ➢新建一个类,继承自UIView
    ➢实现- (void)drawRect:(CGRect)rect方法,然后在这个方法中:
    • 取得跟当前view相关联的图形上下文
    • 绘制相应的图形内容---描述路径
    • 利用图形上下文绘制的所有内容渲染显示到view上

新建一个MuView类,继承自UIView
#import <UIKit/UIKit.h>
@interface MuView : UIView
@end
在故事版中拖拽一个UIView,让其绑定MuView类型
drawRect
#import "MuView.h"
@implementation MuView
- (void)drawRect:(CGRect)rect{
/*因为只有在drawRect这个方法里面才能获取到跟view的layer相关联的图形上下文
*rect是当前控件的bounds
*当这个view要显示的时候,才会调用drawRect绘制图形
*/
[self ..];

@end

.

  -(void)drawLine{
    //    1获取图形上下文
    //     目前我们所用的上下文都是以UIGraphics开头的
    //    CGContextRef Ref饮用  CG:目前使用到的类型和函数 一般都是CG开头 CoreGraphics
    CGContextRef ctf = UIGraphicsGetCurrentContext();

    //    2描述路径
    //    创建路径
    CGMutablePathRef path = CGPathCreateMutable();
    //设置起点
    //path:给哪个路径设置起点 CGAffineTransform:形变 x、y代表起点
    CGPathMoveToPoint( path, NULL, 50, 50);

    //添加一根线到某个点
    CGPathAddLineToPoint(path, NULL, 200, 200);

    //    3把路径添加到上下文
    CGContextAddPath(ctf, path);
    //    4渲染上下文
    CGContextStrokePath(ctf);


}

.

- (void)drawLine1{
    //    获取上下文
    CGContextRef ref = UIGraphicsGetCurrentContext();
    //    描述路径
    //    设置起点 在这底层会帮我们创建一个path
    CGContextMoveToPoint(ref, 150, 150);
    CGContextAddLineToPoint(ref, 50, 50);

    //    渲染上下文
    CGContextStrokePath(ref);
}

.

-(void)drawLine2{
 //UIKIT已经帮我们封装了一些绘图的功能
UIBezierPath *path = [UIBezierPath bezierPath];
//    设置起点
[path moveToPoint:CGPointMake(50, 50)];
//    添加一根线到某个点
[path addLineToPoint:CGPointMake(100, 100)];
//    绘制路径
[path stroke];
}