UICollectionView自定义单元格并进行水平滚动

Question

我是IOS应用开发的新手。现在有一天，我想制作一个喜欢下面图片的屏幕 如何制作？
我正在考虑使用UICollectionView，但我不知道如何自定义它？

Answer 1

您已实现名为“sizeForItemAt”的方法，它用于设置集合视图的每个单元格的大小。由于集合视图的双向滚动属性，您的条件得到满足。如果您更改单元格的大小，那么对于您的UI来说可能是最差的。

Answer 2

按照以下步骤操作： -

1. 从情节提要中选择集合视图（如果使用）。
2. 然后转到属性检查器。
3. 并将“滚动方向”垂直设置为“水平”。 （垂直是默认的）

Answer 3

我现在可以通过以下解决方法

来实现

class ViewController: UIViewController, UICollectionViewDelegateFlowLayout{

    ...

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: 40.0, height: 500.0)

    }
}

Answer 4

您可以在看到内容偏移教程和集合视图的内容大小后执行此操作。这两个参数可帮助您检查重叠的单元格。 使用绿色视图的x原点检查每个单元格的内容偏移量。

Answer 5

创建可可触摸文件。 步骤1 第2步 现在您将创建两个文件。 使用xib设计你的UI和CollectionViewCell类来连接xib的出口。 现在，在主视图控制器中，您确认UIcollectionViewDelegate和UIcollectionViewDataSource，为xib注册标识符。

collectionView.register(UINib(nibName: "CollectionViewCell", bundle: Bundle.main), forCellWithReuseIdentifier: "yourIdentifier")

您可以使用此yourIdentifer为ItemForRowAtIndexPath中的集合视图deque项目。

现在更改滚动方向属性。以下是您可以参考的图片

或者以编程方式，您可以通过以下代码更改它。

if let layout = self.yourCollectionView.collectionViewLayout as? UICollectionViewFlowLayout {
   layout.scrollDirection = .horizontal
}