UICollectionViewCell 翻转并在点击时增长

Posted 2023-03-14

【中文标题】UICollectionViewCell 翻转并在点击时增长

【英文标题】：UICollectionViewCell flip and grow on tap

【发布时间】：2012-12-07 14:25:43

【问题描述】：

如何实现 UICollectionViewCell 翻转并增长以在点击时显示模态视图的动画？

【参考方案1】：

这是我在另一个项目中使用的，效果很好：

- (BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath 
    UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
    if (cell.selected) 
        [collectionView deselectItemAtIndexPath:indexPath animated:YES];
        [UIView transitionWithView:cell
                          duration:0.2
                           options:UIViewAnimationOptionTransitionFlipFromLeft
                        animations:^
                            [cell setFrame:self.selectedCellDefaultFrame];
                            cell.transform = self.selectedCellDefaultTransform;
                        
                        completion:^(BOOL finished) 
                            self.selectedCellDefaultFrame = CGRectZero;
                            [collectionView reloadItemsAtIndexPaths:@[indexPath]];
                        ];
        return NO;
    
    else 
        return YES;
    

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath 
    UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
    [cell.superview bringSubviewToFront:cell];
    self.selectedCellDefaultFrame = cell.frame;
    self.selectedCellDefaultTransform = cell.transform;
    [UIView transitionWithView:cell
                      duration:0.2
                       options:UIViewAnimationOptionTransitionFlipFromRight
                    animations:^
                        [cell setFrame:collectionView.bounds];
                        cell.transform = CGAffineTransformMakeRotation(0.0);
                    
                    completion:^(BOOL finished) ];

这里有不同的东西：

bringSubviewToFront: 消息调用用于防止单元格在其他单元格后面进行动画处理 我们使用控制器中声明的两个属性：selectedCellDefaultFrame和selectedCellDefaultTransform来保存单元格的默认状态并在取消选择时重新初始化它 取消选择时，我们调用UICollectionView的reloadItemsAtIndexPaths:方法来确保位置的重置完全完成

如果您对此有任何问题，请告诉我。

祝你好运，

【讨论】：

太棒了，谢谢你的回答。翻转时如何选择要在单元格背面显示的视图？

看起来是个不错的解决方案。我很难声明用于保存帧和变换的属性。我无法传递 CGRect 结构。你是如何声明它们的？

【参考方案2】：

我没有尝试过成长动画，但我想我可以帮助 UICollectionViewCell 翻转动画。

试试：

UICollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];

[UIView animateWithDuration:1.0
                      delay:0
                    options:(UIViewAnimationOptionAllowUserInteraction)
                 animations:^
                
                     NSLog(@"starting animation");

                    [UIView transitionFromView:cell.contentView
                                        toView:newView
                                      duration:.5
                                       options:UIViewAnimationOptionTransitionFlipFromRight
                                    completion:nil];
                
                 completion:^(BOOL finished)
                
                     NSLog(@"animation end");
                
 ];

希望有帮助！

【讨论】：

谢谢。这将是一个很好的起点。当我对完整的“翻转和成长”进行排序时，我会回复！