iOS的自动布局用的UIScrollView：为什么滚动视图的内容视图不填滚动视图？ [英] iOS Autolayout with UIScrollview: Why does content view of scroll view not fill the scroll view?

问题描述

以下code（称为viewDidLoad中），结果在一个完全红屏。我希望它是一个完全绿色的屏幕。为什么是红色的？我怎样才能让这一切绿色的？

 的UIScrollView滚动视图* = [UIScrollView的新]
scrollView.translatesAutoresizingMaskIntoConstraints = NO;
scrollView.backgroundColor =的UIColor redColor]
[self.view addSubview：滚动视图]。UIView的*内容查看= [UIView的新]
contentView.translatesAutoresizingMaskIntoConstraints = NO;
contentView.backgroundColor =的UIColor绿彩];
[滚动视图addSubview：内容查看]。*的NSDictionary = viewDict NSDictionaryOfVariableBindings（滚动视图，内容查看）;[self.view addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@H：| [滚动视图] |选项​​：0的指标：0浏览：viewDict]];
[self.view addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@V：| [滚动视图] |选项​​：0的指标：0浏览：viewDict]];[滚动视图addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@H：| [内容查看] |选项​​：0的指标：0浏览：viewDict]];
[滚动视图addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@V：| [内容查看] |选项​​：0的指标：0浏览：viewDict]];
 

解决方案

与滚动的意见约束运作方式稍有不同与其他的看法一样。之间的约束内容查看和上海华（即滚动视图 ）是对的 contentSize 滚动视图，而不是它的架。这似乎令人困惑，但它实际上是非常有用的，这意味着你永远不会有调整 contentSize ，而在 contentSize 会自动调整以适应您的内容。此行为技术说明TN2154 描述。

如果您要定义内容查看尺寸到屏幕或类似的东西，你必须添加之间的约束内容查看键，主视图，例如。这是无可否认的是对立的把内容放到滚动视图，所以我可能不会建议一点，但它可以做到的。

---

要说明这个概念，即内容查看的大小由内容驱动的，而不是由边界的滚动视图，一个标签添加到您的内容查看：

 的UIScrollView滚动视图* = [UIScrollView的新]
scrollView.translatesAutoresizingMaskIntoConstraints = NO;
scrollView.backgroundColor =的UIColor redColor]
[self.view addSubview：滚动视图]。UIView的*内容查看= [UIView的新]
contentView.translatesAutoresizingMaskIntoConstraints = NO;
contentView.backgroundColor =的UIColor绿彩];
[滚动视图addSubview：内容查看]。*的UILabel = randomLabel [的UILabel的alloc]初始化];
randomLabel.text = @这是一个测试;
randomLabel.translatesAutoresizingMaskIntoConstraints = NO;
randomLabel.backgroundColor =的UIColor clearColor]
[内容查看addSubview：randomLabel];*的NSDictionary = viewDict NSDictionaryOfVariableBindings（滚动视图，内容查看，randomLabel）;[self.view addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@H：| [滚动视图] |选项​​：0的指标：0浏览：viewDict]];
[self.view addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@V：| [滚动视图] |选项​​：0的指标：0浏览：viewDict]];[滚动视图addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@H：| [内容查看] |选项​​：0的指标：0浏览：viewDict]];
[滚动视图addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@V：| [内容查看] |选项​​：0的指标：0浏览：viewDict]];[内容查看addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@H：|  -  [randomLabel]  -  |选项​​：0的指标：0浏览：viewDict]];
[内容查看addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@V：|  -  [randomLabel]  -  |选项​​：0的指标：0浏览：viewDict]];
 

现在，你会看到内容查看（和，因此， contentSize 的滚动视图）的调整，以适应标准页边距的标签。而且因为我没有指定标签的宽度/高度，将调整基于您放入该标签的文本。

---

如果你想在内容查看来也调整到主视图的宽度，你可以做重新定义 viewDict 像这样，然后添加这些附加约束条件（除所有其它的，以上）：

  UIView的* MAINVIEW = self.view;*的NSDictionary = viewDict NSDictionaryOfVariableBindings（滚动视图，内容查看，randomLabel，MAINVIEW）;[MAINVIEW addConstraints：[NSLayoutConstraint constraintsWithVisualFormat：@H：[内容查看（== MAINVIEW）选项：0的指标：0浏览：viewDict]];
 

---

有一个<一个href=\"http://stackoverflow.com/questions/13149733/ios-autolayout-issue-with-uilabels-in-a-resizing-parent-view\">known问题（？BUG）在scrollviews多行标签，如果你想让它根据文本量调整，你必须做手工的一些手法，如：

  dispatch_async（dispatch_get_main_queue（）^ {
    randomLabel preferredMaxLayoutWidth = self.view.bounds.size.width。
}）;
 

The following code (called in viewDidLoad) results in a fully red screen. I would expect it to be a fully green screen. Why is it red? And how can I make it all green?

UIScrollView* scrollView = [UIScrollView new];
scrollView.translatesAutoresizingMaskIntoConstraints = NO;
scrollView.backgroundColor = [UIColor redColor];
[self.view addSubview:scrollView];

UIView* contentView = [UIView new];
contentView.translatesAutoresizingMaskIntoConstraints = NO;
contentView.backgroundColor = [UIColor greenColor];
[scrollView addSubview:contentView];

NSDictionary* viewDict = NSDictionaryOfVariableBindings(scrollView,contentView);

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

[scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[contentView]|" options:0 metrics:0 views:viewDict]];
[scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[contentView]|" options:0 metrics:0 views:viewDict]];

解决方案

Constraints with scroll views work slightly differently than it does with other views. The constraints between of contentView and its superview (the scrollView) are to the scrollView's contentSize, not to its frame. This might seem confusing, but it is actually quite useful, meaning that you never have to adjust the contentSize, but rather the contentSize will automatically adjust to fit your content. This behavior is described in Technical Note TN2154.

If you want to define the contentView size to the screen or something like that, you'd have to add a constraint between the contentView and the main view, for example. That's, admittedly, antithetical to putting content into the scrollview, so I probably wouldn't advise that, but it can be done.

---

To illustrate this concept, that the size of contentView will be driven by its content, not by the bounds of the scrollView, add a label to your contentView:

UIScrollView* scrollView = [UIScrollView new];
scrollView.translatesAutoresizingMaskIntoConstraints = NO;
scrollView.backgroundColor = [UIColor redColor];
[self.view addSubview:scrollView];

UIView* contentView = [UIView new];
contentView.translatesAutoresizingMaskIntoConstraints = NO;
contentView.backgroundColor = [UIColor greenColor];
[scrollView addSubview:contentView];

UILabel *randomLabel = [[UILabel alloc] init];
randomLabel.text = @"this is a test";
randomLabel.translatesAutoresizingMaskIntoConstraints = NO;
randomLabel.backgroundColor = [UIColor clearColor];
[contentView addSubview:randomLabel];

NSDictionary* viewDict = NSDictionaryOfVariableBindings(scrollView, contentView, randomLabel);

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

[scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[contentView]|" options:0 metrics:0 views:viewDict]];
[scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[contentView]|" options:0 metrics:0 views:viewDict]];

[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[randomLabel]-|" options:0 metrics:0 views:viewDict]];
[contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[randomLabel]-|" options:0 metrics:0 views:viewDict]];

Now you'll see that the contentView (and, therefore, the contentSize of the scrollView) are adjusted to fit the label with standard margins. And because I didn't specify the width/height of the label, that will adjust based upon the text you put into that label.

---

If you want the contentView to also adjust to the width of the main view, you could do redefine your viewDict like so, and then add these additional constraints (in addition to all the others, above):

UIView *mainView = self.view;

NSDictionary* viewDict = NSDictionaryOfVariableBindings(scrollView, contentView, randomLabel, mainView);

[mainView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[contentView(==mainView)]" options:0 metrics:0 views:viewDict]];

---

There is a known issue (bug?) with multiline labels in scrollviews, that if you want it to resize according to the amount of text, you have to do some sleight of hand, such as:

dispatch_async(dispatch_get_main_queue(), ^{
    randomLabel.preferredMaxLayoutWidth = self.view.bounds.size.width;
});

这篇关于iOS的自动布局用的UIScrollView：为什么滚动视图的内容视图不填滚动视图？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！