IOS开发—UIScrollView自动布局

由于scrollview本身contentSize、contentInsets等复杂的特性,导致其在自动布局的时候和普通视图有较大差别。对scrollview进行自动布局,需要自制一个contentView作为scrollView的滚动容器。下面介绍在IB下对scrollView进行自动布局的步骤:

一、在xib或storyBoard中创建好基本视图控制器界面(这一步不说)

二、布局scrollView

拖拽一个scrollView到界面中,并设定好自己想要的区域,固定上下左右:

三、布局contentView

再拖出一个view(根据情况而定,可能这个页面用来显示纯文本,那么只需要拖出一个label就可以了)作为scrllView的子视图。这个view将作为scrollView的contentView,用来确定scrollView的展示内容。首先对contentView的上下左右进行固定:

完后发现会报错,说contentView的长宽未知。对于普通视图,固定了上下左右间隔之后自然不需要再设置长宽了,为什么还会报错呢?这就是scrollView的与众不同之处了。contentView作为scrollView的内容内容,对其固定上下左右的间隔,事实上只起到设置内容视图与边缘间距的作用,仅仅是这个作用,代码上和设置contentInsets的作用是一样的!因此并不能识别contentView的长宽。苹果对scrollView的这一步操作做了特殊处理。因此接下来,我们就要设置contentView的长宽了。

四、设置参考视图

对于contentView,我们必需要对其长宽进行约束,事实上在代码中我们也会对contentSize进行设置,一样的作用。然而设置长宽的时候如果不想固定死,就需要一个参考视图来确定长宽了,因为做不到通过scrollView来确定它的长宽。因此这个时候再拖出一个view作为参考视图,并对其自动布局:

五、设置contentView长宽

根据参考视图,对contentView的长宽进行自动布局。可以设置两者的宽度相等,高度想要动态变化的话,就先设置一个值,并固定高度,然后拖出高度约束到代码中,通过代码动态改变contentView的高度,也就是scrollView的滚动高度:

前期准备已完毕,可以一展宏图啦!

接下来的所有控件都在contentView上布局,操作方法就跟普通视图一样啦!

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-09 23:28:26

IOS开发—UIScrollView自动布局的相关文章

IOS开发之自动布局显示网络请求内容

在上一篇博客中详细的介绍了IOS开发中的相对布局和绝对布局,随着手机屏幕尺寸的改变,在App开发中为了适应不同尺寸的手机屏幕,用自动布局来完成我们想要实现的功能和效果显得尤为重要.本人更喜欢使用相对布局.在下面要学习的例子中暂且先用我们的StoryBoard来设置我们组件的约束,以后会在代码中给我们的元素新建约束.iPhone4,5和将要发布的iPhone6的屏幕的大小都不一样,所以屏幕的适配是我们搞App开发必须要考虑的问题. 我们要完成一个什么例子呢,先上两张程序运行最终的结果图,之后看着图

iOS开发UIScrollView的底层实现

起始 做开发也有一段时间了,经历了第一次完成项目的激动,也经历了天天调用系统的API的枯燥,于是就有了探索底层实现的想法. 关于scrollView的思考 在iOS开发中我们会大量用到scrollView这个控件,我们使用的tableView/collectionview/textView都继承自它.scrollView的频繁使用让我对它的底层实现产生了兴趣,它到底是如何工作的?如何实现一个scrollView?读完本篇博客,相信你一定也可以自己实现一个简易的scrollView. 我们首先来思

IOS开发之自动布局框架设计(二)

[上集剧情概要:上集我们主要剖析了原生的NSLayoutConstraint实现自动布局的方式,我们知道是通过constraintWithItem这个初始化的方法来配备所需要的7个参数,然后通过addConstraint方法将布局添加进去,并且定义了 NSLayoutAttribute,NSLayoutRelation这些枚举] 如果我们自己设计一款布局框架可以怎么设计呢? 1.封装原有的NSLayoutConstraint类,可以将代码的实现更加简洁化.例如:Masonry,SDAutoLay

iOS开发-UIScrollView原理

转载:http://www.cnblogs.com/xiaofeixiang/p/5144256.html UIScrollView 在开发中是不可避免,关于UIScrollView都有自己一定的理解.滚动视图有两个需要理解的属性,frame和bounds,frame是定义了视 图在窗口的大小和位置,bounds表示视图在其自身坐标系中的位置和大小,frame影响视图在窗口位置,bounds会影响子视图的位置. 先来看一张图片: 我们用一个父View将整个窗口铺满,然后添加子视图: UIView

iOS开发—UIScrollView

(1)移动设备的屏幕?大?小是极其有限的,因此直接展?示在?用户眼前的内容也相当有限 (2)当展?示的内容较多,超出?一个屏幕时,?用户可通过滚动?手势来查看屏幕以外的内容 (3)普通的UIView不具备滚动功能,不能显?示过多的内容 (4)UIScrollView是一个能够滚动的视图控件,可以?用来展?示?大量的内容,并且可以通过滚 动查看所有的内容 (5)  举例:手机上的“设置”.其他?示例程序 2.UIScrollView的简单使用 (1)将需要展?的内容添加到UIScrollView中

IOS开发之自动布局相关问题

有疑问的请加qq交流群:390438081 我的QQ:604886384(注明来意) 微信:niuting823 分为3种: 注意: 如果使用autolayout来约束控件, 那fraem就失效了, 官方也不建议我们再设置frame了 1. 代码布局    :功能强大  繁琐 2.AutoResizing:功能有限  使用 简单 3.Auto Layout:简单 易用 1.代码布局 1.使用代码为控件添加约束 1)什么时候用? 当子视图对象使用代码创建时,需要为子视图布局则只能使用代码完成 1.

iOS开发 UIScrollView制作APP引导页

http://jingyan.baidu.com/article/4dc40848a341dfc8d846f152.html 听语音 | 浏览:4606 | 更新:2015-02-10 12:14 | 标签:制作 1 2 3 4 5 6 7 分步阅读 一键约师傅 百度师傅最快的到家服务,最优质的电脑清灰! 应用程序APP一般都有引导页,引导页可以作为操作指南指导用户熟悉使用:也可以展现给用户,让用户了解APP的功能作用.引导页制作简单,一般只需要一组图片,再把图片组展现出来就可以了.展示图片组常

IOS开发之自动布局框架设计(四)

[上集剧情概要:上集我们主要实现了一个完整的自动布局的框架,这集我们主要研究下比较流行的开源布局框架Masonry的布局思路] 我们先来看看是如何开始使用Masonry的,一般我们使用这个布局框架的时候,都会调用以下代码..... [self.view1 mas_makeConstraints:^(MASConstraintMaker *make) { make.left.mas_equalTo(50); make.right.mas_equalTo(-50); make.top.mas_equ

iOS开发UIScrollView常见属性和方法

一.ScrollView常用方法和属性 @property(nonatomic)CGPoint contentOffset; 设置滚动的偏移量 @property(nonatomic)CGSize contentSize; 设置滑动区域 @property(nonatomic,assign) id<UIScrollViewDelegate>      delegate; 设置UIScrollView的代理 @property(nonatomic,getter=isDirectionalLock