UICollectionView 中的图片在向下滚动时自动翻转？

Question

我正在使用UICollectionView来展示手机相册中的所有图片。

当我点击任意一张图片时，该图片会翻转并显示有关该图片的一些信息。

当用户再次点击同一张图片时，图像再次翻转并显示原始图像。

问题在于，每当我通过UICollectionView向下滚动时，最后选择的图片会自动翻转，并显示有关该图片的信息。

如何解决这个问题。

以下是一些代码：

- (void) collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
    {
        UICollectionViewCell *cell1 = [collectionView cellForItemAtIndexPath:indexPath];
        if(old_path!=NULL){
        UICollectionViewCell *cell2 = [collectionView cellForItemAtIndexPath:old_path];
        [UIView transitionFromView:cell2.selectedBackgroundView toView:cell2.contentView duration:0.5 options:UIViewAnimationOptionCurveLinear |UIViewAnimationOptionTransitionFlipFromLeft completion:nil];

    }
if(old_path==indexPath&&flag)
{
  [cell1 setSelected:NO];
  [UIView transitionFromView:cell1.selectedBackgroundView toView:cell1.contentView duration:0.5 options:UIViewAnimationOptionCurveLinear |UIViewAnimationOptionTransitionFlipFromLeft completion:nil];
    flag=FALSE;
}
else{
    [UIView transitionFromView:cell1.contentView toView:cell1.selectedBackgroundView duration:0.5 options:UIViewAnimationOptionCurveLinear |UIViewAnimationOptionTransitionFlipFromLeft completion:nil];
    flag=TRUE;
}
old_path=indexPath;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewCell *cell=[collectionView dequeueReusableCellWithReuseIdentifier:@"cellIdentifier" forIndexPath:indexPath];
    ALAsset *asset = assets[indexPath.row];
    NSLog(@"Description : %@",[asset description]);
    UIImage *img=[self imageWithImage:[UIImage imageWithCGImage:[asset thumbnail]] convertToSize:CGSizeMake(150, 150)];
    UIView *contents = [[UIView alloc]initWithFrame:cell.bounds];
    contents.backgroundColor = [UIColor colorWithPatternImage:img];

    [cell.contentView addSubview:contents];

    UIView *backgroundView = [[UIView alloc]initWithFrame:cell.bounds];
    backgroundView.backgroundColor = [UIColor yellowColor];
    UIButton *del=[UIButton buttonWithType:UIButtonTypeRoundedRect];
    del.frame= CGRectMake(backgroundView.frame.origin.x+20,     backgroundView.frame.origin.y+20, 100, 40);
    [del setTitle:@"Delete" forState:UIControlStateNormal];
    [del addTarget:self action:@selector(delete) forControlEvents:UIControlEventTouchUpInside];
    [backgroundView addSubview:del];
    UIButton *cancel=[UIButton buttonWithType:UIButtonTypeRoundedRect];
    cancel.frame= CGRectMake(backgroundView.frame.origin.x+20, backgroundView.frame.origin.y+80, 100, 45);
    [cancel setTitle:@"Cancel" forState:UIControlStateNormal];
    [cancel addTarget:self action:@selector(cancel) forControlEvents:UIControlEventTouchUpInside];
    [backgroundView addSubview:cancel];

    cell.selectedBackgroundView = backgroundView;
    [cell bringSubviewToFront:cell.selectedBackgroundView];
    return cell;
}

这里，old_path 包含最后选定图片的索引。

- Santosh

---

需要一些代码...我们不知道你具体在做什么。 - Albara

添加代码到 cellForItemAtIndexPath: 方法中，以便我们了解您是如何绘制单元格的。 - Salman Zaidi

Answer 1

主要问题可能出在UIView的转场方法上：

[UIView transitionFromView:cell1.selectedBackgroundView toView:cell1.contentView duration:0.5 options:UIViewAnimationOptionCurveLinear |UIViewAnimationOptionTransitionFlipFromLeft completion:nil];

UICollectionViewCell 的 contentView 和 selectedBackgroundView 不应该像这样混淆，因为单元格管理它们的布局。这段代码将完全移除内容视图并用背景视图替换它，当选中时，期望它在内容视图后面，并在未选中时从视图层次结构中删除。

实现您正在做的事情（响应轻拍显示/隐藏图像）的正确方法是在内容视图上执行图像视图本身和另一个子视图之间的过渡。

---

你的调整大小代码可能会翻转图像，但没有imageWithImage:convertToSize:的代码很难确定。最好的方法可能是摆脱这个方法，改用以下方式：

UIImageView *imageView = [[UIImageView alloc] initWithFrame:cell.bounds];
imageView.contentsMode = UIViewContentModeScaleAspectFill;
imageView.clipsToBounds = YES;
imageView.image = [UIImage imageWithCGImage:[asset thumbnail]];
[cell.contentsView addSubview:imageView];

---

还有几点需要注意：

集合视图单元格是会被重用的，这意味着你的实现collectionView:cellForItemAtIndexPath:可能会在一个已经被多次出列的单元格中添加一堆图像视图。更好的解决方案是子类化UICollectionViewCell并在其init方法中添加自定义视图。

代码old_path==indexPath实际上并没有测试两个索引路径是否相等，只是测试了这两个变量在内存中是否具有相同的地址。应该使用[oldPath isEqual:indexPath]代替。

- Austin

Answer 2

如果不进行子类化并明确处理，就无法在背景视图上进行自定义动画。因为集合视图会自动将selectedBackgroundView置于顶部，如果selectedBackgroundView与backgroundView不同。附上苹果文档供参考。

// The background view is a subview behind all other views.
// If selectedBackgroundView is different than backgroundView, it will be placed above the background view and animated in on selection. 

https://developer.apple.com/library/iOs/documentation/UIKit/Reference/UICollectionViewCell_class/Reference/Reference.html

- Anil Kumar