如何实现点击UICollectionViewCell时带动画删除单元格？

你预期的点击单元格右滑出屏幕、下方单元格上移补位的效果不是UICollectionView的标准默认删除动画：系统默认deleteItems(at:)自带的删除效果是被删除单元格缩放淡出，下方单元格上移补位是系统删除操作自带的行为，右滑出屏幕的部分需要自定义实现。

你需要按「更新数据源→自定义被点击单元格动画→动画结束后触发系统删除」的逻辑补全didSelectItemAt方法，代码如下：

extension MainVC: UICollectionViewDelegate {
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        // 获取当前被点击的单元格
        guard let selectedCell = collectionView.cellForItem(at: indexPath) else { return }
        
        // 必须先同步移除数据源中对应位置的数据，否则会触发数据不一致崩溃
        yourDataArray.remove(at: indexPath.item)
        
        // 给被点击单元格添加右滑出屏幕的动画
        UIView.animate(withDuration: 0.3, animations: {
            selectedCell.transform = CGAffineTransform(translationX: collectionView.bounds.width, y: 0)
        }, completion: { _ in
            // 单元格滑出后执行系统删除操作，自动触发下方单元格上移补位的动画
            collectionView.deleteItems(at: [indexPath])
        })
    }
}

• 不要在调用deleteItems(at:)之后立刻执行reloadData()，否则会直接取消所有删除动画，直接刷新UI
• 代码中的yourDataArray替换为你自己给collectionView提供数据的数据源数组即可
• 动画时长可以根据视觉需求调整，0.2~0.35秒区间的动效流畅度最佳
• 如果使用了自定义UICollectionViewLayout，需要保证布局属性的更新逻辑正确，才能正常触发单元格上移补位的效果

内容的提问来源于stack exchange，提问作者kesape