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

【问题标题】：Rotating a view using another view's center as the anchor point使用另一个视图的中心作为锚点旋转视图
【发布时间】：2015-03-16 10:37:09
【问题描述】：

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

我正在尝试旋转箭头，使其锚点是图片中的黑点，如下所示

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

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);

旋转是正确的，只是锚点工作不正常。关于如何实现这一点的任何想法？

【问题讨论】：

_directionArrowView.center = _userImageViewContainer.center; 这两者怎么可能一样呢？ directionArrowView.center 将是_userImageViewContainer.center 上方的一个点，对吗？
你是对的。我认为这条线可能会适得其反。也许如果我的自动布局约束可以正确排列它们，它应该可以工作

标签： ios objective-c cgaffinetransform

【解决方案1】：

我总是发现锚点的东西是片状的，尤其是在旋转时。我会尝试这样的。

    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 上的 transform 属性是可动画的，因此如果需要，您可以将最后一行放在动画块中..

【讨论】：

这似乎是一个很好的解决方案，但由于自动布局而崩溃：Unable to simultaneously satisfy constraints。我会玩一下，看看我是否可以修复约束来处理这个
关闭 em 并为这两个视图使用 UIViewAutoResizingMask。有时自动布局在 iO 上太聪明了（它在 cocoa 中很棒，确实需要它......）
我刚刚开始工作。对于偏移量，我没有使用convertedCenter，而是比较了父视图框架中两个视图的中心：CGSize offset = CGSizeMake(_userImageViewContainer.center.x - _directionArrowView.center.x, _userImageViewContainer.center.y - _directionArrowView.center.y); 感谢您的帮助

【解决方案2】：

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

请比较附件图片，你就明白我在说什么了

中心有黑点的新图像

带有偏移点的旧图像

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

【讨论】：