zoukankan      html  css  js  c++  java
  • Quarz2D iOS 绘图

    iOS  绘图的四部步曲

    1.获取图形上下文在UIView的 drawRect:方法中才能取得跟view相关联的图形上下文,所以图形的绘制过程中的操作都得加载这个方法中

    在调用UIView的 setNeedDisplay 方法的时候,会自动的触发drawRect 方法!

    2.绘制图形

    绘制的图形包括直线、虚线、二次曲线 、椭圆(圆是特殊的椭圆) 、圆弧  以及有线组成的图形(三角形、矩形等等)!

    3.设置图形中元素的属性

    图形的属性 ---- 例如:线的属性1.颜色 2.宽度(线条的粗细)3.线条两端的形状(圆角、方形)4.多条线形成的封闭图形的填充颜色等等 

    4.渲染出效果

    提交绘制好得图形,让它在view中展示出来

    下面来贴一下代码:

    1.绘制一条直线

    //获取图形路径上下文
        CGContextRef ctf = UIGraphicsGetCurrentContext();
        //保存一份最初的图形上下文
        CGContextSaveGState(ctf);
        //第一条线
        CGContextMoveToPoint(ctf, 20, 100);//起点
        CGContextAddLineToPoint(ctf, 120, 80);//终点
        
        
        //设置线条的属性
        
        //1.设置线条的宽度
        CGContextSetLineWidth(ctf, 12);
        //2.设置线条颜色
        [[UIColor redColor] set];
        /* CGContextSetStrokeColorWithColor(ctf, [UIColor grayColor].CGColor); */
        //3.设置线条两端的的样式
        CGContextSetLineCap(ctf,kCGLineCapRound);
        
        //渲染
        CGContextStrokePath(ctf);
        
        //还原开始的时候保存的那份最纯洁的图形上下文
        CGContextRestoreGState(ctf);

    2.绘制一条虚线

     CGContextRef context = UIGraphicsGetCurrentContext();
        CGContextBeginPath(context);
       
        //lengths的值{10,10}表示先绘制10个点,再跳过10个点,如此反复,
        CGFloat lengths[] = {10,10};
        /*
        //如果把lengths值改为{10, 20, 10},则表示先绘制10个点,跳过20个点,绘制10个点,跳过10个点,再绘制20个点,如此反复
        CGFloat lengths[] = {10, 20, 10};*/
        
        //绘制虚线用到的函数
        CGContextSetLineDash(context, 0, lengths,2);
        
        CGContextMoveToPoint(context, 10.0, 20.0);
        CGContextAddLineToPoint(context, 310.0,20.0);
        
        // 设置线条的属性
        CGContextSetLineWidth(context, 2.0);
        CGContextSetStrokeColorWithColor(context, [UIColor whiteColor].CGColor);
        
        CGContextStrokePath(context);
        CGContextClosePath(context);

    3.绘制椭圆

    //获取路径上下文
        CGContextRef ctf = UIGraphicsGetCurrentContext();
        
        
        //椭圆是通过内切矩形来实现的(圆是通过内切正方形来实现的)
        CGRect rectangle = CGRectMake(60,300,200,80);
        CGContextAddEllipseInRect(ctf, rectangle);
        
        
        //设置线条的属性
        CGContextSetLineWidth(ctf, 2.0); //线条的宽度
        CGContextSetStrokeColorWithColor(ctf, [UIColor blueColor].CGColor);  //线条的颜色
        /*
         
         //设置绘制的椭圆的填充颜色
         CGContextSetFillColorWithColor(context, [UIColor greenColor].CGColor);
         CGContextFillEllipseInRect(context, rectangle);
         
         */
        //将会出的线渲染出来
        CGContextStrokePath(ctf);

    4.绘制圆弧

    //获取路径上下文
        CGContextRef ctf = UIGraphicsGetCurrentContext();
        
        /*
         param 2 、param3  做成圆心坐标
         param 4 半径
         param 5 开始绘图的角度
         param 6 结束绘图的角度
         param 7 绘图的方向 1.是顺时针方向  2.是逆时针方向
         坐标系是正右方向为x轴的正方向  正下方向为y轴的正方向
         */
        CGContextAddArc(ctf, 200/*圆心x坐标*/, 450/*圆心y坐标*/, 50/*半径*/, M_PI/6/*开始角度*/, M_PI_2/*结束角度*/, 1/*绘图方向*/);
    
        
        //设置线条的属性
        //颜色
        CGContextSetStrokeColorWithColor(ctf, [UIColor blueColor].CGColor);
         CGContextSetLineWidth(ctf, 2.0);//宽度
        
        
        
        //将会出的线渲染出来
        CGContextStrokePath(ctf);

    5.绘制二次曲线

    //获取路径上下文
        CGContextRef ctf = UIGraphicsGetCurrentContext();
        
        //二次曲线路径  起点坐标(10,200) 终点坐标(310,200)  确定曲线弧度点  【(80,10)不在曲线上】
        CGContextMoveToPoint(ctf, 10, 200);
        CGContextAddQuadCurveToPoint(ctf, 80, 10, 310, 200);
        
        //设置线条的属性
        CGContextSetLineWidth(ctf, 2.0);//宽度
        CGContextSetStrokeColorWithColor(ctf, [UIColor purpleColor].CGColor);//颜色
        //将会出的线渲染出来
        CGContextStrokePath(ctf);

    6.绘制多条连续的直线(可以构成各种图形可以是封闭的也可以不封闭)

    //获取路径上下文
        CGContextRef ctf = UIGraphicsGetCurrentContext();
        
        
        CGContextMoveToPoint(ctf, 100, 100);
        CGContextAddLineToPoint(ctf, 150, 100);
        CGContextAddLineToPoint(ctf, 150, 200);
        CGContextAddLineToPoint(ctf, 100, 200);
        CGContextAddLineToPoint(ctf, 100, 100);
        
        
        //为路径形成的图添加填充颜色  ---系统自动添加封闭路径连接形成一个封闭的可以填充的区域
        CGContextSetFillColorWithColor(ctf, [UIColor brownColor].CGColor);
        CGContextFillPath(ctf);
        
        //将会出的线渲染出来
        CGContextStrokePath(ctf);

    或者(绘制一个矩形)

     //获取路径上下文
        CGContextRef ctf = UIGraphicsGetCurrentContext();
      
        CGRect rectangle = CGRectMake(60,20,200,200);//rect 性的参数 x y 宽 高
        CGContextAddRect(ctf, rectangle);
        
        //设置线条的属性1.2.3.4.5.
        CGContextSetStrokeColorWithColor(ctf, [UIColor orangeColor].CGColor);//线条的颜色--边框颜色
        
        //将会出的线渲染出来
        CGContextStrokePath(ctf);
        
        /*//设置画的矩形的填充颜色
        CGContextSetFillColorWithColor(ctf, [UIColor redColor].CGColor);
        CGContextFillRect(ctf, rectangle);*/

    文章到这也就结束了,希望对路过的朋友有所帮助!!!

  • 相关阅读:
    控制流程
    表达式
    2020.2.7
    寒假自学进度六
    2020.2.6
    2020.2.5
    寒假自学进度五
    Scala初级实验
    寒假自学进度四
    Spark运行基本流程
  • 原文地址:https://www.cnblogs.com/Mgs1991/p/5137315.html
Copyright © 2011-2022 走看看