Geek Answers Handbook

CALayer Rotation Around the Center

I want to do something like a circular progress bar, the bezier's rice path in a UIView, but it rotates to PI / 2. So I need to rotate it with PI / 2. The problem is that it revolves around some very strange point, and I don’t know how to deal with it. I tried to follow these instructions, but that does not help, because I want to rotate it in the center. Here is my code:

required init(coder aDecoder: NSCoder) {
    ringLayer = CAShapeLayer()
    ringLayerBackground = CAShapeLayer()
    super.init(coder: aDecoder)
    ringLayer.lineCap = kCALineCapButt
    ringLayer.fillColor = nil
    ringLayerBackground.lineCap = kCALineCapButt
    ringLayerBackground.fillColor = nil
    ringLayerBackground.strokeColor = UIColor(white: 0.5, alpha: 0.1).CGColor
    }


override func layoutSubviews() {
    layer.addSublayer(ringLayer)
    layer.addSublayer(ringLayerBackground)
    addSubview(imageView)
    let rectForRing = CGRectInset(bounds, lineWidth/2, lineWidth/2)        
    //ringLayer.setAffineTransform(CGAffineTransformMakeRotation(5))
    ringLayer.transform = CATransform3DRotate(ringLayer.transform, CGFloat(-M_PI/20), 0.0, 0.0, 1.0)
    //Tried both ways
    ringLayer.path = CGPathCreateWithEllipseInRect(rectForRing, nil)
    ringLayerBackground.path = CGPathCreateWithEllipseInRect(rectForRing, nil)
    super.layoutSubviews()
    }

This is what i get

I know that there are many similar questions, but they do not help. Thank!

UPDATE Found a magic number that works on iPhone 6: 140

let o = 140.0
ringLayer.transform = CATransform3DTranslate(ringLayer.transform, CGFloat(o), CGFloat(o), 0)
ringLayer.transform = CATransform3DRotate(ringLayer.transform, CGFloat(-M_PI/2), 0.0, 0.0, 1.0)
ringLayer.transform = CATransform3DTranslate(ringLayer.transform, CGFloat(-o), CGFloat(-o), 0)

Works well, but I can’t guess where this number comes from.

UPDATE . ringLayer.position, . , ringLayer.position. , , @chrisco .

+4
1

, :

    var progreessLayer = CAShapeLayer()
    // add layer to your view etc

    var path = UIBezierPath(arcCenter:center,
        radius:100, startAngle:CGFloat(-M_PI_2),
        endAngle:CGFloat(3 * M_PI_2), clockwise:true)
    progreessLayer.path = path.CGPath
    progreessLayer.lineWidth = 10
    progreessLayer.strokeColor = UIColor.blackColor().CGColor
    progreessLayer.fillColor = nil
+2

More articles:


All Articles