为以编程方式生成的视图实现自动布局

时间:2012-09-26 00:57:44

标签: ios uiview interface-builder ios6 autolayout

我有一个应用程序,其视图以编程方式生成。例如:

-(void)loadView
{
    [super loadView];

// SET TOP LEFT BTN FOR NEXT VIEW
UIBarButtonItem *topLeftBtn = [[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStyleBordered target:nil action:nil];
self.navigationItem.backBarButtonItem = topLeftBtn;
[topLeftBtn release];

// programmatically set up the view for cart tableView
CGRect iouTableViewFrame = CGRectMake(0, 0, 320, 348);
iouTableView = [[UITableView alloc]initWithFrame:iouTableViewFrame style:UITableViewStylePlain];
[[self iouTableView] setDelegate:self];
[[self iouTableView] setDataSource:self];
[[self view] addSubview:iouTableView];

// set up the summary label
CGRect summaryTableFrame = CGRectMake(0, 348, 320, 18);
UILabel *summaryTableLabel = [[UILabel alloc] initWithFrame:summaryTableFrame];
[summaryTableLabel setFont:[UIFont fontWithName:@"Helvetica" size:14]];
[summaryTableLabel setText:@"   Summary"];
UIColor *labelColor = UIColorFromRGB(MiddleBlueColor);
[summaryTableLabel setBackgroundColor:labelColor];
[summaryTableLabel setTextColor:[UIColor whiteColor]];
[[self view] addSubview:summaryTableLabel];

// set up the summary table
CGRect summaryTableViewFrame = CGRectMake(0, 366, 320, 44);
summaryTableView = [[UITableView alloc]initWithFrame:summaryTableViewFrame style:UITableViewStylePlain];
[summaryTableView setScrollEnabled:NO];
[[self summaryTableView] setDelegate:self];
[[self summaryTableView] setDataSource:self];
[[self view] addSubview:summaryTableView];
}

是。我将在未来更新到NIB并使用界面构建器和故事板,但我没有在一年内完成ios编程。

新iPhone 5的屏幕尺寸不同,应用程序看起来不太好,我需要实现某种类型的自动布局。有没有办法以编程方式进行,而不是使用IB?

非常感谢!

2 个答案:

答案 0 :(得分:31)

是的,通过在NSLayoutConstraint中使用两种方法

-(NSArray*)constraintsWithVisualFormat:options:metrics:views:
-(NSLayoutConstraint*)constraintWithItem:attribute:relatedBy:toItem:attribute:
    multiplier:constant:

可视化格式语言全部打包成NSString 所以我将以你的iouTableView为例。

[self.view addConstraints:[NSLayoutConstraint 
    constraintsWithVisualFormat:@"|[iouTableView]|" 
    options:0 
    metrics:nil 
    views:NSDictionaryOfVariableBindings(iouTableView)]];

管道符号“|”代表超级视图的优势。 []代表一个视图。 所以我们在那里做的是将iouTableView的左右边缘连接到其超视图的左右边缘。

视觉格式的另一个例子: 让我们垂直挂钩表格视图,摘要标签和汇总表。

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:
    @"V:|[iouTableView(348)][summaryTableLabel(18)][summaryTableView(44)]"
    options:NSLayoutFormatAlignAllLeft
    metrics:nil
    views:NSDictionaryOfVariableBindings(iouTableView, summaryTableLabel, summaryTableView)]];

现在,这会在每个边缘上垂直链接所有三个视图,NSLayoutFormatAlignAllLeft告诉所有视图左对齐,并且它们将基于其他约束(在本例中为前一个约束)执行此操作。 ()用于指定视图的大小。

有一些更像是不等式和优先级以及“ - ”间隔符号,但是check out the apple docs for that

编辑:更正了示例以使用constraintsWithVisualFormat,如方法签名所示。

答案 1 :(得分:1)

除了Aplle提供的方法之外,您还可以使用Parus lib从代码中使用AutoLayout进行操作。

例如,您可以指定:

PVVFL(@"[view1]-20-[view2]").fromRightToLeft.withViews(views).asArray

而不是

[NSLayoutConstraint constraintsWithVisualFormat:@"[view1]-20-[view2]"
                                        options:NSLayoutFormatDirectionRightToLeft
                                        metrics:nil
                                          views:views]

此外,您还可以对布局设置进行分组,混合VFL而不是VFL约束。 Parus能够防止常见错误,区分位置参数 constriaints,并提供出色的自动完成支持。