如何在 UIImageView 中平移图像? [英] How do I pan the image inside a UIImageView?

问题描述

我有一个 UIImageView 显示的图像比 UIImageView 更宽更高.我想使用动画在视图中平移图像(以便平移很好且平滑).

I have a UIImageView that is displaying an image that is wider and taller than the UIImageView is. I would like to pan the image within the view using an animation (so that the pan is nice and smooth).

在我看来，我应该能够调整 UIImageView 的 bounds.origin，并且图像应该移动(因为图像应该在将其视为 其 的起源，对吗?)但这似乎不起作用.bounds.origin 改变了，但图像在相同的位置绘制.

It seems to me that I should be able to just adjust the bounds.origin of the UIImageView, and the image should move (because the image should paint inside the view with that as its origin, right?) but that doesn't seem to work. The bounds.origin changes, but the image draws in the same location.

几乎有效的是更改视图层的contentsRect.但这从一个单位正方形开始，即使图像的可视区域不是整个图像.因此，我不确定如何检测到图像的远边缘被拉入可视区域(我需要避免这种情况，因为它通过将边缘拉伸到无穷大来显示，这看起来很好，低于标准).

What almost works is to change the contentsRect of the view's layer. But this begins as a unit square, even though the viewable area of the image is not the whole image. So I'm not sure how I would detect that the far edge of the image is being pulled into the viewable area (which I need to avoid, since it displays by stretching the edge out to infinity, which looks, well, sub-par).

我的视图当前通过 Interface Builder 将其 contentsGravity 设置为 kCAGravityTopLeft，如果这有所不同(是否会导致图像移动?).不过，似乎没有其他选择更好.

My view currently has its contentsGravity set to kCAGravityTopLeft via Interface Builder, if that makes a difference (Is it causing the image to move?). No other options seemed to be any better, though.

更新:明确地说，我想在视图中移动图像内部，同时将视图保持在同一位置.

UPDATE: to be clear, I want to move the image inside the view, while keeping the view in the same spot.

推荐答案

Brad Larson 为我指明了正确的道路，他建议将 UIImageView 放在 UIScrollView 中.

Brad Larson pointed me down the right road with his suggestion to put the UIImageView inside a UIScrollView.

最后我把 UIImageView 放在一个 UIScrollView 里面，并设置了 scrollView 的 contentSize 和imageView 的边界与 UIImage 中的图像大小相同:

In the end I put the UIImageView inside of a UIScrollView, and set the scrollView's contentSize and the imageView's bounds to be the same size as the image in the UIImage:

UIImage* image = imageView.image;
imageView.bounds = CGRectMake(0, 0, image.size.width, image.size.height);
scrollView.contentSize = image.size;

然后，我可以对 scrollView 的 contentOffset 进行动画处理，以达到很好的平移效果:

Then, I can animate the scrollView's contentOffset to achieve a nice panning effect:

[UIView beginAnimations:@"pan" context:nil];
[UIView setAnimationDuration:animationDuration];
scrollView.contentOffset = newRect.origin;
[UIView commitAnimations];

在我的特殊情况下，我平移到图像中的随机空间.为了找到合适的矩形平移 to 和合适的持续时间以获得良好的恒定速度，我使用以下内容:

In my particular case, I'm panning to a random space in the image. In order to find a proper rect to pan to and a proper duration to get a nice constant speed, I use the following:

UIImage* image = imageView.image;

float xNewOrigin = [TCBRandom randomIntLessThan:image.size.width - scrollView.bounds.size.width];
float yNewOrigin = [TCBRandom randomIntLessThan:image.size.height - scrollView.bounds.size.height];

CGRect oldRect = scrollView.bounds;
CGRect newRect = CGRectMake(
    xNewOrigin,
    yNewOrigin, 
    scrollView.bounds.size.width,
    scrollView.bounds.size.height);

float xDistance = fabs(xNewOrigin - oldRect.origin.x);
float yDistance = fabs(yNewOrigin - oldRect.origin.y);
float hDistance = sqrtf(powf(xDistance, 2) + powf(yDistance, 2));
float hDistanceInPixels = hDistance;

float animationDuration = hDistanceInPixels / speedInPixelsPerSecond;

我使用的是 10.0f 的 speedInPixelsPerSecond，但其他应用程序可能想要使用不同的值.

I'm using a speedInPixelsPerSecond of 10.0f, but other applications might want to use a different value.

这篇关于如何在 UIImageView 中平移图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！