SwiftSpringBoard:实现iOS主屏幕布局

SwiftSpringBoard是一个旨在重现iOS主屏幕图标配置和功能的项目。

对SwiftSwiftBoard的需求来自我们的一位客户,该客户在其iOS应用程序的主屏幕上使用集合视图。 该客户愿意提供Apple风格的主页按钮重新排序功能以及隐藏单元格的功能。

我们需要一个能够完成以下功能的组件:

  • 以与在iOS主屏幕上显示应用程序相同的方式呈现项目
  • 在屏幕的一个或多个页面上对元素进行重新排序(通过拖放)
  • 从屏幕上删除元素

我们要做的第一件事当然是查找可以满足我们需求的可用框架。 如果您自己这样做,您可能会得出与我们相同的结论:首先,很少有框架与我们的目标相关,其次,截至2017年11月,大多数可用工具尚未得到更新。至少两年。

我们的库依赖于4种类型的对象:

  • SpringBoardView:显示主屏幕样式项的视图(UICollectionView的子类)
  • SpringBoardManager:实现视图行为核心逻辑的对象
  • SpringBoardDataSource:应用程序用来设置组件的协议
  • SpringBoardLayout:视图使用的自定义布局(UICollectionViewFlowLayout的子类)

为了最大程度地减少麻烦和不必要的重新实现(并最大程度地了解世界各地的知识),SwiftSpringBoard组件主要使用UICollectionViews中的标准行为:自iOS 9.0起,UICollectionViews本身就可以提供适合基本功能的重新排序机制需要。 此外,自iOS 2.0起,UIScrollViews即可使用分页。 这些功能结合在一起,为我们满足需求提供了坚实的起点。

我们设计了SpringBoardDataSource协议,以便经典UICollectionView机制的用户不会迷路。 首先,用户必须设置其跳板将在单个页面上使用的列数和行数。 为此,用户必须实现以下方法:

对于水平滚动,将逐列加载项目:

问题是,由于主屏幕中的分页是水平进行的,因此我们必须坚持水平滚动。 但是,正如您所看到的,垂直滚动将项目放置的方式与预期放置首页项目的方式相同。 因此,我们必须以垂直布局的方式自己计算项目位置。 计算项目位置本身意味着要处理项目的创建和删除,否则我们将保留对无用变量的引用,这些变量在使用UIKit的默认组件时肯定会导致崩溃,并且我们不会意识到将新项目添加到视图中,这意味着它们永远不会被显示。 布局还必须处理无法完全填充的页面,这是我们在主屏幕上可以看到的行为。

经过大量故障排除后,我们成功处理了布局及其几次更新。 但是组件的部分逻辑仍必须由用户处理,因为他是唯一可以完全访问加载在弹簧板上的原始数据的用户。

假设您的跳板数据由存储在一个名为dataContent的主数组中的数字数组组成 。 您对SpringBoardDataSource的实现应如下所示:

到目前为止,我们打算改进SwiftSpringBoard的几种方法包括:

  • 动态列和行计数:这将是我们的下一个发展。 从今天起,用户必须手动设置其行数和列数以用于布局以正确计算尺寸。 我们希望仅基于布局的插图和间距属性以及项目的固定大小来自动计算行数和列数。
  • 处理文件夹:尽管用户已经可以实现此行为,但我们正在寻找一种干净简单的方法将此功能添加到我们的库中。 一种选择是为打开的文件夹创建SpringBoardView的另一个实例。

如果您碰巧使用了我们的组件,我们真的会对您将如何使用它感到好奇。 如果您有任何问题/建议,请随时与我们联系。


Wassa是室内定位和计算机视觉领域的创新数字代理专家。 无论您是想帮助客户在建筑物中找到自己的出路,增强产品的用户体验,收集有关客户的数据还是分析某个地点的人流量和行为,我们的创新实验室都将科学的专业知识带给您最大的设计灵感根据您的目标调整解决方案。

在 – 找到我们:

  • Facebook和Twitter
  • 领英
  • 的GitHub
  • 我们的网站