如何使约束(自动布局)以编程方式工作
How to make constraints (auto-layout) work programmatically
这是我的第一个 iOS 项目,因此我在约束和自动布局方面遇到困难。
这就是我想要做的。我想将子视图添加到 UIScrollView。这是我以编程方式进行的,因为子视图的数量不是静态的。当我只添加一个子视图(在代码或 XIB 中)或通过 XIB 添加多个子视图时,我可以使自动布局和约束完美地工作。但是我无法让它在代码中使用动态数量的子视图。
创建了多个子视图实例,但由于约束不起作用,它们都在彼此之上。我希望他们在每场比赛中都排好队,这就是为什么我试图让约束发挥作用。 (目前我只是将子视图的数量设置为 10,但这只是暂时的)
这是我的一些代码(从按下按钮开始):
-(IBAction) buttonTapped:(id)sender {
UIScrollView *matchScrollView = (UIScrollView *) [self.view viewWithTag:1];
NSMutableArray *matchViewsArray = [[NSMutableArray alloc] init];
for (int i = 0; i <= 9; i++) {
MatchView *newMatchView = [[NSBundle mainBundle] loadNibNamed:@"MatchView" owner:self options:nil].firstObject;
[matchViewsArray addObject:newMatchView];
}
for (int i = 0; i < [matchViewsArray count]; i++) {
MatchView *newMatchView = matchViewsArray[i];
//I kept some IBOutlets out of the code example here. They work fine with a single subview. or even multiple subviews as long as you don't mind they are all on top of each other due to constraints not working xD
[newMatchView setTranslatesAutoresizingMaskIntoConstraints:NO];
[matchScrollView addSubview:matchViewsArray[i]];
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeLeading
multiplier:1.0
constant:8.0]];
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeTrailing
multiplier:1.0
constant:8.0]];
//If this is not the first object, then the top of the object contraints with the bottom of the previous object
if (i > 0) {
// I think the fault may lie here. Do i need to remove the previous constraint, or will it be overwritten? This did not work however, did i remove it wrong?
//Making sure it only tries to call removeconstraint: once and once only, as the constraint is only put on the else statement which only executes on the very first object. Attempt to fix the code
if (i == 1) {
[matchScrollView removeConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i - 1]
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
}
[matchViewsArray[i - 1] addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:matchViewsArray[i - 1]
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:8.0]];
}
//The top of the first object constraints with the top of the matchScrollView
else {
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
}
//If this is the last object, then the bottom of the object constraints with the bottom of matchScrollView
if ( i == [matchViewsArray count] - 1) {
//tried removing the constraint created by else statement first before adding a new constraint
[matchViewsArray[i] removeConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i - 1]
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:matchViewsArray[i]
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationGreaterThanOrEqual
toItem:matchScrollView
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:8.0]];
}
//else the bottom of the object contraints with the top of the next object
else {
[matchViewsArray[i + 1] addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:matchViewsArray[i + 1]
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
}
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeCenterX
multiplier:1.0
constant:0.0]];
}
}
我不断收到 "terminating with uncaught exception of type NSException"。我尝试在添加新约束之前删除旧约束,但这没有帮助。除非我删除错误?
如果我删除所有的 if 和 else 语句,只创建一个子视图,那么约束就可以完美地工作。如果我创建多个子视图,那么应用程序不会崩溃,但所有子视图都具有相同的约束并且彼此重叠。因此,通过添加 if 和 else 语句并使用 matchViewsArray[i - 1],我尝试为多个子视图设置约束。
此外,即使这段代码有效,真的没有更简单的方法来代替循环中的所有这些 if 和 else 语句吗?
如上所述,这是我的第一个 iOS 项目,因此可能有更有效和更好的方法来实现我想要的行为。
如有任何帮助,我们将不胜感激。
不幸的是,我没有制作 iOS 应用程序的许可证,因此无法按原样对其进行测试,但这个 OSX 片段可能会有所帮助:
- (void)applicationDidFinishLaunching:(NSNotification *)notification
{
NSView *contentView = [window contentView];
NSMutableArray *buttons = [[NSMutableArray alloc] init];
for (int i = 0; i < 10; i++) {
NSButton *button = [[NSButton alloc] initWithFrame:NSZeroRect];
[button setTranslatesAutoresizingMaskIntoConstraints:NO];
[button setTitle:[NSString stringWithFormat:@"Button %d", (int)pow(10, i)]];
[button setBezelStyle:NSRoundedBezelStyle];
[button setFont:[NSFont systemFontOfSize:[NSFont systemFontSize]]];
[button sizeToFit];
[buttons addObject:button];
[contentView addSubview:button];
}
int count = (int)[buttons count];
// 1. one below other
// 2. all equal width
for (int i = 1; i < count; i++) {
NSView *view1 = buttons[i-1];
NSView *view2 = buttons[i];
NSDictionary *views = NSDictionaryOfVariableBindings(view1, view2);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view1]-[view2]"
options:0
metrics:nil
views:views]];
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[view1(==view2)]"
options:0
metrics:nil
views:views]];
}
// 3. first -> top
if (count > 0) {
NSView *view = [buttons firstObject];
NSDictionary *views = NSDictionaryOfVariableBindings(view);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[view]"
options:0
metrics:nil
views:views]];
}
// 4. last -> bottom
if (count > 0) {
NSView *view = [buttons lastObject];
NSDictionary *views = NSDictionaryOfVariableBindings(view);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view]-|"
options:0
metrics:nil
views:views]];
}
// 5. left <- all -> right
for (int i = 0; i < count; i++) {
NSView *view = buttons[i];
NSDictionary *views = NSDictionaryOfVariableBindings(view);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[view]-(>=20)-|"
options:0
metrics:nil
views:views]];
}
}
请注意,您不能在不使用 "visual format language" 的情况下指定默认的 8/20 间距,因为 constraintsWithVisualFormat:...
会产生特殊的约束(好吧,里面有特殊的私有标志)在特定的情况下自动调整 8 的大小根据 Apple 的 HIG,情况为 6/4/whatever。 (您可以尝试在 IB 中放置控件,并发现默认值并不总是 8,但在运行时突然是!)。
编辑: 此外,您可以始终使用简单的#define 或子例程来隐藏 [[[content-constraint-with-contraint-visual-constraint-with-constraints -小马]]]梯子。
edit2: 重构阶段:)
这是我的第一个 iOS 项目,因此我在约束和自动布局方面遇到困难。
这就是我想要做的。我想将子视图添加到 UIScrollView。这是我以编程方式进行的,因为子视图的数量不是静态的。当我只添加一个子视图(在代码或 XIB 中)或通过 XIB 添加多个子视图时,我可以使自动布局和约束完美地工作。但是我无法让它在代码中使用动态数量的子视图。
创建了多个子视图实例,但由于约束不起作用,它们都在彼此之上。我希望他们在每场比赛中都排好队,这就是为什么我试图让约束发挥作用。 (目前我只是将子视图的数量设置为 10,但这只是暂时的)
这是我的一些代码(从按下按钮开始):
-(IBAction) buttonTapped:(id)sender {
UIScrollView *matchScrollView = (UIScrollView *) [self.view viewWithTag:1];
NSMutableArray *matchViewsArray = [[NSMutableArray alloc] init];
for (int i = 0; i <= 9; i++) {
MatchView *newMatchView = [[NSBundle mainBundle] loadNibNamed:@"MatchView" owner:self options:nil].firstObject;
[matchViewsArray addObject:newMatchView];
}
for (int i = 0; i < [matchViewsArray count]; i++) {
MatchView *newMatchView = matchViewsArray[i];
//I kept some IBOutlets out of the code example here. They work fine with a single subview. or even multiple subviews as long as you don't mind they are all on top of each other due to constraints not working xD
[newMatchView setTranslatesAutoresizingMaskIntoConstraints:NO];
[matchScrollView addSubview:matchViewsArray[i]];
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeLeading
multiplier:1.0
constant:8.0]];
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeTrailing
multiplier:1.0
constant:8.0]];
//If this is not the first object, then the top of the object contraints with the bottom of the previous object
if (i > 0) {
// I think the fault may lie here. Do i need to remove the previous constraint, or will it be overwritten? This did not work however, did i remove it wrong?
//Making sure it only tries to call removeconstraint: once and once only, as the constraint is only put on the else statement which only executes on the very first object. Attempt to fix the code
if (i == 1) {
[matchScrollView removeConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i - 1]
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
}
[matchViewsArray[i - 1] addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:matchViewsArray[i - 1]
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:8.0]];
}
//The top of the first object constraints with the top of the matchScrollView
else {
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
}
//If this is the last object, then the bottom of the object constraints with the bottom of matchScrollView
if ( i == [matchViewsArray count] - 1) {
//tried removing the constraint created by else statement first before adding a new constraint
[matchViewsArray[i] removeConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i - 1]
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:matchViewsArray[i]
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationGreaterThanOrEqual
toItem:matchScrollView
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:8.0]];
}
//else the bottom of the object contraints with the top of the next object
else {
[matchViewsArray[i + 1] addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:matchViewsArray[i + 1]
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:8.0]];
}
[matchScrollView addConstraint:[NSLayoutConstraint constraintWithItem:matchViewsArray[i]
attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual
toItem:matchScrollView
attribute:NSLayoutAttributeCenterX
multiplier:1.0
constant:0.0]];
}
}
我不断收到 "terminating with uncaught exception of type NSException"。我尝试在添加新约束之前删除旧约束,但这没有帮助。除非我删除错误?
如果我删除所有的 if 和 else 语句,只创建一个子视图,那么约束就可以完美地工作。如果我创建多个子视图,那么应用程序不会崩溃,但所有子视图都具有相同的约束并且彼此重叠。因此,通过添加 if 和 else 语句并使用 matchViewsArray[i - 1],我尝试为多个子视图设置约束。
此外,即使这段代码有效,真的没有更简单的方法来代替循环中的所有这些 if 和 else 语句吗?
如上所述,这是我的第一个 iOS 项目,因此可能有更有效和更好的方法来实现我想要的行为。
如有任何帮助,我们将不胜感激。
不幸的是,我没有制作 iOS 应用程序的许可证,因此无法按原样对其进行测试,但这个 OSX 片段可能会有所帮助:
- (void)applicationDidFinishLaunching:(NSNotification *)notification
{
NSView *contentView = [window contentView];
NSMutableArray *buttons = [[NSMutableArray alloc] init];
for (int i = 0; i < 10; i++) {
NSButton *button = [[NSButton alloc] initWithFrame:NSZeroRect];
[button setTranslatesAutoresizingMaskIntoConstraints:NO];
[button setTitle:[NSString stringWithFormat:@"Button %d", (int)pow(10, i)]];
[button setBezelStyle:NSRoundedBezelStyle];
[button setFont:[NSFont systemFontOfSize:[NSFont systemFontSize]]];
[button sizeToFit];
[buttons addObject:button];
[contentView addSubview:button];
}
int count = (int)[buttons count];
// 1. one below other
// 2. all equal width
for (int i = 1; i < count; i++) {
NSView *view1 = buttons[i-1];
NSView *view2 = buttons[i];
NSDictionary *views = NSDictionaryOfVariableBindings(view1, view2);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view1]-[view2]"
options:0
metrics:nil
views:views]];
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[view1(==view2)]"
options:0
metrics:nil
views:views]];
}
// 3. first -> top
if (count > 0) {
NSView *view = [buttons firstObject];
NSDictionary *views = NSDictionaryOfVariableBindings(view);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[view]"
options:0
metrics:nil
views:views]];
}
// 4. last -> bottom
if (count > 0) {
NSView *view = [buttons lastObject];
NSDictionary *views = NSDictionaryOfVariableBindings(view);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view]-|"
options:0
metrics:nil
views:views]];
}
// 5. left <- all -> right
for (int i = 0; i < count; i++) {
NSView *view = buttons[i];
NSDictionary *views = NSDictionaryOfVariableBindings(view);
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[view]-(>=20)-|"
options:0
metrics:nil
views:views]];
}
}
请注意,您不能在不使用 "visual format language" 的情况下指定默认的 8/20 间距,因为 constraintsWithVisualFormat:...
会产生特殊的约束(好吧,里面有特殊的私有标志)在特定的情况下自动调整 8 的大小根据 Apple 的 HIG,情况为 6/4/whatever。 (您可以尝试在 IB 中放置控件,并发现默认值并不总是 8,但在运行时突然是!)。
编辑: 此外,您可以始终使用简单的#define 或子例程来隐藏 [[[content-constraint-with-contraint-visual-constraint-with-constraints -小马]]]梯子。
edit2: 重构阶段:)