ios8 - iOS 自定义键盘自动布局

Question

我应该在 Interface Builder 中向自定义键盘添加什么约束，以便当用户像下图那样改变方向(所有按钮水平拉伸(stretch)和垂直收缩，它们之间的间距相等)时完全像内置键盘一样。

Answer 1

这非常简单(如果您知道如何进行自动布局)。

所以首先，只需将您想要的按钮(或 UIView)拖到背景 View 中。并按照您的需要手动布置它们。

我将从第一行 (Q~P) 开始，可以像这样设置约束

Q -> 容器前导空间:4px

P -> 到容器的尾部空间:4px

Q-W, W-E, E-R, R-T, T-Y, Y-U, U-I, I-O, O-P 都有4px左右的水平间距

有趣的是确定宽度，简单地让Q-W、W-E、E-R、R-T、T-Y、Y-U、U-I、I-O、O-P宽度相等。我们为什么要设置这个约束？因为一旦你固定了 Q leading，P trailing 和所有的间隙，将它们设置为等宽将自动让所有第一行按钮平均共享键盘宽度的其余部分(这是我们的按钮宽度)。忘了说，WERTYUIOP 应该把 y 居中到 Q。

现在您刚刚确定了按钮宽度的第一行。

如何确定高度？想法是一样的，总键盘高度由上边距(Q 顶部的间隙)和下边距(空格下方的间隙，或 123)、行之间的间隙和 4 * 按钮高度组成。

因此，您可以像这样设置约束条件，使用 Q、A、Z 和 123 来确定按钮高度。

Q -> 容器顶部空间:4px123 -> 容器底部空间:4pxQ-A、A-Z、Z-123，垂直间距均为4px然后将它们的高度设置为相等，就像我们对按钮宽度所做的那样。

然后您可以向 W-P 添加约束，使其与 Q 具有相同的高度(我们刚刚确定了 Q、A、Z、123 的高度)。

现在第一行已经确定，接下来我们考虑第二行。我们需要第二行的 x 位置的引用基准，您可以将约束添加到 G 以水平居中到容器 View ，然后将第二行中所有按钮的间隙设置为与第一行相同(在本例中， 4 像素)。现在你已经确定了第二行。

对于第 3 行，它非常简单，您只需将每个按钮放在第 2 行即可。例如，

Z -> 中心 x 到 S -> 等于 S 的宽度

请记住，我们已经确定了 Z 的 y 位置和高度，所以不需要再这样做了。对于 X-M，对于 y，它们以 Z 为中心，对于 x，它们以第 2 行按钮为中心，与第 2 行按钮的宽度相等，与 Z 的高度相等。

我希望你明白了，自动布局的主要部分是找到 BASE，你需要有一个起点，以便所有元素在容器 View 大小变化时知道它们应该在哪里。

希望这对您有所帮助。