iOS中有时候会遇到虚线绘制，关于绘制虚线有两种方式，一种是通过Context绘制图片通过UIImageView展示虚线，第二中通过CAShapeLayer的形式设置虚线.

Context绘制虚线

简单看一下实现效果:

FlyElephant.png

除了最后一行，前面都是通过Context来实现的，主要是针对几个属性的设置来进行详细设置.
核心代码:
<pre><code>` let imgView:UIImageView = UIImageView(frame: CGRect(x: 0, y: 100, width: self.view.frame.width, height: 20))
self.view.addSubview(imgView)

    UIGraphicsBeginImageContext(imgView.frame.size) // 位图上下文绘制区域
    imgView.image?.draw(in: imgView.bounds)
    
    let context:CGContext = UIGraphicsGetCurrentContext()!
    
    context.setLineCap(CGLineCap.square)
    
    let lengths:[CGFloat] = [10,20] // 绘制 跳过 无限循环
    
    context.setStrokeColor(UIColor.red.cgColor)
    context.setLineWidth(5)
    context.setLineDash(phase: 0, lengths: lengths)
    context.move(to: CGPoint(x: 0, y: 10))
    context.addLine(to: CGPoint(x: self.view.frame.width, y: 10))
    context.strokePath()
    
    imgView.image = UIGraphicsGetImageFromCurrentImageContext()`</code></pre>

基本设置绘制区域，区域颜色，线条高度，有一个需要介绍的方式是:
<pre><code>context.setLineDash(phase: 0, lengths: lengths)</code></pre>

虚线设置两个重要参数:
①phase表示开始绘制之前跳过多少点进行绘制，默认一般设置为0，第二张图片是设置5的实际效果图.

②lengths通常都包含两个数字，第一个是绘制的宽度，第二个表示跳过的宽度，也可以设置多个，第三张图是设置为三个参数的实际效果图.绘制按照先绘制，跳过，再绘制，再跳过，无限循环.
<pre><code>let lengths:[CGFloat] = [10,20,10] // 绘制 跳过 无限循环</code></pre>

项目中有的时候遇到，单一颜色虚线太单调，如果想设置两种颜色的虚线，设置多种线条路径，可以根据起始位置来控制.
<pre><code>context.move(to: CGPoint(x: 15, y: 10))</code></pre>
倒数第二张图实现代码:
<pre><code>` let imgView:UIImageView = UIImageView(frame: CGRect(x: 0, y: 250, width: self.view.frame.width, height: 20))
self.view.addSubview(imgView)

    UIGraphicsBeginImageContext(imgView.frame.size) // 位图上下文绘制区域 FlyElephant
    imgView.image?.draw(in: imgView.bounds)
    
    let context:CGContext = UIGraphicsGetCurrentContext()!
    
    context.setLineCap(CGLineCap.square)
    
    let lengths:[CGFloat] = [10,20] // 绘制 跳过 无限循环
    
    context.setStrokeColor(UIColor.red.cgColor)
    context.setLineWidth(2)
    context.setLineDash(phase: 0, lengths: lengths)
    context.move(to: CGPoint(x: 0, y: 10))
    context.addLine(to: CGPoint(x: self.view.frame.width, y: 10))
    context.strokePath()
    
    context.setStrokeColor(UIColor.blue.cgColor)
    context.setLineWidth(2)
    context.setLineDash(phase: 0, lengths: lengths)
    context.move(to: CGPoint(x: 15, y: 10))
    context.addLine(to: CGPoint(x: self.view.frame.width, y: 10))
    context.strokePath()
    
    imgView.image = UIGraphicsGetImageFromCurrentImageContext()`</code></pre>

CAShapeLayer 实现方式

第一种方式实现起来非常方便，关于context的使用Swift中已经简化了很多代码，不会像OC中那么冗余，实现起来那么费劲.CAShapeLayer实现起来与Context相比大同小异.
核心代码:
<pre><code>` let lineView:UIView = UIView(frame: CGRect(x: 0, y: 300, width: self.view.frame.width, height: 20))
self.view.addSubview(lineView)

    let shapeLayer:CAShapeLayer = CAShapeLayer()
    
    shapeLayer.bounds = lineView.bounds
    
    shapeLayer.position = CGPoint(x: lineView.frame.width / 2, y: lineView.frame.height / 2)
    
    shapeLayer.fillColor = UIColor.clear.cgColor
    shapeLayer.strokeColor = UIColor.red.cgColor
    
    shapeLayer.lineWidth = 5
    shapeLayer.lineJoin = kCALineJoinRound
    shapeLayer.lineDashPhase = 0
    shapeLayer.lineDashPattern = [NSNumber(value: 10), NSNumber(value: 20)]
    
    let path:CGMutablePath = CGMutablePath()
    path.move(to: CGPoint(x: 0, y: 10))
    path.addLine(to: CGPoint(x: lineView.frame.width, y: 10))
    shapeLayer.path = path
    
    lineView.layer.addSublayer(shapeLayer)`</code></pre>