使用另一个视图的中心作为锚点旋转视图

Rotating a view using another view's center as the anchor point

我有两个图像视图。第一个是蓝色箭头,第二个是白色圆圈,画有一个黑点代表圆心。

我正在尝试旋转箭头,这样它的锚点就是图中的黑点,就像这样

现在我将箭头层的锚点设置为这样计算的点

CGFloat y = _userImageViewContainer.center.y - CGRectGetMinY(_directionArrowView.frame);
CGFloat x = _userImageViewContainer.center.x - CGRectGetMinX(_directionArrowView.frame);
CGFloat yOff = y / CGRectGetHeight(_directionArrowView.frame);
CGFloat xOff = x / CGRectGetWidth(_directionArrowView.frame);

_directionArrowView.center = _userImageViewContainer.center;

CGPoint anchor = CGPointMake(xOff, yOff);
NSLog(@"anchor: %@", NSStringFromCGPoint(anchor));

_directionArrowView.layer.anchorPoint = anchor;

由于锚点设置为视图的百分比,即中心坐标为 (.5, .5),我正在计算黑点落在箭头框架中的高度百分比.但是我的数学,即使在手工计算之后,结果仍然是 0.5,这是不正确的,因为当箭头处于原始位置(垂直,箭头向上)时,它已经下降了一半以上。

我正在根据用户的罗盘航向旋转

CLHeading *heading = [notif object];

// update direction of arrow
CGFloat degrees = [self p_calculateAngleBetween:[PULAccount currentUser].location.coordinate
                                            and:_user.location.coordinate];


_directionArrowView.transform = CGAffineTransformMakeRotation((degrees - heading.trueHeading) * M_PI / 180);

旋转是正确的,只是锚点不对。关于如何完成此操作的任何想法?

也许最好使用更简单的解决方案 - 使箭头图像尺寸更大,更正方形。所以黑点将在图像的中心。

请比较所附图片,您就会明白我在说什么

新图片中间有黑点

带偏移点的旧图像

现在您可以轻松使用标准锚点 (0.5, 0.5) 来旋转编辑后的图像

我总是发现锚点不稳定,尤其是在旋转时。我会尝试这样的事情。

    CGPoint convertedCenter = [_directionArrowView convertPoint:_userImageViewContainer.center fromView:_userImageViewContainer ];

     CGSize offset = CGSizeMake(_directionArrowView.center.x - convertedCenter.x, _directionArrowView.center.y - convertedCenter.y);
 // I may have that backwards, try the one below if it offsets the rotation in the wrong direction..
//  CGSize offset = CGSizeMake(convertedCenter.x -_directionArrowView.center.x , convertedCenter.y - _directionArrowView.center.y); 
     CGFloat rotation = 0; //get your angle (radians)

     CGAffineTransform tr = CGAffineTransformMakeTranslation(-offset.width, -offset.height);
          tr = CGAffineTransformConcat(tr, CGAffineTransformMakeRotation(rotation) );
          tr = CGAffineTransformConcat(tr, CGAffineTransformMakeTranslation(offset.width, offset.height) );


    [_directionArrowView setTransform:tr];

注意。 UIView 上的转换 属性 是可动画的,因此如果需要,您可以将最后一行放在动画块中..