我在自动布局滚动视图中的约束有什么问题？

Question

我在尝试修复滚动视图的自动布局时遇到了非常困难的情况。我确保在 scrollView 下有一个内容视图，并使内容视图与 mainView 具有相同的宽度和高度。但是当我运行应用程序时，只出现主视图（superview）。为了更好地说明我的情况，我有以下截图：

Answer 1

这就是我在代码中的做法：

ViewController.h

@interface ViewController : UIViewController

@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, strong) UIView *contentView;
@property (nonatomic, strong) UILabel *toolBoxView;

@end

ViewController.m

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

    [self initViews];
    [self initConstraints];
}

-(void)viewWillLayoutSubviews
{
    // ------------------------------------------------------------
    // This line is required to prevent text label from
    // forcing scrollView to be horizontally format
    // ------------------------------------------------------------
    self.toolBoxView.preferredMaxLayoutWidth = self.view.bounds.size.width - 40.0;
}

-(void)initViews
{
    self.scrollView = [[UIScrollView alloc] init];
    self.scrollView.layer.borderColor = [UIColor redColor].CGColor;
    self.scrollView.layer.borderWidth = 1.0;

    self.contentView = [[UIView alloc] init];
    self.contentView.layer.borderColor = [UIColor blueColor].CGColor;
    self.contentView.layer.borderWidth = 1.0;

    self.toolBoxView = [[UILabel alloc] init];
    self.toolBoxView.layer.borderColor = [UIColor greenColor].CGColor;
    self.toolBoxView.layer.borderWidth = 1.0;
    self.toolBoxView.textColor = [UIColor blackColor];
    self.toolBoxView.text = @"This is the toolbox view. Which resides within the contentView of a UIScrollView. The scrollView will adjust to fit the content of the text within this toolBoxView. Feel free to change this text as you see fit\n\nThis is the toolbox view. Which resides within the contentView of a UIScrollView. The scrollView will adjust to fit the content of the text within this toolBoxView. Feel free to change this text as you see fit\n\nThis is the toolbox view. Which resides within the contentView of a UIScrollView. The scrollView will adjust to fit the content of the text within this toolBoxView. Feel free to change this text as you see fit\n\nThis is the toolbox view. Which resides within the contentView of a UIScrollView. The scrollView will adjust to fit the content of the text within this toolBoxView. Feel free to change this text as you see fit\n\n";
    self.toolBoxView.numberOfLines = 0;
    self.toolBoxView.lineBreakMode = NSLineBreakByWordWrapping;



    [self.contentView addSubview:self.toolBoxView];
    [self.scrollView addSubview:self.contentView];

    [self.view addSubview:self.scrollView];
}

-(void)initConstraints
{
    self.scrollView.translatesAutoresizingMaskIntoConstraints = NO;
    self.contentView.translatesAutoresizingMaskIntoConstraints = NO;
    self.toolBoxView.translatesAutoresizingMaskIntoConstraints = NO;

    id views = @{
                 @"scrollView": self.scrollView,
                 @"contentView": self.contentView,
                 @"toolBoxView": self.toolBoxView
                 };

    // scrollView constraints

    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[scrollView]|" options:0 metrics:nil views:views]];

    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[scrollView]|" options:0 metrics:nil views:views]];



    // contentView constraints (need to pin to all four sides of scrollView)

    [self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[contentView]-10-|" options:0 metrics:nil views:views]];
    [self.scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[contentView]-10-|" options:0 metrics:nil views:views]];


    // toolBoxView constraints

    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[toolBoxView]-10-|" options:0 metrics:nil views:views]];
    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[toolBoxView]-10-|" options:0 metrics:nil views:views]];
}

这是我得到的：

真正奇怪的是，为什么 Xcode 没有说有自动布局冲突，因为如果你看我上面的代码，我已经将 scrollView 的四个边缘固定到 viewController 的视图但同时，contentView 被强烈固定到scrollView 和 toolBoxView 的所有四个边缘也强烈固定到 contentView 的边缘。理论上，如果 toolBoxView 比 scrollView 短或高，就会导致冲突。

我猜这就是 UIScrollView 在自动布局中的工作原理。

如果我改变：

V:|[scrollView]|

到

V:|[scrollView]

我只看到一个空白的白页（即您所说的“仅显示主视图”）。

希望我写的上面的约束可以帮助你调试你的 Interface Builder 约束，也许你可以把你的和我的比较一下。

希望对您有所帮助。