UICollectionViewCell 内的 UIScrollView 滚动区域

Question

我有以下 UICollectionView 控制器

我的问题是当我放大图像时，我能够“滚动过去”图像边界。它几乎与这个问题Keep zoomable image in center of UIScrollView 完全相同，但答案并没有为我解决。

据我了解，我认为这是因为 scrollView 的内容大小未设置为图像的大小。但是，我不确定在我的子类 UICollectionViewCell 中在哪里设置 self.scrollView.contentSize = self.imageView.image.size 之类的东西。

默认视图

缩放并超出图像边界

如果用户尝试滚动到图像之外，我的预期行为是图像会反弹回来。

到目前为止的相关代码

Imgur 细胞子类

- (void)awakeFromNib {
    self.scrollView.minimumZoomScale = 1;
    self.scrollView.maximumZoomScale = 3.0;
    self.scrollView.delegate = self;
}

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

视图控制器

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setStyle];
    ImgurCellDetail *cell = (ImgurCellDetail *)[self.collectionView cellForItemAtIndexPath:self.indexPath];
    cell.scrollView.minimumZoomScale = cell.scrollView.frame.size.width / cell.imageView.frame.size.width;
    cell.scrollView.maximumZoomScale = 3.0;
    cell.scrollView.contentSize = cell.imageView.image.size;
}

- (void)viewWillAppear:(BOOL)animated
{
    [super viewWillAppear:animated];
    [self loadSelectedImage];
}

- (void)loadSelectedImage
{
    [self.collectionView scrollToItemAtIndexPath:self.indexPath
                                atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally
                                        animated:NO];

}

- (ImgurCellDetail *)collectionView:(UICollectionView *)collectionView
                  cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *cellIdentifier = @"Cell";
    ImgurCellDetail *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];
    [self resetImage:cell];
    cell.imageView.image = [UIImage imageWithContentsOfFile:self.imageArray[indexPath.row]];
    [self.collectionView addGestureRecognizer:cell.scrollView.pinchGestureRecognizer];
    [self.collectionView addGestureRecognizer:cell.scrollView.panGestureRecognizer];
    return cell;
}

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout
 sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
    // Need this for 3.5"
    return self.collectionView.frame.size;
}

- (void)collectionView:(UICollectionView *)collectionView
  didEndDisplayingCell:(ImgurCellDetail *)cell
    forItemAtIndexPath:(NSIndexPath *)indexPath {

    [self.collectionView removeGestureRecognizer:cell.scrollView.pinchGestureRecognizer];
    [self.collectionView removeGestureRecognizer:cell.scrollView.panGestureRecognizer];
}

- (void)resetImage:(ImgurCellDetail *)cell {
    //reset zoomScale back to 1 so that contentSize can be modified correctly
    cell.scrollView.zoomScale = 1;
}

我应该提一下，当图像视图设置为 aspect fill 时我没有问题，但正如您所见，它当前设置为 aspect fit我的麻烦开始了。

Answer 1

我认为您必须首先设置滚动视图的contentSize 以匹配图像的缩小尺寸（第一个屏幕截图中显示的尺寸），而不是图片的实际尺寸。

// Not this
//cell.scrollView.contentSize = cell.imageView.image.size;

// But this
CGSize originalSize = cell.imageView.image.size;
CGSize sizeToFit = cell.scrollView.bounds.size;
CGFloat scaleDownFactor = MIN(sizeToFit.width / originalSize.width,
                              sizeToFit.height / originalSize.height);
CGSize scaledDownSize = CGSizeMake(nearbyintf(originalSize.width * scaleDownFactor),
                                   nearbyintf(originalSize.height * scaleDownFactor));
cell.scrollView.contentSize = scaledDownSize;

// Also use scaledDownSize for the viewForZooming

从那里您继续调整内容插图，如您链接的答案中所做的那样。

最后滚动视图的实际大小可能在viewDidLoad中还没有完全调整！

Answer 2

我设法解决了我自己的错误。我将此处找到的方法：http://www.raywenderlich.com/10518/how-to-use-uiscrollview-to-scroll-and-zoom-content 调整到我的解决方案中。

我必须做出的改变是：

• 以编程方式生成图像，而不是使用情节提要
• 在我的 UICollectionView 子类的 awakeInNib 方法中添加滚动视图最小/最大缩放初始化代码
• 在我的cellForRowIndexPath中生成图片

我想就是这样。