sb约束之UiScrollView内部控件约束

学 Autolayout,当涉及到 ScrollView 时,很多人面对满屏幕红色错误不知所措,为什么明明以前没问题的约束到了这儿就成了错误。

比如下面这种情况:

001.png

一个蓝色的 UIView,设其长宽约束分别为 210,200。上、左和右间距为 55。如此设置这个 View 的位置就被确定了。没有错误,没有警告。

可同样的方法,到 UIScrollView 却有触目惊心的红色错误:

002.png

可以看到 Storyboard 错误提示:ScrollView has ambiguous scrollable content height。这是怎么一回事呢?

我们知道,UIScrollView 有一个 contentSize 属性,其定义了 ScrollView 可滚动内容的大小。在以前用纯代码写的时候,我们会直接对这个属性赋值,定义其大小。但在 Autolayout 下,UIScrollView 的 contentSize 是由其内容的约束来定义的。因此,我们在 ScrollView 里面设置的约束,不仅起到布局内容的作用,同时也起到了定义 ScrollView 可滚动范围的作用。

针对上面的例子具体来说,ScrollView 知道它里面有个 View,其高度是 200,距离顶上为 55,但仅通过这两个约束没办法知道它的 contentSize 的高度是多少,我们缺少一个定义 View 到 ScrollView 底部距离的约束。

003.png

我们添加这样的一个约束,值为 55。注意这里看着有点怪,这个约束看着很长,但其实它的值并不大。

004.png

通过这个约束,ScrollView 现在可以得到其 contentSize 的高度了,即从顶端开始到 View 的间距 55,View 的高度 200,View 到底端间距 55。contentSize 的高也就是这些值的合:310。

另外要提的是,在这里我们给了 View 一个很明确的高度约束(200)。缺少这个约束,ScrollView 是无法得到 contentSize 的。但对于某些控件,例如 UILabel,UIImageView,它们的尺寸是可以通过其内容决定的。

005.png

这种情况下,我们只需要上下左右的约束即可。但有时,他们的内容是运行时决定的,比如 UIImageView,如果它的图片是运行时动态从服务器下载的,那么我们就会放一个空的 UIImageView,不包含所显示的图片。可惜,这么做,错误又来了。

006.png

由于未定义显示的图片,因此该 ImageView 的尺寸无法确定,所以 storyboard 傻傻地又抛出了错误。

那么除了随便放上一张图片以外,还有没有其他更正常的办法?

我们可以用一个临时的占位尺寸来告诉 storyboard,在你这里就按照这个尺寸走。这个占位尺寸仅在 storyboard 设计阶段有效,不会影响到运行时的尺寸。
通过修改 Intrinsic Size 为 Placeholder,现在错误没了。

007.png

Autolayout 的使用是个熟能生巧的过程,相信每个人在一开始试着使用时,都会遇到满屏警告的情况。通过多实践,这种情况会慢慢得到改善最终避免出现。当你啪啪啪设置好约束,然后按一下 alt+cmd+= 后看着控件完全按照你想的样式去布局,也是蛮爽的。

转载自:http://www.cocoachina.com/ios/20141118/10242.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值