Autolayout与UIScrollView

在iOS开发中的Autolayout比较盛行时,需要掌握一些自动布局的技巧。其中属ScrollView的自动布局比较复杂。如下,在正常的View进行如下的布局,没有一点错误,非常的正常。

Autolayout与UIScrollView_第1张图片
View中对View的Autolayout

但是看看在ScrollView中对View同样的布局(如下),可以看到明晃晃的错误信息,他提示的错误信息是ScrollView has ambiguous scrollable content height,主要原因是因为ScrollView中有一个ContentSize(可滚动的范围大小),所以在布局的时候也需要考虑,亦对view做的约束也承担着确定ContentSize的大小。

Autolayout与UIScrollView_第2张图片
ScrollView错误的布局

补齐约束,如下,增加一个到bottom约束(确定ContentSize的height),横向的ContentSize.Width = 67 + 240 + 68
ContentSize.Height = 164 + 150 + 80
你一定会吃惊为什么到bottom才80,为什么看着那么长,不用介意,这只是为了确定ContentSize的Height。

Autolayout与UIScrollView_第3张图片
ScrollView中补齐约束后的约束图

当然除了View在ScrollView中,还有很多控件是需要在运行时候才能确定控件的大小的,如UILable和UIImageView。比如UIImageView可以用图片来确定ImageView的width和height大小

Autolayout与UIScrollView_第4张图片
图片确定width和height

但是有些时候图片是从后台下载回来的,我们不能在designed的时候就知道它的大小,所有此时需要用一个占位size,苹果也为我们提供了方法,在Intrinsic Size中设置,选择PlaceHoder。它仅仅只是在设计的时候给一个大小,而运行时才真正确定实际大小

Autolayout与UIScrollView_第5张图片
占位大小-设计

使用占位的UIImageview


Autolayout与UIScrollView_第6张图片
使用了占位size的UIImageview

对于Autolayout的使用,都是在实践中慢慢的熟练起来的,打开Xcode多练习几次就好。

你可能感兴趣的:(Autolayout与UIScrollView)