UICollectionViewCell 内的 UIScrollView 滚动区域

Posted 2023-03-14

【中文标题】UICollectionViewCell 内的 UIScrollView 滚动区域

【英文标题】：UIScrollView scrolling area inside a UICollectionViewCell

【发布时间】：2014-04-15 06:18:35

【问题描述】：

我有以下 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我的麻烦开始了。

【问题讨论】：

把你的完整代码发给我@[e-mail] ...或上传到某个位置....我会帮助你

我实际上设法自己解决了这个问题。谢谢！ ;)

如果你自己解决了这个问题，那你为什么要增加赏金呢？ o0

我在奖励赏金后修复了它；(

【参考方案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中还没有完全调整！

【参考方案2】：

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

我必须做出的改变是：

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

我想就是这样。

【讨论】：

你好 Super9，你能分享一下这个解决方案的代码吗，我也有同样的问题。谢谢