从列到行的自动布局约束

Question

简化我的示例，假设我在基本视图控制器上有三个正方形。在纵向模式下，这些正方形相互堆叠，垂直间距为 20 像素左右。所以是这样的：

X
X
X

在横向模式下，第 3 个 X 会被切断，所以我想让它们看起来像这样：

XXX

换句话说，让底部的出现并紧挨着顶部（每个之间的水平间距为 20 像素左右）。

用自动布局、约束和大小类做这样的事情的方法是什么？我是否以编程方式删除并重新添加约束？只是从整体的角度很好奇如何实现这样的目标。

谢谢！

Answer 1

可以使用NSLayoutConstraint的优先级

Auto Layout 设置具有更高约束优先级的视图。

肖像

将方形视图的前导和顶部空间约束的优先级设置为低值（750 或低于 1000）。默认优先级值为 1000。

在 Interface Builder 中，您可以在 Attribute Inspector 中设置优先级。

横向

在代码中为横向模式创建约束。

约束应该比肖像具有更高的优先级。将约束保留在数组中，并在 UIViewController 的 viewWillLayoutSubviews 方法中添加或删除约束。

下面的测试代码。

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *view1; // square 1
@property (weak, nonatomic) IBOutlet UIView *view2; // square 2
@property (weak, nonatomic) IBOutlet UIView *view3; // square 3 

@end    

@implementation ViewController{

        NSMutableArray *_constraintsList;

    }

    - (void)viewDidLoad
    {
        [super viewDidLoad];
        // Do any additional setup after loading the view, typically from a nib.


        _constraintsList = [NSMutableArray new];


        // constraints for Landscape mode  
        // this constraints has 1000 priority. (default value) 
        // please modify offset value (20 or 40) to match your case. 

        NSDictionary *views = @{@"view1": self.view1, @"view2": self.view2,@"view3": self.view3};

        [_constraintsList addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[view1]-20-[view2]-20-[view3]"
                                                                                      options:0 metrics:nil
                                                                                        views:views]];
        [_constraintsList addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-40-[view2]" options:0 metrics:nil views:views]];


         [_constraintsList addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-40-[view3]" options:0 metrics:nil views:views]];


    }



    -(void)viewWillLayoutSubviews{

        [super viewWillLayoutSubviews];


        UIInterfaceOrientation currentOrientation = [UIApplication sharedApplication].statusBarOrientation;

        if(currentOrientation == UIInterfaceOrientationPortrait){

            // in portrait mode. 
            // new constraints is not necessary. 
            [self.view removeConstraints:_constraintsList];


        }else if(currentOrientation == UIInterfaceOrientationLandscapeLeft){

            // for landscape mode
            // add new constraints. then auto layout adjust view to fit new higher constraints 
            [self.view addConstraints:_constraintsList];


        }

    }