CALayer绕中心旋转

4

我想创建一个类似圆形进度条的东西,在UIView中绘制贝塞尔路径,但它会以PI/2的角度旋转。所以我需要将其旋转PI/2。问题是,它围绕着一些非常奇怪的点旋转,我不知道如何处理。

我尝试按照这些说明进行操作,但它没有帮助,因为我想围绕中心旋转。

这是我的代码:

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()
    }

这是我得到的东西

我知道有很多类似的问题,但它们并没有帮助。 谢谢!

更新 找到了一个适用于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)

功能正常,但我无法猜测那个数字是从哪里来的。

更新 问题已解决。是在ringLayer.position中的一个东西,需要将其设置为视图中心。之后,我为贝塞尔路径制作了一个矩形,使其中心与ringLayer.position相同。因此代码变得复杂,@chrisco的解决方案更加适用。


阅读CALayer关于anchorPoint的文档,它定义了位置和旋转的原点。 - Chris Conover
@chrisco 改变锚点完全没有任何影响,我不知道为什么。改变父图层的锚点会移动它。 - Alfred Zien
如果你只是想绘制一个圆形进度条,那么只需使用方法init(arcCenter center: CGPoint, radius radius: CGFloat, startAngle startAngle: CGFloat, endAngle endAngle: CGFloat, clockwise clockwise: Bool) -> UIBezierPath创建一个UIBezier路径。如果你希望进度从顶部开始,则使用起始角度为-M_PI_2,结束角度为3 * M_PI_2,clockwise=true,将路径分配给一个形状图层,给它指定描边颜色、宽度等,就可以了。 - Chris Conover
谢谢@AlfredZien。位置的问题解决了我的问题。 - Jeffrey Fulton
1个回答

4
为了回答你的问题,但不是你立刻要解决的问题:
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

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接