Zeichnungskreise proportional zu enthalten Ansicht in Swift

Question

Ich versuche, 3 Kreise innerhalb meiner 3 Ansichten zu zeichnen, aber nur die Draufsicht Kreis ist gezeichnet auch doth der Code ist der gleiche. Ich kann nicht verstehen, wo das Problem liegt, deshalb sind die beiden anderen Kreise nicht da?

class ViewController: UIViewController { 

    ///Views used to display the progress view 
    var topView: CircleView! 
    var middleView: CircleView! 
    var bottomView: CircleView! 

    override func viewDidLoad() { 
    super.viewDidLoad() 
    createThreeViews() 
    } 

    func createThreeViews(){   
    let viewHeight = self.view.bounds.height 
    let viewWidth = self.view.bounds.width 

    //Top View 
    let topTimerFrame = CGRect(x: 0, y: 0, width: viewWidth, height: 3/6 * viewHeight) 
    topView = CircleView(frame: topTimerFrame) 
    topView.backgroundColor = UIColor.redColor() 

    //Middle View 
    let middleTimerFrame = CGRect(x: 0, y: topTimerFrame.height, width: viewWidth, height: 2/6 * viewHeight) 

    middleView = CircleView(frame: middleTimerFrame) 
    middleView.backgroundColor = UIColor.blueColor() 


    //Bottom view 
    let bottomTimerFrame = CGRect(x: 0, y: topTimerFrame.height + middleTimerFrame.height, width: viewWidth, height: 1/6 * viewHeight) 

    bottomView = CircleView(frame: bottomTimerFrame) 
    bottomView.backgroundColor = UIColor.greenColor() 

    //add top circle and set constraint 
    self.view.addSubview(topView) 

    //add middle circle and set constraints 
    self.view.addSubview(middleView) 

    //add bottom circle and set constraints 
    self.view.addSubview(bottomView) 
    } 

} 

//class used to create the views and draw circles in them 
class CircleView: UIView { 
    let π:CGFloat = CGFloat(M_PI)  
    let circle = CAShapeLayer()  
    var secondLayerColor: UIColor = UIColor.whiteColor() 


    //custom initializer 
    override init(frame: CGRect) { 
    super.init(frame: frame) 
    userInteractionEnabled = true 
    setup() 
    } 

    required init?(coder aDecoder: NSCoder) { 
    super.init(coder: aDecoder) 
    userInteractionEnabled = true 
    setup() 
    } 

    func setup() { 

    //draw the circle and add to layer 
    circle.frame = bounds 
    circle.lineWidth = CGFloat(4) 
    circle.fillColor = UIColor.whiteColor().CGColor 
    circle.strokeEnd = 1 

    layer.addSublayer(circle) 
    setupShapeLayer(circle) 
    } 

    override func layoutSubviews() {   
    super.layoutSubviews() 
    setupShapeLayer(circle)  
    } 

    func setupShapeLayer(shapeLayer: CAShapeLayer) {   
    shapeLayer.frame = bounds   
    let radius = frame.height/2 - circle.lineWidth/2   
    let startAngle = CGFloat(0)   
    let endAngle = 2*π   
    let path = UIBezierPath(arcCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: false)   
    shapeLayer.path = path.CGPath   
    } 

} 

Answer 1

Sie Ihren Kreis mit einem an den Rahmen-Offset-Zeichnung (die beiden anderen Kreise gezeichnet werden, aber außerhalb der Rahmen).

Wechsel:

let path = UIBezierPath(arcCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: false) 

zu:

let path = UIBezierPath(arcCenter: CGPoint(x: center.x , y: frame.height/2) , radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: false) 

Btw. Sie möchten wahrscheinlich setupShapeLayer(circle) in setup() zu setNeedsLayout(); layoutIfNeeded() ändern, andernfalls wird es zweimal beim ersten Mal gezeichnet.