UICollectionView上的自定义动画重新加载数据

Question

我想为集合视图的重新加载设置动画，以便在选择单元格时，我会获得类似于在单人纸牌游戏中处理牌的动画。 （成像旧的MS纸牌处理）

我一直在寻找“自定义UICollectionView reload animatation”并看到了诸如

之类的解决方案

[self.collectionView performBatchUpdates:^{
[self.collectionView reloadItemsAtIndexPaths:myindexPaths]
} completion:nil];

并且想出了这个

    CATransition *transition = [CATransition animation];
    transition.duration = 1;
    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    transition.type = kCATransitionMoveIn;
    [self.collectionView.layer addAnimation:transition forKey:nil];
    [self.collectionView reloadData];
    return;

但它没有达到我想要的效果。 有什么想法可以做到吗？

Answer 1

你可以像建议here

那样做一些技巧

+ (CATransition *)swipeTransitionToLeftSide:(BOOL)leftSide
{
    CATransition* transition = [CATransition animation];
    transition.startProgress = 0;
    transition.endProgress = 1.0;
    transition.type = kCATransitionPush;

    transition.subtype = leftSide ? kCATransitionFromRight : kCATransitionFromLeft;
    transition.duration = AnimationDuration;
    return transition;
}

并将其添加到您的collectionView

UISwipeGestureRecognizer *swipeGestureL = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(didSwipeToLeftCollectionView:)];
swipeGestureL.direction = UISwipeGestureRecognizerDirectionLeft;
[self.collectionView addGestureRecognizer:swipeGestureL];

- (void)didSwipeToLeftCollectionView:(UISwipeGestureRecognizer *)swipeGesture
{
    [self.collectionView.layer addAnimation:[Animation swipeTransitionToLeftSide:YES] forKey:nil];
    [self.collectionView reloadData];
}

结果：

Answer 2

我喜欢@ gbk的答案所以这里左右都是 Swift 3.1

override func viewDidLoad() {
    super.viewDidLoad()

    let swipeGestureL = UISwipeGestureRecognizer(target: self, action: #selector(swipeLeft))
    swipeGestureL.direction = .left
    collectionView.addGestureRecognizer(swipeGestureL)

    let swipeGestureR = UISwipeGestureRecognizer(target: self, action: #selector(swipeRight))
    swipeGestureR.direction = .right
    collectionView.addGestureRecognizer(swipeGestureR)
}

func swipeTransitionToLeftSide(_ leftSide: Bool) -> CATransition {
    let transition = CATransition()
    transition.startProgress = 0.0
    transition.endProgress = 1.0
    transition.type = kCATransitionPush
    transition.subtype = leftSide ? kCATransitionFromRight : kCATransitionFromLeft
    transition.duration = 0.3

    return transition
}

@IBAction func swipeLeft() {
    collectionView.layer.add(swipeTransitionToLeftSide(true), forKey: nil)
    updateDasource()
}

@IBAction func swipeRight() {
    collectionView.layer.add(swipeTransitionToLeftSide(false), forKey: nil)
    updateDatasource()
}

func updateDatasource() {
    self.collectionView.reloadData()
}

Answer 3

您需要创建自定义UICollectionViewLayout来执行自定义动画。如果效果只是从A点到B点的转换，您可以使用内置动画的相当标准的使用。您可以将单元格的位置设置为initialLayoutAttributesForAppearingItemAtIndexPath:中的A点和layoutAttributesForItemAtIndexPath:中的B点。如果要处理卡片，只需将相应的索引路径插入到performBatchUpdates:的集合视图中即可。将卡片发回给经销商的类似动画应使用finalLayoutAttributesForDisappearingItemAtIndexPath:。

如果你想做一个更复杂的动画，那么你手上还有很多工作要做。这很可能包括在沿着CGPath制作动画之前对单元格进行快照并对其进行变换。动画完成后，您将告诉集合视图在最终位置绘制它。