以虚线圆圈计算笔画属性'Dash' - Swift

时间:2016-07-19 05:06:08

标签: swift swift2 core-graphics uibezierpath swift3

我正在开发一款应用。我还没有完成Swift 2.2 / 3.0的学徒训练,我正在寻找一些答案。

第一: 我正在使用 PaintCode 来生成Swift代码的开头。我制作了一个具有以下属性的绘图:

enter image description here

Code Swift

func drawSpeedView(strokeGap strokeGap: CGFloat = 30, strokeDash: CGFloat = 4, strokePhase: CGFloat = 0, strokeWidth: CGFloat = 31, strokeStartAngle: CGFloat = 225, strokeEndAngle: CGFloat = 315) {
    //// General Declarations
    let context = UIGraphicsGetCurrentContext()

    //// DashedLarge Drawing
    let dashedLargeRect = CGRect(x: 14.5, y: 17.5, width: 291, height: 291)
    let dashedLargePath = UIBezierPath()
    dashedLargePath.addArcWithCenter(CGPoint(x: dashedLargeRect.midX, y: dashedLargeRect.midY), radius: dashedLargeRect.width / 2, startAngle: -strokeStartAngle * CGFloat(M_PI)/180, endAngle: -strokeEndAngle * CGFloat(M_PI)/180, clockwise: true)

    UIColor.blackColor().setStroke()
    dashedLargePath.lineWidth = strokeWidth
    CGContextSaveGState(context)
    CGContextSetLineDash(context, strokePhase, [strokeDash, strokeGap], 2)
    dashedLargePath.stroke()
    CGContextRestoreGState(context)
}

我的问题: 此代码针对iPhone 5进行了优化。 对于虚线数字的比例,我需要为iPhone 6 / 6s和6 + / 6s + {/ 1>创建strokeDash值的计算

我需要什么: 我还没有安装圆周计算的知识库。

我需要一个计算来替换这行:

CGContextSetLineDash(context, strokePhase, [strokeDash, strokeGap], 2)

替换为十进制数字,无论圆圈周长如何,都能以12/6/15的方式绕圈旋转。

有没有人能解决我的问题?

我从哪里开始?

1 个答案:

答案 0 :(得分:1)

iPhone 5问题

正如您所看到的那样(来自您的代码段):

let dashedLargeRect = CGRect(x: 14.5, y: 17.5, width: 291, height: 291)

绘图空间定义为宽度 291 点和高度 291 点。

对这些数字进行硬编码是一个糟糕的想法,因为正如您已经注意到的那样,这意味着代码只能在某些设备上运行,而不能在其他设备上运行。

要解决此问题,您可以通过声明以下函数来动态获取这些分辨率:

func windowHeight() -> CGFloat {
      return UIScreen.mainScreen().applicationFrame.size.height
}

func windowWidth() -> CGFloat {
    return UIScreen.mainScreen().applicationFrame.size.width
}

然后您可以创建dashedLargeRect例如:

let dashedLargeRect = CGRect(x: 14.5, y: 17.5, width: windowWidth()-20, height: windowHeight()-20)

这样,您就可以使代码设备无关,这始终是一种很好的做法。 (请注意,我还没有触及CGRect"来源",又称xy参数,请考虑您的作业:))。

第二期

如果我理解正确,你想知道如何绘制虚线弧。

秘密就在线上

dashedLargePath.addArcWithCenter(CGPoint(x: dashedLargeRect.midX, y: dashedLargeRect.midY), radius: dashedLargeRect.width / 2, startAngle: -strokeStartAngle * CGFloat(M_PI)/180, endAngle: -strokeEndAngle * CGFloat(M_PI)/180, clockwise: true)

您可以看到addArcWithCenter文档here,让我为您简化:

let arcCenter = CGPoint(x: dashedLargeRect.midX, y: dashedLargeRect.midY)
let radius = dashedLargeRect.width / 2
let startAngle = -strokeStartAngle * CGFloat(M_PI)/180
let endAngle = -strokeEndAngle * CGFloat(M_PI)/180

dashedLargePath.addArcWithCenter(arcCenter, 
                                 radius: radius, 
                                 startAngle: startAngle, 
                                 endAngle: endAngle, 
                                 clockwise: true)

现在应该更清楚这个代码的作用,如果你想在这个代码上绘制另一条线(例如显示车速,风速,气压等),你所要做的就是调用半径更小/更大的类似函数,可能还有不同的线条样式(也就是更改CGContextSetLineDashdashedLargePath.lineWidthUIColor.blackColor().setStroke()行。