Quartz2D绘图<二>绘制实线和虚线

最新推荐文章于 2021-02-27 05:34:59 发布

JackLee18

最新推荐文章于 2021-02-27 05:34:59 发布

阅读量1.1k

点赞数

分类专栏： IOS 文章标签： quartz 实线虚线

本文链接：https://blog.csdn.net/hanhailong18/article/details/48828857

版权

IOS 专栏收录该内容

299 篇文章 2 订阅

订阅专栏

1，绘制实线

绘制实线的代码比较好理解，我就直接上代码了

-(void)drawSolidLineWithContext:(CGContextRef)ctx{
    CGContextSetLineWidth(ctx, 5.0f); //设置线宽
    CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);

    //- - - - - - - - - - - - - - - - - - - - - - -  - - - -  - -  - - - - - - - -
    /****************  下面绘制3个线段测试端点形状    ******************/
    //- - - - - - - - - - - - - - - - - - - - - - -  - - - -  - -  - - - - - - - -

    //**************************************************************************
    //定义4个点，绘制线段
    const CGPoint points1[]={CGPointMake(10, 40),CGPointMake(100, 40),CGPointMake(100, 40),CGPointMake(20, 80)};//该方法需要传入2N个CGPoint组成的数组，其中1,2个点组成第一条线段，3，4个点组成第3条线段

    CGContextStrokeLineSegments(ctx, points1, 4);  //绘制线段（默认不绘制端点）

     //**************************************************************************
    CGContextSetLineCap(ctx, kCGLineCapSquare);    // 设置线段的端点形状，方形端点

    const CGPoint points2[] = {CGPointMake(110, 40),CGPointMake(200, 40),CGPointMake(200, 40),CGPointMake(120, 80)};
    CGContextStrokeLineSegments(ctx, points2, 4);  //绘制线段（默认不绘制端点）


    //**************************************************************************

     CGContextSetLineCap(ctx, kCGLineCapRound);     //设置端点的形状：圆形端点

    const CGPoint points3[] = {CGPointMake(210, 40),CGPointMake(300, 40),CGPointMake(300, 40),CGPointMake(220, 80)};
    CGContextStrokeLineSegments(ctx, points3, 4);  //绘制线段（默认不绘制端点）

    //**************************************************************************


}

运行效果如下：
这里写图片描述
2，绘制虚线
在绘制虚线的时候用到了CGContextSetLineDash（context，phase，lengths，count）这个函数，这个函数需要四个参数
context – 这个不用多说
phase - 稍后再说
lengths – 指明虚线是如何交替绘制,具体看例子
count 是 lengths数组的长度
下面结合例子来说明一下：

CGContextSetLineWidth(ctx, 5.0f); //设置线宽
    CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);


    //**************************************************************************

    CGContextSetLineCap(ctx, kCGLineCapButt);    //设置线段的端点形状
    CGContextSetLineWidth(ctx, 2);
    CGFloat lengths[] ={10,10};lengths的值{10,10}表示先绘制10个点,再跳过10个点,如此反复, 如图:  
    CGContextSetLineDash(ctx, 0, lengths, 2); //
    const CGPoint points4[] ={CGPointMake(40, 100),CGPointMake(280, 100)};
    //定义两个点，绘制线段
    CGContextStrokeLineSegments(ctx, points4, 2);  //绘制线段

运行结果如下图：
这里写图片描述
如果把lengths值改为{10, 30, 10},则表示先绘制10个点,跳过30个点,绘制10个点,跳过10个点,再绘制30个点,如此反复,如图:

注意count的值等于lengths数组的长度，此时lengths的长度为3

phase参数表示在第一个虚线绘制的时候跳过多少个点,举例说明:
phase设置为5

CGContextSetLineCap(ctx, kCGLineCapButt);    //设置线段的端点形状
    CGContextSetLineWidth(ctx, 2);
    CGFloat lengths[] ={10,10};lengths的值{10,10}表示先绘制10个点,再跳过10个点,如此反复, 如图:  
    CGContextSetLineDash(ctx, 5, lengths, 2); //phase设置为5
    const CGPoint points4[] ={CGPointMake(40, 100),CGPointMake(280, 100)};
    //定义两个点，绘制线段
    CGContextStrokeLineSegments(ctx, points4, 2);  //绘制线段

运行效果如下：
这里写图片描述


phase设置为2

-(void)drawDashLineWithContext:(CGContextRef)ctx{  // 绘制虚线



    CGContextSetLineWidth(ctx, 5.0f); //设置线宽
    CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);


    //**************************************************************************

    CGContextSetLineCap(ctx, kCGLineCapButt);    //设置线段的端点形状
    CGContextSetLineWidth(ctx, 2);
    CGFloat lengths[] ={10,10};//lengths的值{10,10}表示先绘制10个点,再跳过10个点,如此反复, 如图: 
    CGContextSetLineDash(ctx, 2, lengths, 2); phase设置为2
    const CGPoint points4[] ={CGPointMake(40, 100),CGPointMake(280, 100)};
    //定义两个点，绘制线段
    CGContextStrokeLineSegments(ctx, points4, 2);  //绘制线段


}