Quartz2D

作者: i诺离 | 来源:发表于2016-12-27 11:00 被阅读0次

    基础知识

    • Quartz2D的API来自于Core Graphics框架

    • View内部有个layer(图层)属性,drawRect:方法中取得的是一个Layer Graphics Context,因此,绘制的东西其实是绘制到view的layer上去了

    • 绘图系统创建了一个图形上下文(CGContext)。上下文包括大量信息,比如画笔颜色、文本颜色、当前字体、变形等。

    • 填充规则:

    1. 不自交的多边形:多边形仅在顶点处连接,而在平面内没有其他公共点,此时可以直接划分内-外部分。
    2. 自相交的多边形:多边形在平面内除顶点外还有其他公共点,此时划分内-外部分需要采用以下的方法。
      (1)奇-偶规则(Odd-even Rule):奇数表示在多边形内,偶数表示在多边形外
      从任意位置p作一条射线,若与该射线相交的多边形边的数目为奇数,则p是多边形内部点,否则是外部点。
      (2)非零环绕数规则(Nonzero Winding Number Rule):若环绕数为0表示在多边形内,非零表示在多边形外
    3. 环绕数判断:从点p向外做一条射线(可以任意方向),多边形的边从左到右经过射线时环数减1,多边形的边从右往左经过射线时环数加1,再根据上述的规则进行画图;


    Demo

    划线

    使用颜色来画一张图片

    将图片绘制到view上

    在view上绘制文字

    绘制水印图片

    抗锯齿和反锯齿

    图形上下文栈的操作

    画阴影

    创建pdf

    • 划线
    // 获得图形上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    // 拼接路径(下面代码是搞一条线段)
    CGContextMoveToPoint(ctx, 10, 10);
    CGContextAddLineToPoint(ctx, 100, 100);
    
    // 绘制路径
    CGContextStrokePath(ctx); // CGContextFillPath(ctx);
    
    // 常用拼接路径函数
    // 新建一个起点
    void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y)
    
    // 添加新的线段到某个点
    void CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat y)
    
    // 添加一个矩形
    void CGContextAddRect(CGContextRef c, CGRect rect)
    
    // 添加一个椭圆
    void CGContextAddEllipseInRect(CGContextRef context, CGRect rect)
    
    // 添加一个圆弧
    void CGContextAddArc(CGContextRef c, CGFloat x, CGFloat y,
      CGFloat radius, CGFloat startAngle, CGFloat endAngle, int clockwise)
    
    // 设置线条的虚线样式
    // phase 相位,虚线起始的位置,通常使用0即可,从头开始画虚线
    // lengths : 数组中为实线长、虚线长、实现长。。。
    // count lengths:数组中的个数
    CGFloat lengths[4] = {40.0, 40.0};
    CGContextSetLineDash(context, 0.0, lengths, 2);
    
    // 常用绘制路径函数
    // Mode参数决定绘制的模式
    void CGContextDrawPath(CGContextRef c, CGPathDrawingMode mode)  
    
    CGPathDrawingMode:
    调用 CGContextDrawPath(context, kCGPathFill) 填充路径。
    调用 CGContextDrawPath(context, kCGPathEOFill) 使用奇偶规则填充路径。
    调用 CGContextDrawPath(context, kCGPathStroke) 描边路径。
    调用 CGContextDrawPath(context, kCGPathFillStroke) 填充并描边路径。
    调用 CGContextDrawPath(context, kCGPathEOFillStroke) 使用奇偶规则填充并描边路径。
    
    // 绘制空心路径(不填充)
    void CGContextStrokePath(CGContextRef c)
    // 将路径内的空间填充
    void CGContextFillPath(CGContextRef c)
    
    // 边线颜色
    CGContextSetRGBStrokeColor(context, 0.7, 0.7, 0.5, 1);
    
    // 填充颜色
    CGContextSetRGBFillColor(context, 1, 0, 0, 1);
    
    // 线宽
    CGContextSetLineWidth(context, 10);
    
    // 设置线条的顶点样式
    CGContextSetLineCap(context, kCGLineCapButt);
    
    // 设置线条的连接点样式
    CGContextSetLineJoin(context, kCGLineJoinRound);
    
    
    • 使用颜色来画一张图片
    // 描述矩形
    CGRect rect=CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
    // 开启位图上下文
    UIGraphicsBeginImageContext(rect.size);
    // 获取位图上下文
    CGContextRef context = UIGraphicsGetCurrentContext();
    // 使用color演示填充上下文
    CGContextSetFillColorWithColor(context, [[UIColor redColor] CGColor]);
    // 渲染上下文
    CGContextFillRect(context, rect);
    // 从上下文中获取图片
    UIImage *theImage = UIGraphicsGetImageFromCurrentImageContext();
    // 结束上下文
    UIGraphicsEndImageContext();
    
    // 另一种
    UIGraphicsBeginImageContext([UIScreen mainScreen].bounds.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetRGBFillColor(context, 1, 0, 0, 1);
    CGContextFillRect(context, CGRectMake (0, 0, 200, 100));
    CGContextSetRGBFillColor(context, 0, 0, 1, .5);
    CGContextFillRect(context, CGRectMake (0, 0, 100, 200));
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();//CGBitmapContextCreateImage(context)
    UIGraphicsEndImageContext()
    
    • 将图片绘制到view上
    UIImage *image = [UIImage imageNamed:@"头像1.png"];
    
    // 提示:绘制之后,就无法改变位置,也没有办法监听手势识别
    
    // 在指定点绘制图像
    [image drawAtPoint:CGPointMake(50, 50)];
    
    //会在指定的矩形中拉伸绘制
    [image drawInRect:CGRectMake(0, 0, 320, 460)];
    
    //在指定矩形区域中平铺图片
    [image drawAsPatternInRect:CGRectMake(0, 0, 320, 460)];
    
    // 加入混合模式的绘制(混合模式只试过这个有作用)
    [image drawInRect:CGRectMake(0, 0, 100, 100) blendMode:kCGBlendModeOverlay alpha:1];
    
    常用的混合模式:
    
    kCGBlendModeNormal 正常
    kCGBlendModeMultiply 正片叠底
    kCGBlendModeScreen 滤色(屏幕)
    kCGBlendModeOverlay 叠加
    kCGBlendModeDarken 变暗
    kCGBlendModeLighten 变亮
    kCGBlendModeColorDodge 颜色减淡
    kCGBlendModeColorBurn 颜色加深
    kCGBlendModeSoftLight 柔光
    kCGBlendModeHardLight 强光
    kCGBlendModeDifference 差值
    kCGBlendModeExclusion 排除
    kCGBlendModeHue 色相
    kCGBlendModeSaturation 饱和度
    kCGBlendModeColor 颜色
    kCGBlendModeLuminosity 明度
    
    
    
    • 在view上绘制文字
    NSString *string = @"时间到了反馈结束了的开发就流口水的减肥来看就";
    
    //在指定点绘制文字
    [string drawAtPoint:CGPointMake(0, 0) withAttributes:@{NSForegroundColorAttributeName:[UIColor redColor]}];
    
    //在指定的矩形区域绘制文字
    CGRect rect = CGRectMake(50, 50, 210, 360);
    
    [string drawInRect:rect withAttributes:@{NSForegroundColorAttributeName:[UIColor redColor]}];
    
    // 提示:如果不在drawRect方法中调用绘图方法,上下文地址都是0,不能直接进行绘制
    
    • 绘制水印图片(综合上述的方法)
    // 1. 建立图像的上下文,需要指定新生成的图像大小
    CGSize imageSize = CGSizeMake(320, 200);
    UIGraphicsBeginImageContext(imageSize);
    
    // 2、绘制图片
    UIImage *image = [UIImage imageNamed:@"NatGeo01.png"];
    [image drawInRect:CGRectMake(0, 0, imageSize.width, imageSize.height)];
    
    // 3、绘制矩形
    [[UIColor yellowColor] set];
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextAddRect(context, CGRectMake(50, 50, 100, 100));
    CGContextDrawPath(context, kCGPathEOFill);
    
    // 4、添加水印文字(按照顺序绘制在同一个图层上)
    NSString *str = @"我的水印";
    [str drawInRect:CGRectMake(0, imageSize.height - 30, imageSize.width - 20, 30)  withAttributes:@{NSForegroundColorAttributeName:[UIColor redColor]}];
    
    // 5、获取到新生成的图像,从当前上下文获取到新绘制的图像
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    
    // 6、关闭图像上下文
    UIGraphicsEndImageContext();
    
    • 抗锯齿和反锯齿
    CGContextRef context = UIGraphicsGetCurrentContext();
    // 抗锯齿
    CGContextSetShouldAntialias(context, YES);
    // 反锯齿
    CGContextSetAllowsAntialiasing(context, YES);
    
    • 图片的平移、旋转、缩放
    CGContextRef context = UIGraphicsGetCurrentContext();
    // 平移
    CGContextTranslateCTM(context, 100, 200);
    // 旋转
    CGContextRotateCTM(context, M_PI_4);
    // 缩放
    CGAffineTransform affineTransform = CGAffineTransformMakeScale(0.5, 0.8);
    CGContextConcatCTM(context, affineTransform);
    // 将图片画上去(带有基础位置,上述将位置做了处理)
    CGContextDrawImage (context, CGRectMake(0, 0, 100, 100), [UIImage imageNamed:@"image"].CGImage);
    // 也可以这样画
    UIImage *qi = [UIImage imageNamed:@"qi"];
    [qi drawAtPoint:CGPointMake(0, 0)];
    
    • 图形上下文栈的操作
      copy 一份上下文,独立存在,在其中绘画,使用copy的元素,当restore后,就恢复原来的上下文状态,相当于一个临时独立的操作。
    // 将当前的上下文copy一份,保存到栈顶(那个栈叫做”图形上下文栈”)
    void CGContextSaveGState(CGContextRef c)
    
    // 将栈顶的上下文出栈,替换掉当前的上下文
    void CGContextRestoreGState(CGContextRef c)
    
    [[UIColor redColor] set];
    CGContextSaveGState(UIGraphicsGetCurrentContext());
    [[UIColor blackColor] set];
    CGContextRestoreGState(UIGraphicsGetCurrentContext());
    UIRectFill(CGRectMake(10, 10, 100, 100)); // 红
    
    • 画阴影
    // 简单阴影
    CGSize myShadowOffset = CGSizeMake(10, 10);
    CGContextSetShadow(myContext, myShadowOffset, 5);
    CGContextSetRGBFillColor(myContext, 0, 1, 0, 1);
    CGContextFillRect(myContext, CGRectMake (wd/3 + 75, ht/2 , wd/4, ht/4));
    
    // 带颜色的阴影
    void MyDrawWithShadows(CGContextRef myContext, float wd, float ht) 
    {
        CGSize myShadowOffset = CGSizeMake(10, 10);
        CGFloat myColorValues[] = {1, 0, 0, .6};
        CGColorRef myColor;
        CGColorSpaceRef myColorSpace;
        
        UIGraphicsBeginImageContext([UIScreen mainScreen].bounds.size);
    
        myColorSpace = CGColorSpaceCreateDeviceRGB();
        myColor = CGColorCreate(myColorSpace, myColorValues);
        
        CGContextSetShadowWithColor(myContext, myShadowOffset, 5, myColor);
        
        CGContextSetRGBFillColor(myContext, 0, 0, 1, 1);
        CGContextFillRect(myContext, CGRectMake(wd/3 - 75, ht/2 - 100, wd/4, ht/4));
    
        CGColorRelease(myColor);
        CGColorSpaceRelease(myColorSpace);
    }
    
    • 创建pdf
    //PDF存储路径
    NSString *path=@"/Users/cooperlink/Desktop/aa.pdf";
    //创建pdf上下文
    UIGraphicsBeginPDFContextToFile(path,CGRectZero,nil);
    for (int i=0;i<3;i++) 
    {
     //创建pdf页面
    UIGraphicsBeginPDFPage();
    UIImage *image=[UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",i+1]];
    [image drawInRect:CGRectMake(0, (i%2)*396,306,396)];
    }
    //关闭上下文
    UIGraphicsEndPDFContext();
    

    参考:http://www.jianshu.com/p/eb6bd4b0f9a5

    相关文章

      网友评论

          本文标题:Quartz2D

          本文链接:https://www.haomeiwen.com/subject/mtrhvttx.html