2017-03-22 14 views
1

私はユニバーサルチューナーアプリケーションを作成しようとしていますが、アナログメーターを描画しようとすると、別のデバイスに混乱します。多分それは非常にハードコードされたのです。これをチェックしてください:SwiftのUIbezierPathでユニバーサルラウンドドロー(lineDashPatternを使用)を作成する方法

enter image description here

ラベルがあまりにも同じUIViewの下にあります。これらのパスを描画するコードを確認してください:

override func draw(_ rect: CGRect) { 

    let center = CGPoint(x:bounds.width/2, y: bounds.height) 

    var radius: CGFloat = max(bounds.width, bounds.height+50) 

    // Define the thickness of the arc. 
    let arcWidth: CGFloat = 1 

    let startAngle: CGFloat = π 
    let endAngle: CGFloat = 2 * π 

    var path = UIBezierPath(arcCenter: center, 
          radius: radius/2 - arcWidth/2, 
          startAngle: startAngle, 
          endAngle: endAngle, 
          clockwise: true) 

    path.lineWidth = arcWidth 
    counterColor.setStroke() 
    path.stroke() 

    radius = max(bounds.width, bounds.height+70) 

    path = UIBezierPath(arcCenter: center, 
          radius: radius/2 - arcWidth/2, 
          startAngle: startAngle, 
          endAngle: endAngle, 
          clockwise: true) 

    let strokeColor   = UIColor.black.cgColor 


    roundThinLayer.path    = path.cgPath 
    roundThinLayer.strokeColor  = strokeColor 
    roundThinLayer.lineWidth  = 16.0 
    roundThinLayer.fillColor  = UIColor.clear.cgColor 
    roundThinLayer.lineDashPattern = [ 0.5, 4.55 ] 
    //roundThinLayer.lineDashPhase = 0.25 

    self.layer.addSublayer(roundThinLayer) 

    radius = max(bounds.width, bounds.height+90) 

    path = UIBezierPath(arcCenter: center, 
         radius: radius/2 - arcWidth/2, 
         startAngle: startAngle, 
         endAngle: endAngle, 
         clockwise: true) 

    roundThickLayer.path   = path.cgPath 
    roundThickLayer.strokeColor  = strokeColor 
    roundThickLayer.lineWidth  = 40 
    roundThickLayer.fillColor  = UIColor.clear.cgColor 
    roundThickLayer.lineDashPattern = [ 1.5, 140 ] 
    roundThickLayer.lineDashPhase = 0.25 
    self.layer.addSublayer(roundThickLayer) 
} 

は、誰かが私をハードコーディングせずに、これらの値を得るのを助けることはできますか?つまり、私はストーリーボード(iPhone 7で動作している)のように細かく太くしたいと思っています。私はこのアプリを普遍的なものにしたい。

注:自動サイズ調整は正しいですか?

ありがとうございます。

+1

Crikey @Denis、これは古い学校の等号記号です。 –

+0

問題は何ですか?そこに表示されるスクリーンショットは上手く見えます。 –

+0

@AshleyMillsエミュレータをよく見ると(UIViewの幅/高さが変更されたため)、ストーリーボードと比較して違いがあります。なぜ私は自動化するビューを設定すると知りたい。 –

答えて

1

@Denis - ええ、あなたのハードコードされた値は、特にlineDashPatternの場合、あなたを傷つけていると思います。

これを試してください。これはlineDashPatternの "ギャップ"を計算するために、線の長さ(アーク)とティック数を使用します(境界と何がないかについていくつかの調整が必要になるでしょう))。

public override func draw(_ rect: CGRect) { 

    let center = CGPoint(x:bounds.width/2, y: bounds.height) 

    var radius: CGFloat = max(bounds.width, bounds.height+50) 

    // Define the thickness of the arc. 
    let arcWidth: CGFloat = 1 

    let startAngle: CGFloat = CGFloat(M_PI) // π 
    let endAngle: CGFloat = CGFloat(2 * M_PI) // π 

    let counterColor = UIColor.red 

    var path = UIBezierPath(arcCenter: center, 
          radius: radius/2 - arcWidth/2, 
          startAngle: startAngle, 
          endAngle: endAngle, 
          clockwise: true) 

    path.lineWidth = arcWidth 
    counterColor.setStroke() 
    path.stroke() 


    // init vars for later use 
    var nTicks = 0 
    var tickWidth = 0.0 
    var gapWidth = 0.0 


    radius += 20 

    path = UIBezierPath(arcCenter: center, 
         radius: radius/2 - arcWidth/2, 
         startAngle: startAngle, 
         endAngle: endAngle, 
         clockwise: true) 

    let strokeColor   = UIColor.black.cgColor 

    let roundThinLayer = CAShapeLayer() 

    // number of short ticks to draw 
    nTicks = 150 

    // thickness of short ticks 
    tickWidth = 0.5 

    // calculate the gap between ticks 
    gapWidth = ((M_PI * Double(radius)/2) - (tickWidth * Double(nTicks)))/Double(nTicks - 1) 

    roundThinLayer.path    = path.cgPath 
    roundThinLayer.strokeColor  = strokeColor 
    roundThinLayer.lineWidth  = 20.0 
    roundThinLayer.fillColor  = UIColor.clear.cgColor 
    roundThinLayer.lineDashPattern = [ tickWidth as NSNumber, gapWidth as NSNumber ] 
    roundThinLayer.lineDashPhase = CGFloat(tickWidth/Double(2)) 


    self.layer.addSublayer(roundThinLayer) 


    radius += 20 

    path = UIBezierPath(arcCenter: center, 
         radius: radius/2 - arcWidth/2, 
         startAngle: startAngle, 
         endAngle: endAngle, 
         clockwise: true) 

    let roundThickLayer = CAShapeLayer() 


    // number of tall ticks to draw 
    nTicks = 7 

    // thickness of tall ticks 
    tickWidth = 1.5 

    // calculate the gap between ticks 
    gapWidth = ((M_PI * Double(radius)/2) - (tickWidth * Double(nTicks)))/Double(nTicks - 1) 

    roundThickLayer.path   = path.cgPath 
    roundThickLayer.strokeColor  = strokeColor 
    roundThickLayer.lineWidth  = 40 
    roundThickLayer.fillColor  = UIColor.clear.cgColor 
    roundThickLayer.lineDashPattern = [ tickWidth as NSNumber, gapWidth as NSNumber ] 
    roundThickLayer.lineDashPhase = CGFloat(tickWidth/Double(2)) 
    self.layer.addSublayer(roundThickLayer) 

    self.clipsToBounds = true 


} 
+0

ありがとうMag。薄い破線の場合はnTicks = 151を使用し、完全にフィットしました。 –

関連する問題