Question

我有一个应用程序，要求我根据纵向或横向方向设置不同的图像视图和标签。

例如，在纵向模式下，我在顶部和底部有2个UIImageViews，它们均匀地共享屏幕。在横向模式下，2个UIImageViews是并排的。如何使用Xcode 6中的故事板来完成这项工作？

我尝试过的事情：

使用大小类对Storyboard中的视图设置约束。一世在w:Any h:Any中设置我的2个图像视图的基本值，然后移动到w:Compact h:Regular并为纵向视图设置约束。然后我移动到w:Any h:Compact，并排移动了2张图像并为横向视图设置约束。然后我得到了冲突 w:Compact h:Compact因为我申请的限制和风景和肖像方向。我想是因为我感动了在设置之前，图像会以横向方向查看造成这个问题的限制。
使用2个独立的视图控制器并具有纵向视图控制器使用时方向更改时切换到横向视图控制器 NSNotificationCenter和performSegueWithIdentifier推送在我的肖像视图控制器顶部的景观视图控制器。这个问题是要传递大量数据（很多 imageview和标签）。

是一种只使用一个视图控制器的方法，还有一种方法可以重新排列图像视图/标签，并在方向发生变化时对它们应用新约束？是-(void)viewDidLayoutSubviews{}我在哪里放置代码来重新排列图像视图？有人能指出我正确的方向吗？谢谢！

Answer 1

对于这种情况，我建议通过代码以编程方式进行布局。这是一个例子： https://dl.dropboxusercontent.com/u/48223929/Test.zip

- (void)viewDidLayoutSubviews
{
    [super viewDidLayoutSubviews];
    [self layoutImageViewsForViewSize:self.view.frame.size];
}

- (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator
{
    [self layoutImageViewsForViewSize:size];
}

- (void)layoutImageViewsForViewSize:(CGSize)size
{
    // Portrait mode
    if (size.height > size.width) {
        self.imageView1.frame = CGRectMake(0, 0, size.width, size.height / 2);
        self.imageView2.frame = CGRectMake(0, size.height / 2, size.width, size.height / 2);
        // Landscape mode
    } else {
        self.imageView1.frame = CGRectMake(0, 0, size.width / 2, size.height);
        self.imageView2.frame = CGRectMake(size.width / 2, 0, size.width / 2, size.height);
    }
}

自动布局：

- (void)layoutImageViewsForViewSize:(CGSize)size
{
    // Portrait mode
    [self.view removeConstraints:self.view.constraints];
    if (size.height > size.width) {
        NSString *heightLayoutFormatString = [NSString stringWithFormat:@"V:|[_imageView1(%.0f)][_imageView2(%.0f)]|", size.height / 2, size.height / 2];
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:heightLayoutFormatString options:0 metrics:nil views:NSDictionaryOfVariableBindings(_imageView1, _imageView2)]];
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:[NSString stringWithFormat:@"H:|[_imageView1(%.0f)]|", size.width] options:0 metrics:nil views:NSDictionaryOfVariableBindings(_imageView1)]];
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:[NSString stringWithFormat:@"H:|[_imageView2(%.0f)]|", size.width] options:0 metrics:nil views:NSDictionaryOfVariableBindings(_imageView2)]];

    // Landscape mode
    } else {
        NSString *widthLayoutFormatString = [NSString stringWithFormat:@"H:|[_imageView1(%.0f)][_imageView2(%.0f)]|", size.width / 2, size.width / 2];
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:widthLayoutFormatString options:0 metrics:nil views:NSDictionaryOfVariableBindings(_imageView1, _imageView2)]];
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:[NSString stringWithFormat:@"V:|[_imageView1(%.0f)]|", size.height] options:0 metrics:nil views:NSDictionaryOfVariableBindings(_imageView1)]];
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:[NSString stringWithFormat:@"V:|[_imageView2(%.0f)]|", size.height] options:0 metrics:nil views:NSDictionaryOfVariableBindings(_imageView2)]];
    }
    [self.view setNeedsUpdateConstraints];
}

自动布局的另一个解决方案 - 制作UIView的自定义子类，其中包含2个图像视图，并在没有约束的情况下以编程方式布局 - 只需setFrame。然后将此自定义UIView添加到您的故事板

使用单视图控制器使用故事板进行纵向和方向的自定义视图

1 个答案: