ios - 复杂的交叉布局架构和关注点分离

标签 ios swift uicollectionview autolayout uikit

我想实现一个交叉布局,就像 Wallapop 应用在其主提要上所做的那样。



如您所见,它由两组单元格组成(特色项目、您附近的项目)。第一组水平滚动,第二组垂直滚动。

我想到的第一个进行这种布局的 UIKit 组件是 UICollectionView,每个滚动方向都有一个部分。不幸的是,UICollectionView 当前的实现非常有限,无论您声明了多少部分,都只能在一个方向上强制滚动。

所以我想用普通的 UIKit 组件试一试,这就是我得到的;



我的解决方案的问题是垂直 UICollectionViewController(以绿色突出显示)自行滚动,而不是向上插入水平 UICollectionViewController

我还考虑过为垂直单元格使用单个 UICollectionViewController,并根据需要为水平单元格设置一个 UIStackView 和水平 UICollectionViewController水平单元格,但它是一个困惑的解决方案并且不能很好地缩放,如果我选择这种方式,我什至无法为垂直单元格部分设置标题。

理想情况下,我希望每组可滚动单元格都是它自己的 UIViewController,以便清楚地分离关注点和模块化。

有没有更好的方法来实现像我想要的那样使用 vanilla UIKit 组件的布局?

最佳答案

最简单和最稳定的解决方案是使用以下 View 层次结构:

  1. 使用一个UICollectionView(1) 个实例
  2. 水平滚动部分可以实现为屏幕宽度 UICollectionViewCell 包含水平滚动UICollectionView
  3. 垂直滚动部分应该只是 UICollectionView(1) 的常规部分

优点

  • 仅限 UIKit
  • 不需要什么特别的东西 - 到处都是 UICollectionViewFlowLayout
  • 水平滚动单元格和垂直滚动单元格的单元格相同
  • 良好的可扩展性和关注点分离。水平和垂直部分的独立行为,每个部分可以有多个数据源。

缺点

水平滚动部分应该有固定的高度。否则滚动行为将更难维护。

图片上的箭头表示使用!

enter image description here

关于ios - 复杂的交叉布局架构和关注点分离,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52955205/

相关文章:

iOS 推送通知自定义声音重复?

ios - 使用 Firebase 时出现 NSException

swift - 等待任务完成

ios - 如何通过 UICollectionViewController (Swift) 中的 didSelectItemAtIndexPath() 方法访问所有单元格

android - xCode 对比 Android SDK 对比 Adob​​e Flex

ios - UISegmentedControl 的动画栏按钮没有移动?

ios - 在 iOS9 上崩溃 -[NSPersistentStoreCoordinator _coordinator_you_never_successfully_opened_the_database_device_locked :]

ios - 无法使用 Int 类型的索引下标字典类型的值

ios - UICollectionView动态单元格重叠问题

ios - 访问 CollectionViewCell