XIB中绘制ScrollView相比于其他的空间的绘制,会比较难控制一点.
一个难点是scrollView的SubView的约束难以琢磨
还有一个是如何在XIB设置scrollView的ContentSize
经常一个设置不注意,显示就千差万别.
现在就开始描述正确设置ScrollView具体步骤吧:
1.添加ScrollView.设置其约束如下:
C87022F1-5502-4AA1-823C-05102DDCE401.png
2.添加StackView在ScrollView.设置其约束如下:
625494EA-B671-4838-B6EE-50DC267B1A99.png
3.由于ScrollView的ContentSize在XIB中是根据其SubView计算的,所以还要对stackView进行如下设置:
4E6DFE0A-CA83-46D1-9DB6-EC38DABD35F3.png
把equal withd 与equal height都点上
4.这里有一个关键点,这里的withd 与height都是设置ContentSize的,比如我想设置横向滑动全屏图片的scrollView,纵向不滑动,那么这里应该这样设置:
2E0456F0-F91B-48A2-8BF3-D64171959D73.png
multplier设置为4:1 即contentSize.x为屏幕的4背,height的multplier不变为1:1
5.在stackView中填充4张imageView,设置stackView的distribution为fill equally,讲第一张图片添加一个纵向的约束(如果需要下拉,需添加横向约束,如果都需要,则不需要添加约束):
CDF02BAD-D11B-4A13-AB97-701B24426A40.png
6.最后添加图片,run...成功设置好约束:
5DE4A8D5-FBBE-4891-A8DB-5C7594811774.png
网友评论