如何使用自动布局水平设置三个按钮而没有间隙

Posted

技术标签:

【中文标题】如何使用自动布局水平设置三个按钮而没有间隙【英文标题】:How to set three buttons horizontally without gap using autolayout 【发布时间】:2015-04-06 19:36:22 【问题描述】:

我有一个要求,我尝试在视图底部设置 3 个按钮,水平放置,没有任何间隙。我附上了我需要如何显示的屏幕截图和另一个显示它当前显示方式的屏幕截图。

我正在以编程方式使用以下约束来设置它

NSDictionary *views = NSDictionaryOfVariableBindings(btnCreateAccount,btnForgotuserid,btnForgotPassword);

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:btnCreateAccount attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeBottom multiplier:1 constant:0]];

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[btnCreateAccount][btnForgotuserid(==btnCreateAccount)][btnForgotPassword(==btnCreateAccount)]|" options:NSLayoutFormatAlignAllBottom metrics:nil views:views]];

请帮我解决这个问题

编辑:在 ios 7 中,查看屏幕截图

谢谢, 维诺德。

【问题讨论】:

在界面生成器中这样做是一种选择吗?我知道怎么做... 否则,我会将每个按钮的宽度设置为 W,其中 W 是一个度量 - 包含按钮的视图宽度的 1/3。指标:@@"W":1.0/3.0*buttonsSuperView.width 【参考方案1】:

我已经尝试了您的代码,并且约束似乎工作正常。问题可能出在其他地方。

这是我尝试过的代码,以编程方式创建了所有按钮:

UIButton *b1 = [[UIButton alloc] init];
UIButton *b2 = [[UIButton alloc] init];
UIButton *b3 = [[UIButton alloc] init];

for (UIButton *b in @[b1, b2, b3]) 
    [b setTranslatesAutoresizingMaskIntoConstraints:NO];
    [self.view addSubview:b];
    [b.layer setBorderWidth:1];

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:b1 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeBottom multiplier:1 constant:0]];

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[b1]-0-[b2(==b1)]-0-[b3(==b1)]-0-|" options:NSLayoutFormatAlignAllBottom metrics:nil views:@ @"b1":b1, @"b2":b2, @"b3":b3 ]];

确保您在按钮上调用setTranslatesAutoresizingMaskIntoConstraints:NO。如果您在情节提要中创建它们,则需要删除其中添加的隐式约束。

如果您需要更多帮助,请告诉我。

【讨论】:

嗨 Catalina 感谢您的帮助。它适用于各种屏幕尺寸的 iOS 8,但不适用于 iOS 7。我在这里错过了什么吗 看看我的水平约束,按钮之间的空间显式设置为0。您是否对代码进行了更改?这使它在 iOS7 上也适用于我,我刚刚尝试过 我使用了你的代码并在 ios 7 模拟器中运行,但我仍然得到了我附加的那个屏幕 谢谢,这工作正常 :) 我从故事板上删除了按钮并以编程方式创建,并且在 iOS 7.0 中工作正常 太棒了!不客气 :) 祝你的项目好运

以上是关于如何使用自动布局水平设置三个按钮而没有间隙的主要内容,如果未能解决你的问题,请参考以下文章

自动布局问题

如何使用自动布局来布局三个项目水平相等

如何以编程方式使用自动布局排列这三个 UILabel?

使用自动布局在三个标签之间保留相同的空间

如何管理自动布局中两个视图之间的间隙

具有自动布局的水平放置等宽等水平空间按钮