UIScrollView 的 contentView 的高度基于使用 Storyboard 的内部内容答案

【问题标题】：Height of contentView of UIScrollView based on inside content using StoryboardUIScrollView 的 contentView 的高度基于使用 Storyboard 的内部内容
【发布时间】：2016-11-23 22:02:46
【问题描述】：

我实际上面临着仅使用 故事板约束 使我的 UIScrollView 完全响应的困难。

这是我的层次结构：

> - UIViewController
>  - UIView
>   - UIScrollView
>    - contentView
>     - module1View
>     - module2View
>     - module3View

所有模块都用于显示图表。 我希望他们反应灵敏。我希望它们的宽度为屏幕的 100%，并且它们的高度由使用约束添加的 ratio 定义。这些模块彼此相邻显示，就像新闻源中的新闻一样。

我的问题是：如何设置contentView 高度等于所有模块的总和（模块 1 + 2 + 3）？

也就是说我想实现：

contentView 顶部 = 模块 1 顶部

模块 2 的顶部 = 模块 1 的底部

模块 2 的顶部 = 模块 2 的底部

contentView 底部 = 模块 3 底部

为了做到这一点，我遵循了一些在互联网上找到的教程。以下是我遵循的步骤：

设置UIScrollView 约束以定义其位置和位置。
将UIScrollViewtop、bottom、left和right间距设置为与最近的邻居0.
设置模块之间的约束，将它们“堆叠”在一个其他。
(I'M BLOCKED HERE) 将contentView 的底部设置为模块 3 的底部允许 UIScrollview 滚动到末尾内容。

我试图强制UIScrollView 的高度：它有效，但没有响应。由于模块的高度是通过比例计算的，根据设备的不同，高度“模块1+2+3”同时变化。

我尝试将模块 3 的约束添加到 contentView 以设置模块 3 的底部 = contentView 的底部。所有的约束都变成红色，到处都是警告。

您知道如何根据响应式内容设置contentView 的高度吗？（例如“以某种方式包装内容）。

提前感谢您的帮助！

【问题讨论】：

一旦你根据它们的比例设置模块的高度，你应该能够计算 contentView 的高度
我尝试在 ViewDidLoad 和 viewWillAppear 中添加：mainContentView.frame = CGRectMake(0, 0, self.view.width, module1View.height+module2View.height+module3View.height);，它们都不起作用
什么时候设置模块的框架？设置模块框架后，您需要设置 mainContentView 框架...模块是什么类型的对象？

标签： ios objective-c uiscrollview xcode-storyboard

【解决方案1】：

我已经能够通过以下步骤完全从情节提要中获得动态滚动视图，无需代码：

1) 在情节提要中，添加一个滚动视图并将其边缘约束到主视图的边缘或以任何合适的方式

2) 在滚动视图中，添加一个普通的旧 UIView 作为容器。将其约束到滚动视图的所有 4 个边缘，但还要添加相对于滚动视图的等宽约束，以及向滚动视图添加等高约束

3) 非常重要：为等高约束设置低优先级，例如250.

4) 在您在第 2 步中添加的容器视图中，添加您的 3 个模块。将第一个模块的顶部边缘约束到容器视图的顶部，将最后一个模块的底部边缘约束到容器视图的底部，并将所有中间模块约束到链中的前一个模块。这应该会在容器视图中为您提供完整的垂直约束链。您还需要为每个模块添加任何适当的 x 定位/宽度设置约束。

5) 构建并运行！您的滚动视图内容大小应该自动等于所有模块的总高度加上它们之间的间距，并且动态更改模块内容将通过自动布局更新滚动视图内容大小，而不需要显式代码来计算和更新。

【讨论】：

等高约束的低优先级成功了！非常感谢！
我使用 Scrollview 有一段时间了，但不知道第 3 点。非常感谢。
这个解决方案不能直接为我工作，我必须将内容视图约束设置为 ScrollView 的父级，而不是直接设置为 ScrollView。详情请查看我的回答。
天哪，这太不可思议了！谢谢！
我见过的关于堆栈溢出的最佳解决方案之一 :-)

【解决方案2】：

对我来说，Daniel 的解决方案非常有帮助，但没有奏效。以下是更新的步骤：

1) 在故事板中，添加一个滚动视图并将其边缘约束到主视图的边缘或以任何合适的方式

2) 在滚动视图中，添加一个普通的旧 UIView 作为容器。将其约束到滚动视图的所有 4 个边缘，但还要添加相对于滚动视图的父（最高视图）的等宽约束，以及对滚动视图的父等高约束强>

3) 非常重要：为等高约束设置低优先级，例如250.

【讨论】：

【解决方案3】：

尝试定义模块运行时的高度并以编程方式为模块添加自动布局约束。

 #define kDeviceHeight                   [UIScreen mainScreen].bounds.size.height
 #define kDeviceWidth                    [UIScreen mainScreen].bounds.size.width

    - (void)viewDidLoad {

        [super viewDidLoad];
        [self setScrollViewHeight];

    }

    -(void)setScrollViewHeight{

        float module1_Height,module2_Height,module3_Height;// Calculate the height of modules over here and assign it to respective variables
        float viewVerticalSpacing = 5; // Provides space between two views
        float YAxis = 0;
        module1View.frame = CGRectMake(0, 0, kDeviceWidth, module1_Height);

        YAxis = YAxis + module1_Height + viewVerticalSpacing;
        module2View.frame = CGRectMake(0, YAxis, kDeviceWidth, module2_Height);

        YAxis = YAxis + module2_Height + viewVerticalSpacing;
        module3View.frame = CGRectMake(0, YAxis, kDeviceWidth, module3_Height);

        float scrollView_height = YAxis + module3_Height + viewVerticalSpacing;
        scroll_view.contentSize = CGSizeMake(kDeviceWidth, scrollView_height);
        scroll_view.frame = CGRectMake(0, 0, kDeviceWidth, kDeviceHeight);
    }

【讨论】：

【解决方案4】：

我的工作是通过不将内容视图的高度设置为任何值来实现的。

【讨论】：

【解决方案5】：

对我来说，推荐的解决方案不起作用。我不得不稍微修改一下：

执行推荐解决方案中的所有步骤。
将 ScrollView 高度设置为 0 并给予低优先级。
将 scrollView 父级的 bottom-space-constraint 设置为低优先级。

我认为我的解决方案只有在滚动视图的父视图不是根内容视图时才有效。

【讨论】：