【转】iOS学习之Storyboard中的UIScrollView使用自动布局

时间:2023-01-31 23:53:53

在使用storyboard和xib时,我们经常要用到ScrollView,还有自动布局AutoLayout,但是ScrollView和AutoLayout 结合使用,相对来说有点复杂。根据实践,我说一下我的理解,在故事板或xib中,ScrollView是根据其下面的一个View的大小来确定ContentSize的大小。

看一下效果

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

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

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

2. 选中ScrollView,添加约束。

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

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

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

4.添加完之后, 可能会报一个错, 如下图, 这个暂时别去管。

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

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

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

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

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

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

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

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

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

7.选中View, 更新一下Frame

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

8.如果是想要动态设置ScrollView的宽度,也就是设置View的宽度约束的值, 我们将其拉成属性, 然后修改其值。

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

9. 如果是确定的宽度, 可以在- (void)updateViewConstraints这个方法中修改,也可以在别处修改。

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

10.现在运行,就可以水平滚动了。 竖直方向的滚动和水平方向滚动的设置差不多。 我们来添加两个View, 先拖拽一个View(我设为灰色)到视图上, 然后添加约束, 如下图

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

11.再拖拽一个View, 背景颜色设为红色,设置好之后, 将frame设置到我们需要的, 我这边将X设置到600。

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

12.我们给第二个View添加约束,如下图

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

13.我们还需要设置一个约束, 就是第二个View距离SuperView的距离,就是第二个View的Leading约束

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

14.然后将这个约束Leading拉成属性,在- (void)updateViewConstraints设置他的值

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

如下图

【转】iOS学习之Storyboard中的UIScrollView使用自动布局

这样子就OK了。

自动布局需要自己去多多实践, 有很多细节需要注意的。

本文原文来自http://www.cocoachina.com/ios/20150104/10810.html

【转】iOS学习之Storyboard中的UIScrollView使用自动布局的更多相关文章

  1. [转]IOS 学习笔记(8) 滚动视图(UIScrollView)的使用方法

    下面介绍pageControl结合ScrollView实现连续滑动翻页的效果,ScrollView我们在应用开发中经常用到,以g这种翻页效果还是很好看的,如下图所示: 通过这个例子,我们重点学习UIS ...

  2. IOS学习[Swift中跳转与传值]

    Swift中页面跳转与传值: 1.简单方式 首先,Swift的跳转可分为利用xib文件跳转与storyboard跳转两种方法,我这里选择使用storyboard的界面跳转方法. 1.通过在storyb ...

  3. iOS学习之UITableView中Cell的操作

    接着iOS学习之Table View的简单使用 这篇,这里主要讲UITableView 中的Cell的操作,包括标记.移动.删除.插入. 为了简单快捷,直接从原来那篇的代码开始,代码下载地址:http ...

  4. ios UIScrolloView在storyboard中添加约束

    1.在storyboard中如果有UINavigationbar 或 UITabar 布局的时候需要在控制器中勾选掉 Under Top Bars 和 Under Bottom Bars 这两个选项. ...

  5. Storyboard中使用UIscrollView添加约束的开发总结

    第一次在项目中用storyboard做界面,一般的界面直接添加约束非常爽快 然后有个界面有scrollview,添加了约束还总是出错 刚开始使用了 wCompact,hRegular,滑动出现问题,有 ...

  6. iOS 学习 - 6.Objective-C中的各种遍历(迭代)方式

    说明:转自文顶顶 一.使用 for 循环 要遍历字典.数组或者是集合,for 循环是最简单也用的比较多的方法 -(void)iteratorWithFor { //////////处理数组////// ...

  7. iOS textFiled 在storyBoard中的使用

    step 1. 在UITableViewCotroller的xib中设置一个静态表格,在Utilities里选择属性检查器(第四个啦)设置属性,content : static cells. styl ...

  8. ios学习:swift中实现分享到微博、facebook,twitter等

    在swift中打开分享功能原来是如此的简单. 1.首先须要 import Social 2.在分享button事件以下 var controller:SLComposeViewController = ...

  9. iOS学习(项目中遇到的错误1)

    1.[AppModel copyWithZone:]: unrecognized selector sent to instance 0x7ffda9f4cf70 *** Terminating ap ...

随机推荐

  1. substring -----截取字符串

    var str = "0123456789"; substring alert(str.substring(0));------------"0123456789&quo ...

  2. Samba服务器安装及配置

    Samba最早诞生在unix操作系统上面,samba是基于SMB(Server Message Block)协议,是一种客户端服务器协议 一.安装samba # yum -y install samb ...

  3. 可进行JavaScript代码测试与调试的12个网站

    概述:JavaScript是网站前端开发最为重要的一门编程语言,本文收集了能够在线测试与调试JavaScript代码的12个网站 1.JS Bin JS bin是一个为JavaScript和CSS爱好 ...

  4. Linux crontab 命令详解(含配置文件路径)

    编辑/etc/crontab 文件配置cron cron 服务每分钟不仅要读一次/var/spool/cron内的所有文件,还需要读一次/etc/crontab,因此我们配置这个文件也能运用cron服 ...

  5. JavaScript 实现数组的foreach

    Array.prototype.forEach = function (action) { for (var i = 0; i < this.length; i++) { action(this ...

  6. 查询职责分离&lpar;CQRS&rpar;模式

    查询职责分离(CQRS)模式 在常用的三层架构中,通常都是通过数据访问层来修改或者查询数据,一般修改和查询使用的是相同的实体.在一些业务逻辑简单的系统中可能没有什么问题,但是随着系统逻辑变得复杂,用户 ...

  7. iptv

    # -*- coding: utf-8 -*- import datetime, time, json, re, os #from pwd import getpwnam #quality str_q ...

  8. python信息收集之子域名

    python信息收集之子域名 主要是以下3种思路: 字典爆破 搜索引擎 第三方网站 0x00 背景知识 list Python内置的一种数据类型是列表:list是一种有序的集合. >>&g ...

  9. Javascript 的addEventListener&lpar;&rpar;及attachEvent&lpar;&rpar;对比

    Mozilla中: addEventListener的使用方式: target.addEventListener(type, listener, useCapture); target: 文档节点.d ...

  10. CEF源码编译

    CEF的构造说明:https://bitbucket.org/chromiumembedded/cef/wiki/BranchesAndBuilding chromium的源码地址:https://c ...