UIScrollView与居中的UIImageView，如照片应用程序 [英] UIScrollView with centered UIImageView, like Photos app

问题描述

我想有一个图像内容视图的滚动视图。图像实际上是比屏幕大得多的地图。地图应该最初位于滚动视图的中心，如照片应用中的照片，当您将iPhone转为横向时。

I would like to have scroll view with an image content view. The image is actually map which is much bigger than the screen. The map should be initially in the center of the scroll view, like photos in Photos app when you turn iPhone to landscape orientation.

我没有在地图中设置中心具有正确的缩放和滚动的同时。
如果地图图像从屏幕顶部开始（纵向），代码如下：

I did not manage to have the map in the center with correct zooming and scrolling at the same time. Provided that the map image starts from the top of the screen (in portrait orientation), the code looks something like:

- (void)loadView {
    mapView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"map.jpg"]];
    CGFloat mapHeight = MAP_HEIGHT * SCREEN_WIDTH / MAP_WIDTH;
    mapView.frame = CGRectMake(0, 0, SCREEN_WIDTH, mapHeight);
    scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
    scrollView.delegate = self;
    scrollView.contentSize = mapView.frame.size;
    scrollView.maximumZoomScale = MAP_WIDTH / SCREEN_WIDTH;
    scrollView.minimumZoomScale = 1;
    [scrollView addSubview:mapView];
    self.view = scrollView;
}

当我将图像框移动到中心时，图像只会从它的框架的顶部下来。我试图用mapView变换，用动态变化的imageView的帧。

When I move the image frame to the center, the image grows only from the top of its frame down. I tried to play around with mapView transform, with dynamically changing frame of the imageView. Nothing works for me so far.

推荐答案

此代码应该在大多数版本的iOS上运行向上）。

This code should work on most versions of iOS (and has been tested to work on 3.1 upwards).

这是基于Jonah的回答中提到的Apple WWDC代码。

It's based on the Apple WWDC code mentioned in Jonah's answer.

UIScrollView的子类，并用包含您的图像或图块的视图替换tileContainerView：

Add the below to your subclass of UIScrollView, and replace tileContainerView with the view containing your image or tiles:

- (void)layoutSubviews {
    [super layoutSubviews];

    // center the image as it becomes smaller than the size of the screen
    CGSize boundsSize = self.bounds.size;
    CGRect frameToCenter = tileContainerView.frame;

    // center horizontally
    if (frameToCenter.size.width < boundsSize.width)
        frameToCenter.origin.x = (boundsSize.width - frameToCenter.size.width) / 2;
    else
        frameToCenter.origin.x = 0;

    // center vertically
    if (frameToCenter.size.height < boundsSize.height)
        frameToCenter.origin.y = (boundsSize.height - frameToCenter.size.height) / 2;
    else
        frameToCenter.origin.y = 0;

    tileContainerView.frame = frameToCenter;
}

这篇关于UIScrollView与居中的UIImageView，如照片应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！