由 Mike Swanson

随着 iOS 屏幕尺寸的不断增多，设计出在任何尺寸下都看起来平衡的常规网格项目变得越来越困难。JBSpacer 在保持内边距与外边距大小之间指定比例的同时，计算网格项的最优间隔。

以下是一个示例，展示了包含的项目首先显示了标准 在宽度增加时的行为，并在打开 开关和宽度减小后显示了 的行为

JBSpacer 可以配置为特定的设置，也可以从多个选项中自动选择最佳/最紧凑的间隔。

空格自动对像素（而不是点）边界进行捕捉，以便进行精细控制，并已在 @1x、@2x 和 @3x 分辨率下进行了测试。目前它正在使用于 Halftone 2 和 Layout。

两个便利方法使得应用计算出的间隔变得非常容易

• frameForItemAtIndex: 为指定索引的项提供一个范围。
• applySpacingToCollectionViewFlowLayout: 配置一个 实例以生成均匀间隔的网格。

当然，也可以将原始间隔结果用于自定义布局。

需求

JBSpacer 已针对 iOS 8 编译和测试，尽管它应该与 iOS 6 及更高版本兼容。此外，虽然 JBSpacer 可能可以通过小幅修改（例如，为 提供空间）用于 Mac 开发，但我自己还没有尝试过。

使用方法

将 JBSpacer.h/.m 和 JBSpacerOption.h/.m 添加到您的项目中。然后

#import "JBSpacer.h"

配置选项

JBSpacerOption *option = [JBSpacerOption optionWithItemSize:50.0f
                                              minimumGutter:2.0f
                                        gutterToMarginRatio:1.0f
                                              availableSize:320.0f
                                   distributeExtraToMargins:YES]];

空格在一维内执行其计算，假设第二维（例如，在 中）将滚动。在这个例子中， 和 参数表示宽度，尽管它们也可以在其他布局场景中用作高度。

参数是一个因子，表示边距大小作为与边距大小的关系。在这个例子中， 参数设置为 2.0，因此最小边距大小将是 2.0 x 1.0 = 2.0。如果最终的边距大小是 3.5，则边距大小也将是 3.5，依此类推。

《distributeExtraToMargins》（分配合计到页边距）参数控制额外的空间是否应分布到页边距。并不是所有的计算都能得出完美的解决方案，这是隐藏额外空间的同时保持视觉效果平衡的一种方法。由于计算是在像素级别（而非点级别）执行的，因此通常有很少的额外空间需要考虑，它很容易隐藏在页边距中，而不会显著影响gutterToMarginRatio。

为了计算间距，创建一个带有指定选项的JBSpacer。

JBSpacer *spacer = [JBSpacer spacerWithOption:option];

空白区域的spacing属性包含了计算的结果。

要考虑多个选项，请调用findBestSpacingWithOptions:方法。这为空白区域提供多个可接受的方案，它会找到最紧凑的表示方案。

BOOL success = [spacer findBestSpacingWithOptions:
                @[[JBSpacerOption optionWithItemSize:78.5f
                                       minimumGutter:2.0f
                                 gutterToMarginRatio:0.0f
                                       availableSize:320.0f
                            distributeExtraToMargins:YES],
                  [JBSpacerOption optionWithItemSize:78.5f
                                       minimumGutter:2.0f
                                 gutterToMarginRatio:1.0f
                                       availableSize:320.0f
                            distributeExtraToMargins:YES]]];

要使用最佳间距与UICollectionView一起使用，将结果应用于UICollectionViewFlowLayout实例。

[spacer applySpacingToCollectionViewFlowLayout:flowLayout];

这就是全部。祝您享受！