使用 UICollectionView 和 UICollectionViewCells 创建刷卡堆栈? [英] Creating a swiping card stack with UICollectionView and UICollectionViewCells?

查看:24
本文介绍了使用 UICollectionView 和 UICollectionViewCells 创建刷卡堆栈?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

到目前为止,我制作了向左或向右水平滚动的集合视图.我将 UICollectionViewCells 添加到一个 UICollectionView 中.我遇到的问题是试图找到正确的设置,使卡片堆叠在第一张卡片的顶部,如下图所示.

So far, I made my collection views which scroll horizontally in either left or right.I added UICollectionViewCells into one UICollectionView. My problem that I'm having is trying to find the right settings to make the cards stack on top of the first card, as demonstrated in the photo below.

这是我的 collectionView 的设置以及它如何显示其单元格.

Here are the settings for my collectionView and how it displays its cells.

lazy var collectionView: UICollectionView = {
   let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = .Horizontal
    layout.minimumInteritemSpacing = 0
    layout.minimumLineSpacing = 78
    let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
    cv.backgroundColor = UIColor.clearColor()
    cv.showsHorizontalScrollIndicator = false
    cv.translatesAutoresizingMaskIntoConstraints = false
    return cv

}()

推荐答案

您将不得不子类化 UICollectionViewLayout,为每个单元格设置 UICollectionViewLayoutAttributes,并使确保将 zIndex 设置为项目的 indexPath.row 以获得重叠.您可以在 GitHub 上查看我的示例项目,它实现了非常相似的东西.

You're going to have to subclass UICollectionViewLayout, set the UICollectionViewLayoutAttributes for each cell, and make sure to set zIndex to the indexPath.row of the item in order to get overlapping. You can take a look at my sample project on GitHub that implements something very similar.

UICollectionViewLayout 中存在一些与在单元格重叠时动画插入新单元格相关的错误(这就是我首先制作示例项目的原因).

There are some bugs in UICollectionViewLayout related to animating insertions of new cells when the cells are overlapping (which is why I made the sample project in the first place).

这篇关于使用 UICollectionView 和 UICollectionViewCells 创建刷卡堆栈?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆