自定义UICollectionViewFlowLayout

Question

我正在尝试创建一个具有用户配置文件的应用程序，如下所示(第一张图片)：https://dribbble.com/shots/1642506-Messaging-app-Viber/attachments/257232

我特别感兴趣的是配置文件的底部，白线下和“关注我”部分。我的假设是这是使用UICollectionView完成的，但如果我错了，请纠正我，我将相应地编辑这个问题。对于6个元素，集合视图看起来非常标准(其中'o‘表示一个圆圈)：

O o o

O o o

我不希望每个小于6的数字都以这种方式排列，我希望它们居中。例如，5个元素将如下所示：

O o o

O o --> (居中于前三个- Markdown空格之间)

4：

O o o

O o o

3：

O o或o(可能是以前的，空的底线看起来很乱)

O --> (居中于前两个- Markdown空格之间)

2：

O

O

1：

O

如果你有任何更好的布局建议，请让我知道。因此，正如您从上面看到的，我希望布局根据集合视图的数据源中的元素数量进行更改。元素的数量永远不会超过6个。

此外，用户还可以编辑其中一个配置文件，其中将出现一个'+‘图标，使集合视图以(n+1)布局显示。例如，编辑具有4个元素的配置文件的用户将查看集合视图布局，就好像它有5个元素，第五个元素是一个'+‘符号，用于添加另一个元素。用户只能从已有6个元素的配置文件中删除元素。

最初，我在考虑根据集合视图的indexPath.row和数据源中元素的数量使用一组'if‘和'switch’语句。但是，这似乎很草率。有没有一种方法可以使用定制的UICollectionViewFlowLayout来做到这一点？无论哪种方式，如何实现这样的布局？

谢谢你提前给我的建议。很抱歉，这个问题很长，我可以在必要的地方提供澄清。

Answer 1

我觉得集合视图是错误的解决方案。它们被设计成在滚动网格或其他程序布局中显示任意数量的内容。你有1-6个按钮，布局美观，不容易从算法中产生。

实际上，您有10个5x2排列的“插槽”，您想要在其中放置按钮：

[01234]
[56789]

你所需要做的就是以编程的方式生成这些位置，然后将你的布局定义为“槽”数组：

6个项目：@[0,2,4,5,7,9]

5个项目：@[0,2,4,6,8]

以此类推。