XIB中UIScrollView的自动布局
使用场景我们在使用XIB或者StoryBoard的时候 经常会使用到UIScrollView ,但是如果想使用XIb 进行UIScrollView自动布局(AutoLayout)复杂 ,因为scrollview本身contentSize、contentInsets等复杂的特性导致
让我们来看下 在XIB中UIScrollView的自动布局的几种方法
效果
这里我们以竖屏为例
1 . 第一步 --> ScrollView
新创建一个项目 ,拖动一个UIScrollView到StoryBoard中 并给ScrollView添加约束
1-拖动一个ScrollView
1-给ScrollView添加相对于SuperView的约束
2 . 第二步 -->Contain View
在拖动一个View(将其命名为Contain VIew)到ScrollView上,然后添加上下左右的约束
注意:这个 ScrollView就是根据这个Contain View 来确定ContentSize的大小的
2-添加Contain View约束
特别提醒:添加完 Contain View的约束后~Xcode 会报错 暂时先别管
根据横竖屏 设置Contain View的额外约束
我们需要先确定 我们ScrollView是横屏滚动还是竖屏滚动
如果 横竖屏都需要滚动的话 就不需要添加下面的约束
a .横屏滚动
3-根据横竖屏 添加Contain View的额外约束条件
3 . 设置Contain View的高度(如果是横屏的就要设置宽度)
通过设置Contain View的宽度来确定 ScrollView 的高度
如果想动态设置ScrollView的高度,我们可以将这个高度的约束 拉出去~然后该成属性
然后在修改
4-ContainView的高度约束
4.如果是确定的宽度 可以在updateViewConstraints方法中修改,也可以在别的地方修改
//更新约束- (void)updateViewConstraints{ [superupdateViewConstraints];//设置ContentSize为3个屏幕的宽度self.ViewHeight.constant=CGRectGetHeight([UIScreenmainScreen].bounds)*3;}
3.第三步 -->添加Contain View内的UI控件
现在就可以 竖直滚动了 只是ScrollView里面没有元素而已 有的就是 一个 Contain View的宽高的 空间
所以我们现在要做的就是 向一个View(Contain View)中添加 内容
3-为需要添加的三个视图 添加约束
然而的上面的约束 并没有 设置 三个View的高度
我们可以 添加通过代码 手动设置 这几个视图的高度
添加视图高度的约束
通过代码设置 这几个视图的高度
//更新约束- (void)updateViewConstraints{ [superupdateViewConstraints];//设置ContentSize为3个屏幕的宽度self.ViewHeight.constant=CGRectGetHeight([UIScreenmainScreen].bounds)*3;//第二个视图top距离SuperView的距离 也就是第一个视图的高度self.secondViewTop.constant=CGRectGetHeight([UIScreenmainScreen].bounds);//第三个视图top 距离SuperView的距离 也就是第二个视图的高度self.threeViewTop.constant=CGRectGetHeight([UIScreenmainScreen].bounds)*2;//第三个视图的高度= ContentSize.height(self.ViewHeight.constant)-(self.threeViewTop.constant)}