カスタムクラスを使用して円形インジケータを作成するには幅と高さが大きすぎます

Question

CAShapeLayerを使用して円形インジケータを作成したいと思います。私はカスタムクラスでこれをやっているので、UIViewごとに再利用することができます。

これは私が今のところ持っているものです。

class CircularIndicator: UIView { 

    var circularIndicator = CAShapeLayer() 

    override init(frame: CGRect) { 
     super.init(frame: frame) 

     configure() 
    } 

    required init?(coder aDecoder: NSCoder) { 
     super.init(coder: aDecoder) 

     configure() 
    } 

    func configure() { 
     let centerPoint = CGPoint(x: self.bounds.width/2, y: self.bounds.width/2) 
     let circleRadius = self.bounds.size.width/2 
     let circlePath = UIBezierPath(arcCenter: centerPoint, radius: circleRadius, startAngle: CGFloat(-0.5 * M_PI), endAngle: CGFloat(1.5 * M_PI), clockwise: true) 

     circularIndicator.path = circlePath.cgPath 
     circularIndicator.strokeColor = UIColor.blue.cgColor 
     circularIndicator.fillColor = UIColor.clear.cgColor 
     circularIndicator.lineWidth = 6 
     circularIndicator.strokeStart = 0 
     circularIndicator.strokeEnd = 1 

     self.layer.addSublayer(circularIndicator) 
    } 
} 

私は高さと幅のメインビューコントローラにUIViewを追加= 150私の問題は、私は、アプリケーションを実行すると、circleRadius値が終わるということです円が大きくなる500である。

私は、self.bounds.witdhまたはself.bounds.heightは、このクラスを含むUIViewの値と等しいはずです。 これは間違っていますか？どのように私は幅と高さのために大きな値で終わるだろうか？

Answer 1

問題は、frameが変更される可能性があります。私はそれに応じてcircleRadiusを調整する場合は、上記のように、ところで

class CircularIndicator: UIView { 

    var circularIndicator = CAShapeLayer() 
    var lineWidth: CGFloat = 6 

    override init(frame: CGRect) { 
     super.init(frame: frame) 

     configure() 
    } 

    required init?(coder aDecoder: NSCoder) { 
     super.init(coder: aDecoder) 

     configure() 
    } 

    private func configure() { 
     circularIndicator.strokeColor = UIColor.blue.cgColor 
     circularIndicator.fillColor = UIColor.clear.cgColor 
     circularIndicator.lineWidth = lineWidth 
     circularIndicator.strokeStart = 0 
     circularIndicator.strokeEnd = 1 

     layer.addSublayer(circularIndicator) 
    } 

    override func layoutSubviews() { 
     super.layoutSubviews() 

     let centerPoint = CGPoint(x: bounds.width/2, y: bounds.width/2) 
     let circleRadius = (bounds.size.width - lineWidth)/2 

     circularIndicator.path = UIBezierPath(arcCenter: centerPoint, radius: circleRadius, startAngle: CGFloat(-0.5 * M_PI), endAngle: CGFloat(1.5 * M_PI), clockwise: true).cgPath 
    } 
} 

、あなたがlineWidthの半分に円をはめ込みすることもできます。だから、pathlayoutSubviewsに設定する必要があります。そうでない場合は、サークルのエッジがビューのframeを超えます。