iOS开发交流平台iOS开发精进iOS

IOS绘制虚线的方法总结

2017-03-14  本文已影响1338人  轻斟浅醉17

一、重写drawRect方法

    - (void)drawRect:(CGRect)rect
    {
     [super drawRect:rect];
    CGContextRef currentContext = UIGraphicsGetCurrentContext();
    //设置虚线颜色
     CGContextSetStrokeColorWithColor(currentContext, [UIColor     BlackColor].CGColor);
     //设置虚线宽度
     CGContextSetLineWidth(currentContext, 1);
     //设置虚线绘制起点
     CGContextMoveToPoint(currentContext, 0, 0);
     //设置虚线绘制终点
     CGContextAddLineToPoint(currentContext, self.frame.origin.x + self.frame.size.width, 0);
     //设置虚线排列的宽度间隔:下面的arr中的数字表示先绘制3个点再绘制1个点
     CGFloat arr[] = {3,1};
     //下面最后一个参数“2”代表排列的个数。
     CGContextSetLineDash(currentContext, 0, arr, 2);
     CGContextDrawPath(currentContext, kCGPathStroke);
    }

二、采用CAShapeLayer方式绘制虚线

    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    [shapeLayer setBounds:self.bounds];
    [shapeLayer setPosition:CGPointMake(self.frame.size.width / 2.0,       self.frame.size.height)];
    [shapeLayer setFillColor:[UIColor clearColor].CGColor];
    //设置虚线颜色
    shapeLayer setStrokeColor:[UIColor BlackColor].CGColor];
    //设置虚线宽度
    [shapeLayer setLineWidth:self.frame.size.height];
    [shapeLayer setLineJoin:kCALineJoinRound];
    //设置虚线的线宽及间距
     [shapeLayer setLineDashPattern:[NSArray arrayWithObjects:[NSNumber       numberWithInt:3], [NSNumber numberWithInt:1], nil]];
     //创建虚线绘制路径
     CGMutablePathRef path = CGPathCreateMutable();
     //设置虚线绘制路径起点
     CGPathMoveToPoint(path, NULL, 0, 0);
     //设置虚线绘制路径终点
      CGPathAddLineToPoint(path, NULL, self.frame.size.width, 0);
       //设置虚线绘制路径
     [shapeLayer setPath:path];
     CGPathRelease(path);
     //添加虚线
     [self.layer addSublayer:shapeLayer];

三、经济实惠型:采用贴图的方式绘制虚线(需要设计师切图配合)

      UIImageView *imgDashLineView =[[UIImageView alloc] initWithFrame:CGRectMake(15, 200, self.view.frame.size.width - 30, 1)];
    [imgDashLineView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage         imageNamed:@"xuxian.png"]]];
      [self.view addSubview:imgDashLineView];
上一篇 下一篇

猜你喜欢

热点阅读