UICollectionViewCell 展开动画

Posted

技术标签:

【中文标题】UICollectionViewCell 展开动画【英文标题】:UICollectionViewCell expanding animation 【发布时间】:2014-12-04 15:21:41 【问题描述】:

我正在尝试获得一个扩展的过渡动画:我有一个 UICollectionView,当用户选择一个单元格时,我希望这个单元格扩展到整个屏幕。过渡是 Push segue 过渡

我尝试获取单元格位置然后制作动画,但我认为我的做法不正确。

我有一些课:

CollectionViewController:UICollectionViewController 的子类 FinalViewController : UIViewController 的子类 NavigationControllerDelegate : UINavigationControllerDelegate 已实现协议 动画师:UIViewControllerAnimatedTransitioning 协议已实现

第一个问题:有没有人得到过这种效果,有示例代码或知道实现此效果的正确方法吗?这真的很棒

否则:我应该如何在 Animator 类中获取相关单元格?我需要单元格的框架和子视图。实际上我有一个 selectedCell 属性,我在 CollectionViewController 的 prepareForSegue 函数中设置,但我不确定这是正确的方法

感谢您的帮助

【问题讨论】:

【参考方案1】:

也许这不是您想要实现的方式,但无论如何这可能是一个好的开始:

假设您在控制器中初始化了 UIImageView *capturedImView;。然后当你选择一个单元格时,你可以试试这个:

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
    // Remove the image view (you can do it in a better place)
    [capturedImView removeFromSuperview];

    UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];

    // Get the frame of the selected cell in your current view :)
    CGRect frame = [collectionView convertRect:cell.frame toView:self.view];

    // set the capturedImView
    capturedImView.frame = frame;
    UIImage *snapshotImg = [self captureScreenInRect:frame forView:cell];
    capturedImView.image = snapshotImg;
    [self.view addSubview:capturedImView];

    // Play the animation
    [UIView animateWithDuration:3 animations:^
        // Here we don't care about aspect ratio :s
        capturedImView.frame = self.view.frame;
    ];

其中captureScreenInRect:forView: 传入参数的视图快照:

- (UIImage *)captureScreenInRect:(CGRect)captureFrame forView:(UIView*)view
    CALayer *layer;
    layer = view.layer;
    UIGraphicsBeginImageContext(captureFrame.size);
    CGContextClipToRect (UIGraphicsGetCurrentContext(),CGRectMake(0, 0, captureFrame.size.width, captureFrame.size.height));
    [layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *captureImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return captureImage;

【讨论】:

好的,感谢您的帮助,但我更喜欢可模块化的解决方案(主要关注纵横比:)) 我更新了我的问题:***.com/questions/27302487/…你有什么想法吗?

以上是关于UICollectionViewCell 展开动画的主要内容,如果未能解决你的问题,请参考以下文章

如何控制 UICollectionViewCell 调整动画大小?

可扩展的 UICollectionViewCell

自定义 UICollectionViewCell contentView 动画

UICollectionviewCell 动画

带有协议的 UICollectionViewCell 动画

UICollectionViewCell 带有约束的动画