Swift 为点击时的 CollectionView 项目设置动画

Question

我正在尝试为我的 CollectionViewCell 设置动画，当时它是 tapped，有点像在 AppStore 中。我设法几乎得到了行为，但不是 100% 流畅：

这里有一个video可以更好的理解。

如果您仔细观察，您会发现在点击 cell 之后会再次收缩一小会儿。

这是我的代码：

func shrink(down: Bool) {
    UIView.animate(withDuration: 0.2) {
        if down {
            self.theView.transform = CGAffineTransform(scaleX: 0.95, y: 0.95)
        } else {
            self.theView.transform = .identity
        }
    }
}

override var isHighlighted: Bool {
    didSet {
        shrink(down: isHighlighted)
    }
}

如何解决物品只缩小一次的问题？如果有任何不清楚的地方，请告诉我。

Answer 1

使用以下技术来实现您的效果 – 在您的集合视图委托中覆盖 didHighlightItemAt 和 didUnhighlightItemAt，如下所示：

func collectionView(_ collectionView: UICollectionView, didHighlightItemAt indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath)
    UIView.animate(withDuration: 0.2) {
        cell?.transform = CGAffineTransform(scaleX: 0.95, y: 0.95)
    }
}

func collectionView(_ collectionView: UICollectionView, didUnhighlightItemAt indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath)
    UIView.animate(withDuration: 0.2) {
        cell?.transform = .identity
    }
}

Answer 2

我解决了：我必须在缩小或返回时将 duration 设置不同，这样我才能顺利过渡：

func shrink(down: Bool) {
    if down {
        UIView.animate(withDuration: 0.3) {
            self.theView.transform = CGAffineTransform(scaleX: 0.95, y: 0.95)
        }
    } else {
        UIView.animate(withDuration: 0.5) {
            self.theView.transform = .identity
        }
        
    }
}

override var isHighlighted: Bool {
    didSet {
        shrink(down: isHighlighted)
    }
}

这是平滑过渡后的样子：

https://gofile.io/d/dwnuCW

如果你想测试结果，这里是 link 我的应用程序：

https://apps.apple.com/de/app/wishlists-einfach-w%C3%BCnschen/id1503912334

Swift 为点击时的 CollectionView 项目设置动画

Swift animate CollectionView item on tap

ios

swift

animation

uicollectionview

uicollectionviewcell