iOS：如何创建具有相同百分比宽度的控件行

可以在interface builder或代码中创建一行，例如，三个按钮，每个按钮的自动宽度为33%，填充整个视图水平空间

---

我对自动布局/传统方式都感兴趣。

如果使用自动布局，可以定义约束，以便（a）三个子视图的宽度相同；（b） 第一个具有指向superview的前缘；以及（c）最后一个具有到superview的训练优势。在视觉格式语言中，这意味着布局是

@"H:|[view1][view2(==view1)][view3(==view1)]|"

如果在非自动布局中执行此操作，则只需为三个视图定义

帧

，使其宽度正好为superview宽度的1/3，并且相应地偏移它们各自的

x

坐标

因此，代码可能如下所示：

UIButton *button1 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[button1 setTitle:@"1" forState:UIControlStateNormal];
button1.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:button1];

UIButton *button2 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[button2 setTitle:@"2" forState:UIControlStateNormal];
button2.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:button2];

UIButton *button3 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[button3 setTitle:@"3" forState:UIControlStateNormal];
button3.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:button3];

NSDictionary *views = NSDictionaryOfVariableBindings(button1, button2, button3);

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[button1][button2(==button1)][button3(==button1)]|" options:0 metrics:0 views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[button1]" options:0 metrics:0 views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[button2]" options:0 metrics:0 views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[button3]" options:0 metrics:0 views:views]];

---

在Interface Builder（IB）中，可以添加三个按钮，其中第一个按钮锁定在左边缘，第二个按钮锁定在第一个按钮上，第三个按钮锁定在第二个按钮上：

然后，您可以选择所有三个按钮并使其宽度相同：

然后，可以选择第三个按钮并将其后缘链接到superview：

然后手动将最后一个约束的

常数调整为零：


当你这样做的时候，这三个都是相同的大小，横跨整个视图。如果希望消除这些间隙，也可以修改按钮之间的约束。不过，我必须承认，Xcode 4.6.3中的IB有点麻烦，因为它不断添加它认为可以使其明确的约束，在过程中把它们搞砸了，所以有时需要进行一些麻烦的调整。在代码中执行它是明确的。我不认为我说Xcode 5在这类东西上更优雅是违反了NDA

--

顺便说一下，在iOS 9中，使用“堆栈视图”可以更好地呈现此UI。在Xcode 7中，选择要水平分布的视图组，然后单击堆叠视图按钮。然后为堆栈视图指定所需的分布（“等中心”或“等间距”都很好），并定义适当调整堆栈视图大小的约束（例如顶部/前导/尾随约束）。
谢谢！因此，在interface builder中使用autolayout没有直观的方法来实现这一点？@MicheleVirgilio您可以单击两个视图，然后将它们的宽度设置为彼此相等。重复这个过程。您可以在IB中执行我在上面的VFL中概述的相同操作。非常好，谢谢。因此，如果没有自动布局，就可以在interface builder中获得视觉反馈，而使用自动布局，则必须使用代码，对吗？@MicheleVirgilio我不确定是否遵循了您的问题。使用autolayout，您可以将它们设置为相同的大小，它将为您调整大小并移动它们。在没有自动布局的情况下，您可以自己手动计算
x
和
width
值，但可以键入它们（并且使用正确的自动调整大小掩码设置，它们可以根据横向/纵向等正确调整大小）。UISegmentedControl如何？