xcode 如何在 uiimageview/uiscrollview 中居中图像（缩放前后）

How to center image in a uiimageview/uiscrollview (pre and post zooming)

提问by Alede

I am trying to center an image (with respect to the iphone screen) such that when the view is loaded the image is center width/height... In my case my view is loaded at pixel points 0,0 of the image itself and if I zoom out the image appears in the top left corner as opposed to mid-center of the screen/view. Here is what I have so far:

我正在尝试将图像居中（相对于 iphone 屏幕），以便在加载视图时图像是中心宽度/高度......在我的情况下，我的视图加载在图像本身的像素点 0,0 和如果我缩小图像出现在左上角而不是屏幕/视图的中间。这是我到目前为止所拥有的：

UIImage *image = [UIImage imageNamed: @"t.bmp"];
self.view.backgroundColor = [UIColor blackColor];
self.mi.frame = CGRectMake(0, 0, image.size.width, image.size.height);
self.mi.contentMode = (UIViewContentModeCenter);
self.mi.backgroundColor = [UIColor blackColor];
[self.mi setImage:image];

/* Draw a line here!!
UIGraphicsBeginImageContext(self.mi.frame.size);
[self.mi.image drawInRect:CGRectMake(0, 0, image.size.width, image.size.height)];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
CGContextSetLineWidth(context, 20.0);
CGContextBeginPath(context);
CGContextMoveToPoint(context, 0,0);
CGContextAddLineToPoint(context, 200, 200);    
CGContextMoveToPoint(context, 200,0);
CGContextAddLineToPoint(context, 0, 200);
CGContextStrokePath(context);
self.mi.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
*/

self.expimg.maximumZoomScale = 2.0;
self.expimg.minimumZoomScale = 0.1;
self.expimg.clipsToBounds = YES;
self.expimg.delegate = self;
[self.expimg setContentSize:self.mi.frame.size];

[self.expimg addSubview: self.mi];
[self.view addSubview: self.expimg];

Thanks!

谢谢！

Edit: mi is a UIImageView and expimg is a UIScrollView (used interface builder). Also, viewForZoomingInScrollView is defined.

编辑：mi 是 UIImageView，expimg 是 UIScrollView（使用的界面构建器）。此外，还定义了 viewForZoomingInScrollView。

回答by Katfish

You should be able to do this by adjusting the position and size of the image and scroll view on initial load, and as zoom levels change. Make a method that is called on viewDidLoad, and again on the UIScrollViewDelegatemethod scrollViewDidZoom:.

您应该能够通过调整图像的位置和大小并在初始加载时滚动视图以及缩放级别更改来做到这一点。创建一个被调用的方法viewDidLoad，并再次在该UIScrollViewDelegate方法上调用scrollViewDidZoom:。

Something like this should work (where imageView and scrollView are class attributes):

这样的事情应该可以工作（其中 imageView 和 scrollView 是类属性）：

- (void)centerImage {

    CGSize screenSize = CGSizeMake(320, 480);

    CGSize imageSize = imageView.frame.size;
    imageSize.width = imageSize.width * scrollView.zoomScale;
    imageSize.height = imageSize.height * scrollView.zoomScale;
    CGSize scrollSize = scrollView.frame.size;

    CGFloat centerX;
    CGFloat centerY;
    CGFloat left;
    CGFloat top;

    if (imageSize.width > screenSize.width) {
        scrollSize.width = imageSize.width;
        centerX = imageSize.width/2;
        left = 0;
    } else {
        scrollSize.width = screenSize.width;
        centerX = screenSize.width/2;
        left = centerX - imageSize.width/2;
    }

    if (imageSize.height > screenSize.height) {
        scrollSize.height = imageSize.height;
        centerY = imageSize.height/2;
        top = 0;
    } else {
        scrollSize.height = screenSize.height;
        centerY = screenSize.width/2;
        top = centerY - imageSize.height/2;
    }

    CGRect scrollFrame = scrollView.frame;
    scrollFrame.size = scrollSize;
    scrollView.frame = scrollFrame;

    CGRect imageFrame = imageView.frame;
    imageFrame.origin = CGPointMake(left, top);

    scrollView.contentOffset = CGPointMake(centerX-(imageSize.width/2), centerY-(imageSize.height/2));

}

I have not tested this, so some of my math could be wrong. Either way, it will hopefully give you a good idea of what to do.

我没有测试过这个，所以我的一些数学可能是错误的。无论哪种方式，它都有望让您对该怎么做有一个很好的了解。

回答by Heo ??t Hades

Step 1: You create an image view property then init it at viewDidLoadand add to scrollView:

第 1 步：创建一个图像视图属性，然后在viewDidLoad 中初始化它并添加到 scrollView：

self.pictureImage = [[UIImageView alloc]initWithImage:self.picture];
[_scrollView addSubview:_pictureImage];
self.pictureImage.alpha = 0;
_scrollView.delegate = self;

Step 2: Create adjustZoomScalefunction to get minimum scale

第 2 步：创建adjustZoomScale函数以获得最小比例

- (CGFloat)adjustZoomScale{
CGFloat scale = self.scrollView.bounds.size.width / self.pictureImage.bounds.size.width;
CGFloat h = scale * self.pictureImage.bounds.size.height;
if (h > self.scrollView.bounds.size.height) {
    scale = self.scrollView.bounds.size.height / self.pictureImage.bounds.size.height;
}
return scale;
}

Step 3: Because frame of scroll view will be updated at viewDidAppearso we need to adjust zoom scale here. And set alpha to make image appear smoother:

第3步：因为滚动视图的框架会在viewDidAppear处更新，所以我们需要在这里调整缩放比例。并设置 alpha 使图像看起来更平滑：

- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear: animated];
_scrollView.maximumZoomScale = 1.0;
_scrollView.minimumZoomScale = [self adjustZoomScale];
[_scrollView setZoomScale:_scrollView.minimumZoomScale];
self.pictureImage.alpha = 1;
}

Step 4: Implement viewForZoomingInScrollView(scroll delegate method) and return image view

第四步：实现viewForZoomingInScrollView（滚动委托方法）并返回图片视图

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
return self.pictureImage;
}

Step 5: Implement scrollViewDidZoom(scroll delegate method) and adjust point for image view

第五步：实现scrollViewDidZoom（滚动委托方法）并调整图像视图的点

- (void)scrollViewDidZoom: (UIScrollView*) scrollView {
CGSize boundsSize = scrollView.bounds.size;
CGRect contentsFrame = _pictureImage.frame;

if (contentsFrame.size.width < boundsSize.width) {
    contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0;
} else {
    contentsFrame.origin.x = 0.0;
}

if (contentsFrame.size.height < boundsSize.height) {
    contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2.0;
} else {
    contentsFrame.origin.y = 0.0;
}
_pictureImage.frame = contentsFrame;
}

Thank shawhuat this postfor point adjusting for image view while zooming

感谢shawhu在这篇文章中在缩放时对图像视图进行点调整

回答by KETAN

[scrollView zoomToRect:CGRectMake(x, y, width, height) animated:YES]; will work for you... Where rect should have those center coordinates as origin.

[scrollView zoomToRect:CGRectMake(x, y, width, height) 动画：是]; 会为你工作...... rect 应该有那些中心坐标作为原点。