iOS绘制虚线

作者: 蝼蚁撼树 | 来源:发表于2017-02-24 15:42 被阅读0次

    画虚线需要用到函数:

    CGContextSetLineDash

    此函数需要四个参数:

    • context – 这个不用多说
    • phase - 稍后再说
    • lengths – 指明虚线是如何交替绘制,具体看例子
    • count – lengths数组的长度
    CGContextRef context =UIGraphicsGetCurrentContext();  
    CGContextBeginPath(context);  
    CGContextSetLineWidth(context, 2.0);  
    CGContextSetStrokeColorWithColor(context, [UIColorwhiteColor].CGColor);  
    float lengths[] = {10,10};  
    CGContextSetLineDash(context, 0, lengths,2);  
    CGContextMoveToPoint(context, 10.0, 20.0);  
    CGContextAddLineToPoint(context, 310.0,20.0);  
    CGContextStrokePath(context);  
    CGContextClosePath(context); 
    

    lengths的值{10,10}表示先绘制10个点,再跳过10个点,如此反复,如图:


    0_1328429173RRMR.png

    如果把lengths值改为{10, 20, 10},则表示先绘制10个点,跳过20个点,绘制10个点,跳过10个点,再绘制20个点,如此反复,如图:


    0_1328429523yqLp.png

    注意count的值等于lengths数组的长度

    float lengths[] = {10,5};  
    CGContextSetLineDash(context, 0, lengths, 2);    
    CGContextMoveToPoint(context, 0.0, 20.0);    
    CGContextAddLineToPoint(context, 310.0, 20.0);     
    CGContextStrokePath(context);  
                              
    CGContextSetLineDash(context, 5, lengths, 2);  
    CGContextMoveToPoint(context, 0.0, 40.0);    
    CGContextAddLineToPoint(context, 310.0, 40.0);  
    CGContextStrokePath(context);             
                                                  
    CGContextSetLineDash(context, 8, lengths, 2);     
    CGContextMoveToPoint(context, 0.0, 60.0);             
    CGContextAddLineToPoint(context, 310.0, 60.);             
    CGContextStrokePath(context);
    
    0_13284305046O6f.png

    由于lengths值为{10,5},第一条线就是绘制10,跳过5,反复绘制。

    第二条线的phase值为5,则首先绘制【10减去5】,再跳过5,绘制10,反复绘制。

    第三条给也如此,先绘制2,再跳过5,如此反复。

    项目扩展 ---画弯曲的虚线
    -(void)drawRect:(CGRect)rect
    {
        CGFloat selfW = rect.size.width;
        CGFloat selfH = rect.size.height;
        CGPoint point1 = CGPointMake(selfW, 5);
        CGPoint point2 = CGPointMake(10, 5);
        CGPoint point3 = CGPointMake(5, 10);
        CGPoint point4 = CGPointMake(5, selfH-10);
        CGPoint point5 = CGPointMake(10, selfH-5);
        CGPoint point6 = CGPointMake(selfW, selfH-5);
    
        //贝斯曲线的控制点 --画圆角用
        CGPoint controlPoint1 = CGPointMake(5, 5);
        CGPoint controlPoint2 = CGPointMake(5, selfH-5);
    
        CGContextRef context =UIGraphicsGetCurrentContext();
        CGContextBeginPath(context);
        CGContextSetLineWidth(context, 1);
        CGContextSetStrokeColorWithColor(context, [UIColor whiteColor].CGColor);
        const CGFloat lengths[] = {2,2};
        CGContextSetLineDash(context, 0, lengths,2);
        CGContextSetLineJoin(context, kCGLineJoinRound);
        CGContextMoveToPoint(context, point1.x, point1.y);
        CGContextAddLineToPoint(context, point2.x, point2.y);
        CGContextAddQuadCurveToPoint(context, controlPoint1.x ,controlPoint1.y , point3.x,point3.y );
        CGContextAddLineToPoint(context, point4.x, point4.y);
        CGContextAddQuadCurveToPoint(context,controlPoint2.x ,  controlPoint2.y , point5.x ,point5.y);
        CGContextAddLineToPoint(context, point6.x, point6.y);
        CGContextStrokePath(context);
        CGContextClosePath(context);
    
    }
    

    效果图:

    效果图

    相关文章

      网友评论

        本文标题:iOS绘制虚线

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