关于Quartz 2D绘图的简单使用

Quartz 2D是一个二维图形绘制引擎,支持iOS环境和Mac OS X环境,Quartz 2D的API可以实现许多功能,如:基于路径的绘图丶透明度丶阴影丶颜色管理丶反锯齿丶PDF文档生成和PDF元数据访问等等.Quartz 2D的API是Core Graphics框架的一部分,因此其中的很多数据类型和方法都是以CG开头的.

ViewController.m 文件:

- (void)viewDidLoad {    [super viewDidLoad];    MyView *view = [[MyView alloc] initWithFrame:CGRectMake(50, 50, 200, 200)];    [self.view addSubview:view];    }

MyView.m 文件:

@implementation MyView/*// Only override drawRect: if you perform custom drawing.// An empty implementation adversely affects performance during animation. */- (void)drawRect:(CGRect)rect {    // Drawing code    // 1.使用绘制的方法显示图片    UIImage *image = [UIImage imageNamed:@"1.png"];    // 2.把图片绘制到视图上    [image drawInRect:self.bounds];}@end

图形上下文(Graphics Context)-----绘制目标,画布

Graphics Context是一个数据类型(CGContextRef),封装了 Quartz 绘制图像到输出设备的信息.输出设备可以是PDF文件丶Bitmap或者显示在窗口上.Quartz中所有的对象都是绘制到一个Graphics Context中!

在iOS应用程序中,如果要在屏幕上进行绘制,需要定义一个UIView类,并实现它的drawRect:方法.视图的drawRect方法在视图显示在屏幕上及它的内容需要更新时被调用.在调用自定义的drawRect:方法后,视图对象自动配置绘图环境,以便能立即执行绘图操作

Quartz 2D 中默认的坐标系统是: 远点(0,0)在左下角.沿着X轴从左向右坐标值增大,沿着Y轴从下到上坐标值增大

- (void)drawRect:(CGRect)rect{    // 1.绘制图片    UIImage *image = [UIImage imageNamed:@"1.png"];    // 2.//    [image drawInRect:rect];    // 01 获取画布对象    CGContextRef context = UIGraphicsGetCurrentContext();    // 坐标变换    CGContextRotateCTM(context, M_PI);    CGContextScaleCTM(context, -1, 1);    CGContextTranslateCTM(context, 0, -self.frame.size.height);    // 02 绘制图片    CGContextDrawImage(context, rect, image.CGImage);}@end

< 自定义Label>:

- (instancetype)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {                // 1.初始化设置属性的值        _font = [UIFont systemFontOfSize:16];        _textColor = [UIColor blackColor];        _backgroundColor = [UIColor whiteColor];//        _textAlignment = NSTextAlignmentLeft;    }    return self;}- (void)setText:(NSString *)text{    if (_text != text) {                _text = text;    }        [self setNeedsDisplay];}- (void)setTextColor:(UIColor *)textColor{    if (_textColor != textColor) {                _textColor = textColor;    }    [self setNeedsDisplay];}- (void)setBackgroundColor:(UIColor *)backgroundColor{    if (_backgroundColor != backgroundColor) {                _backgroundColor = backgroundColor;    }    [self setNeedsDisplay];}// 字体属性配置key注视Attributes：http://www.cnblogs.com/qingche/p/3574995.html- (void)drawRect:(CGRect)rect {    // Drawing code        // 1.绘制文本    // 设置字体颜色    [_textColor setFill];        NSDictionary *dic = @{                          NSFontAttributeName : _font,                          NSForegroundColorAttributeName : _textColor,                          NSBackgroundColorAttributeName : _backgroundColor                          };        [_text drawInRect:rect withAttributes:dic]; }

< 绘制图形Demo >:

@implementation MyView- (void)drawRect:(CGRect)rect{    // 1.绘制一条直线//    [self drawZLine];        // 2.绘制一个矩形//    [self drawRect];        // 3.绘制一个圆形//    [self drawArc];        // 4.绘制贝塞尔曲线    [self drawQLine];}// 4.绘制贝塞尔曲线- (void)drawQLine{    // 1.获取画布对象    CGContextRef context = UIGraphicsGetCurrentContext();    // 2.设置画笔    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);    CGContextSetLineWidth(context, 2);    // 3.设置画笔的起始点    CGContextMoveToPoint(context, 10, 200);    // 4.开始添加曲线路径    CGContextAddCurveToPoint(context, 30, 50, 175 - 30, 50, 175 - 10, 200);    // 5.开始绘制    CGContextDrawPath(context, kCGPathStroke);}// 3.绘制一个圆形- (void)drawArc{    // 1.获取画布    CGContextRef context = UIGraphicsGetCurrentContext();    // 2.设置画笔    CGContextSetStrokeColorWithColor(context, [UIColor orangeColor].CGColor);    CGContextSetLineWidth(context, 4);    // 3.设置填充颜色    CGContextSetFillColorWithColor(context, [UIColor yellowColor].CGColor);    // 4.绘制圆形路径    CGContextAddArc(context, 100, 100, 50, 0, 2*M_PI, 0);    // 5.开始绘制    CGContextDrawPath(context, kCGPathFillStroke);}// 2.绘制一个矩形- (void)drawRect{    // 1.获取画布    CGContextRef context = UIGraphicsGetCurrentContext();    // 2.设置画笔    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);    CGContextSetLineWidth(context, 2);    // 3.设置矩形路径    CGContextAddRect(context, CGRectMake(10, 20, 100, 100));    // 4.开始绘制    CGContextDrawPath(context, kCGPathStroke);}// 1.绘制一条直线- (void)drawZLine{    // 1.获取当前视图的绘制画布    CGContextRef context = UIGraphicsGetCurrentContext();    // 2.设置画笔的颜色    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);    // 3.设置画笔的宽度    CGContextSetLineWidth(context, 5);    // 4.设置话题的七点位置    CGContextMoveToPoint(context, 20, 20);    // 5.让画笔移动指定位置绘制出一条线    CGContextAddLineToPoint(context, 220, 20);    CGContextAddLineToPoint(context, 20, 50);    CGContextAddLineToPoint(context, 20, 20);    // 设置填充的颜色    CGContextSetFillColorWithColor(context, [UIColor greenColor].CGColor);    // 6.开始绘制    // kCGPathFillStroke 枚举类型，指定绘制视图颜色填充的方式    CGContextDrawPath(context, kCGPathFillStroke);}

< 颜色渐变Demo>:

- (void)viewDidLoad {    [super viewDidLoad];    //颜色渐变    CAGradientLayer *gradient = [CAGradientLayer layer];        gradient.frame = CGRectMake(20, 100, 300, 400);        NSArray *colors = @[                         (id)[UIColor cyanColor].CGColor,                         (id)[UIColor colorWithRed:0.170 green:0.752 blue:1.000 alpha:1.000].CGColor,                         (id)[UIColor colorWithRed:0.211 green:0.332 blue:1.000 alpha:1.000].CGColor                         ];    gradient.colors = colors;    gradient.startPoint=CGPointMake(0, 0);    gradient.endPoint=CGPointMake(1, 1);    [self.view.layer insertSublayer:gradient atIndex:0];}