ios - 不同方向的不同自动布局约束集

Question

我见过类似的post但这与我的情况不太接近

所以我对不同的方向有不同的屏幕布局。应用程序正在使用 Storyboard。为了更好地理解我附上 UI 草图的照片

正如您所看到的，有一个 TableView 和一个工具栏(自定义的)。工具栏包含 2 个标签和一个按钮。

所以纵向限制是:

• 工具栏高度 80pts
• 工具栏尾随和前导空格 == 0
• TableView 距导航栏的顶部空间 == 0
• TableView 距工具栏的底部空间 = 0
• Tableview 的宽度 == 工具栏宽度
• 标签在工具栏中垂直居中，具有固定大小和固定左右距离
• 按钮具有固定大小并在工具栏内居中

景观限制完全不同:

• 工具栏宽度 80pts
• 工具栏顶部(来自导航栏)和底部空间 == 0
• 工具栏尾随空格 == 0
• TableView 的前导空格 == 0
• TableView 的工具栏尾部空格 = 0
• Tableview 的高度 == 工具栏宽度
• 标签在工具栏中水平居中，具有固定大小以及距顶部和底部的固定距离
• 按钮具有固定大小并在工具栏内居中

我尝试从 Storyboard 中删除所有约束并以编程方式添加它们。但 Xcode 在编译过程中会自动添加它们。我尝试删除 Root View 内的所有约束，但可能我没有正确浏览所有 View 树，因为有几个约束未删除。

您知道如何以正确的方式实现这一点吗？

这是我第一次使用自动布局，它并不像我想象的那么容易。

这里我的解决方案不起作用(因为 Xcode 在编译过程中添加了一些约束)

// Those properties store all constraints for portrait and landscape modes
@property (nonatomic, strong) NSArray *portraitConstraints;
@property (nonatomic, strong) NSArray *landscapeConstraints;

-(void)updateViewConstraints {
    [super updateViewConstraints];

    BOOL layoutIsPortrait = UIDeviceOrientationIsPortrait(self.interfaceOrientation);

    if (layoutIsPortrait) {
        for (NSLayoutConstraint *constraint in self.landscapeConstraints)
            [constraint remove];

        for (NSLayoutConstraint *constraint in self.portraitConstraints)
            [constraint install];
    } else {
        for (NSLayoutConstraint *constraint in self.portraitConstraints)
            [constraint remove];

        for (NSLayoutConstraint *constraint in self.landscapeConstraints)
            [constraint install];
    }

}

- (NSArray *)portraitConstraints {
    if (!_portraitConstraints) {
        UIView *mainTable = self.myTableView;
        UIView *toolbar = self.toolbarView;
        UIView *firstLabel = self.firstLabel;
        UIView *secondLabel = self.secondLabel;
        UIView *bigButton = self.bigButton;
        UIView *navBar = self.navigationController.navigationBar;

        NSDictionary *views = NSDictionaryOfVariableBindings(mainTable,toolbar,firstLabel,secondLabel,bigButton,navBar);

        NSMutableArray *constraints = [NSMutableArray array];
        [constraints addObjectsFromArray:[NSLayoutConstraint
                                          constraintsWithVisualFormat:@"V:[toolbar(==80)]|"
                                          options:0
                                          metrics:nil
                                          views:views]];
        [constraints addObjectsFromArray:[NSLayoutConstraint
                                          constraintsWithVisualFormat:@"V:[navBar][mainTable][toolbar]|"
                                          options:0
                                          metrics:nil
                                          views:views]];
        // MORE AND MORE CONSTRAINTS ADDED HERE

        _portraitConstraints = constraints;
    }
    return _portraitConstraints;
}

Answer 1

您使用的方法当然是可能的，但需要相当多的代码才能获得您正在寻找的布局。一种更简单的方法是删除 Storyboard中 Controller 的 View (如果需要，可以将其复制并粘贴到 xib 文件中)，然后在 xib 文件中制作其 View (纵向和横向各一个)。您可以在那里完成所有约束设置，并且只需在代码中的两个 View 之间切换。您可以在一个 xib 文件中创建两个 View - 我首先创建了肖像 View ，因此它将是您从加载 Nib 返回的数组中的第一个对象。

@interface ViewController ()
@property (strong,nonatomic) UIView *pView;;
@property (strong,nonatomic) UIView *lView;
@property (strong,nonatomic) UILabel *leftLabel;
@property (strong,nonatomic) UILabel *rightLabel;
@end

@implementation ViewController

- (void)loadView {
    NSArray *views = [[NSBundle mainBundle] loadNibNamed:@"PortraitAndLandscapeViews" owner:self options:nil];
    self.pView = views[0];
    self.lView = views[1];
    self.view = self.pView;
}



-(void)viewWillLayoutSubviews {
    BOOL layoutIsPortrait = UIDeviceOrientationIsPortrait(self.interfaceOrientation);
    if (layoutIsPortrait) {
        self.view = self.pView;
        self.leftLabel = [self.view viewWithTag:11];
        self.rightLabel = [self.view viewWithTag:12];
    }else{
        self.view = self.lView;
        self.leftLabel = [self.view viewWithTag:21];
        self.rightLabel = [self.view viewWithTag:22];
    }
}