您的位置:首页 > 产品设计 > UI/UE

UIScrollView 和自动布局结合

2015-10-27 16:06 651 查看
自动布局往往能带来效率的提高,可以节省很多编码工作(通过代码来调整位置),但是如果单个界面上的控件太多,或者控件之间的距离需要动态改变,这个时候自动布局就有点力不从心了。另外自动布局和 UIScrollView 的结合也是比较麻烦,但是不用又不行,所以问题还是得 解决。

UIS crollView 的大小是根据其子视图的大小决定的,我尝试在 ViewDidLoad 中通过设置 contentSize 来动态修改 ScrollView 的大小以及子视图的大小,但是在自动布局下,这些操作是无效的。

我的步骤如下:

1.Xcode 中创建一个项目,拖拽一个ScrollView到故事板中,如下图



2. 选中ScrollView,在 Pin 中添加约束,注意如果需要以屏幕为基准,则需要取消勾选Constrain to Margins添加约束,其他默认。



3. 拖拽一个View到ScrollView上, 然后添加上下左右四周约束,和 ScrollView 的约束一样。



4.添加完之后, Xcode 提示的错误我们可以暂时不理会



5. 我们先确定一下, 我们是需要水平方向的滚动还是竖直方向的滚动,或者水平方向和竖直方向都需要滚动。

a.水平方向和竖直方向都需要滚动的话, 不用添加

b.水平方向滚动需要添加下面一个约束



c.竖直方向需要添加下面一个约束



6.我们以水平方向滚动为例, 我们需要确定我们想要的宽度, 添加一个固定的宽度的约束。



7.我们以动态修改 View 的宽度为例(它的改变会自动撑大 ScrollView 的大小),给它的宽度约束建立输出口。



8. 通过updateViewConstraints设置 View 的宽度

- (void)updateViewConstraints {
[super updateViewConstraints];
self.viewWidth.constant = [UIScreen mainScreen].applicationFrame.size.width-10;//始终比屏幕宽度小10
}


这样,SCrollView 的大小就可以动态改变,如果是多个子视图,那么这些子试图的宽度都需要进行建立输出口,它们的值也须一样。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: