文档章节

AutoLayout(Ⅱ):遇到的几个小问题(Keng)

hejunbinlan
 hejunbinlan
发布于 2016/07/29 17:41
字数 1611
阅读 14
收藏 0
点赞 0
评论 0

团队采用AutoLayout已经有小半年的时间了,基本上已经非常熟练的运用这个技术,其实搞几天搞会了也就没啥了。
总结一些常用的情况和遇到的几个小问题,顺便给刚用这个技术的童鞋一个参考。

1.等分布局问题

这是一种常遇到的场景:屏幕上的一排控件均匀排列。这种运用的思想就是先确定中心参考系,以中心参考系为参考进行具体的约束。下面以在屏幕上均匀排列3个控件为例子:

需求是:3个控件均匀分布在屏幕上,并且控件和控件之间以及控件与屏幕边缘之间的间隔固定为10。

先找到中心点,很显然这点是屏幕中心点,在这个点上先放置一个View2控件。然后一次在其左右分别放置View1,View3。三个控件拖上去完成基本的摆设之后开始连线,按照经验来讲,如果一开始摆的越规则,连线越不容易乱。

现在,先从View1连线,点击Xcode右下角的图标()。可以看到如下,

这里特别注意“Constrain to margins”这个选项。关于margin:边缘,一开始我也不理解问题,从而导致了实际出来的效果和预期的不一致。

苹果默认每个View都有margin,即边缘。也就是说subView在连线它的superView是并不是从0这个点开始的,而是从边缘线这个点开始的。而我们的设计师,一般都是默认从0开始,所以在实际项目中,我们总是把这个选项默认不选中。这里面有个技巧,如果我们用Pin如下图:

Pin进行约束时“Constrain to margins”这个选项是不选中的,而当我们用Ctrl连线时是默认选中的。(开发环境为:Xcode6,MacOS 10.10.3)

这里说的有点玄乎了,在stackOverFlow上有一段具体的讨论:

http://stackoverflow.com/questions/25807545/what-is-constrain-to-margin-in-storyboard-in-xcode-6

这里讲的很清楚,感兴趣的童鞋可以深入了解下。而且以我的经验来讲,这个边缘的默认值在iOS8和iOS6上还是不同的。

等分的另一个重要约束就是Equal Width or Equal Height。下图是具体的约束连线:

2.UIScrollView的多ContentView的问题

这种场景最多的就是翻页,例如网易新闻客户端的滑动翻页等。没有用autoLayout时可以通过设置contentSize解决翻页的问题。用了autoLayout也可以用比较方便的方法解决。

这个例子的需求是:两个页面滑动。

下面直接上例子:

新建一个工程,名为AutoLayout+UIScrollView,和之前的一样把Use Size Classes取消掉(因为还要兼容iOS6)。选中Main.stroyboard,拖动一个ScrollView到self.view上,设置scrollView的上下左右约束,拖动contentView到scrollView上,设置上下左右的约束,但是要注意将Width的约束写死为640(因为模拟器中为320,而需求是2页,所以为640),这个时候在stroyboard上看不下contentView(因为640已经超过了320了),可以设置Simulated Metrics下的Size为 Freedom

这样就可以调整self.view的显示尺寸了。

注意到前面写死的640了,这个值在iPhone5s以下都是正确的,但是iPhone6及以上都是错了。所以我们需要将这个约束单独的作为一个property,如下所示设置为

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *contentSizeWidth;

//不要忘了在viewDidLoad中设置:
self.contentSizeWidth.constant = self.view.bounds.size.width * 2;

展开之后的视图是这个样子的:

这样就比较直观了,然后通过等分布局的思想,往各自的contentView上加各种视图。最终的各种约束是下面的样子:

上图的中间一条白色的view,是作为中心参考view的,这样方便整个contentView的布局。

之所以把这个作为例子是因为UIScrollView在AutoLayout下是个特殊的view,因为scrollView的subView的约束是针对contentSize而不是bounds,所以scrollView的subView是不能简单的通过和scrollView之间的各种约束来决定大小的,实际操作中可能会出现Has ambiguous scrollable content width/height的warning,如果出现这个warning,说明有错了。在网上有看到其他人用新建一个参考View的方法来解决这个问题,我在这里是通过先写死Width约束后改其具体的值来实现的。

3.UITableViewCell的高度自适应的问题

网上有很多文章讲到了cell高度自适应的问题。推荐的下面三篇,思想和代码都是一样的,我看好多中文讲自适应高度的文章也是换汤不换药。

  1. http://stackoverflow.com/questions/18746929/using-auto-layout-in-uitableview-for-dynamic-cell-layouts-variable-row-heights

  2. AutoLayout深入浅出五[UITableView动态高度]

  3. 使用Autolayout xib实现动态高度的TableViewCell

本人在实际做项目的时候参看了很多的文章,虽然有不少中文教程讲了怎么实现,但是或多或少都存在问题。这里面最主要的问题是iOS8,iOS7和iOS6上表现出来自适应高度都是不一样的。在iOS8上好使的在iOS6上不好使,上面的第一个链接文章是第一个讲iOS8和iOS7的差异的(老外才是搞第一把交易的啊,国内的真的只是翻译一下罢了)。

最后讲下我们最终是怎么解决这个自适应的问题。由于这个自适应在iOS8,iOS7,iOS6上表现的真的很不一样(甚至在iOS8.1.3和iOS8.0.x版本上面表现的都有不同),而且如果真的要做自适应的话需要写一些if版本判断,这样维护的代码反而多了起来。所以我们最终的解决方法仍然是用代码去计算高度,最原始的方法,但是很好的解决了这个问题并且各个iOS版本下都能适用。

上面的3个问题是我在用AutoLayout时遇到的问题,相对来讲花了我一定的时间去研究。除了这些问题,还有一个AutoLayout的动画问题,打算下篇介绍。

本文的例子都已经上传的这里

本文转载自:http://www.vienta.me/2015/05/14/AutoLayout-%E9%81%87%E5%88%B0%E7%9A%84%E5%87%A0%E4%B8%AA%E5%B0%8F...

共有 人打赏支持
hejunbinlan
粉丝 40
博文 532
码字总数 21018
作品 0
浦东
高级程序员
AutoLayout(III):浅析动画

前面讲过了AutoLayout的基本概念和遇到的一些问题,这篇讲的是AutoLayout下的动画。自动布局已经比传统的Frame复杂,动画也会稍微更复杂些。期望通过这篇文章,能够对AutoLayout下的动画有理...

hejunbinlan ⋅ 2016/07/29 ⋅ 0

iOS开发tips-UIScrollView的Autlayout布局

UIScrollViewj尽管继承于UIView,但它是一个相对比较特殊的视图,特别是当它遇到了AutoLayout之后。在UIScrollView中使用AutoLayout的目的除了使用相对约束确定子控件的位置和大小外,更重要...

jianxin160 ⋅ 2017/02/25 ⋅ 0

Autolayout使用小结(一)

Autolayout使用小结(一) 最近做项目时,因为iPhone6和iPhone6Plus的兼容,我们启用了Autolayout. 以前是因为不用也能满足需求,也是因为懒,没有认真使用,只是了解过。经过一段时间的使用...

法斗斗 ⋅ 2015/10/14 ⋅ 0

防止浏览器记住用户名和密码

解决方案 下面列出了几个比较常用的解决方案,都有各自的优缺点,和不同的适用场景,先大概的看一下吧: Ⅰ、 针对浏览器记住密码 首先大部分浏览器都是根据表单域的type="password"来判断密...

ForingY ⋅ 2015/12/07 ⋅ 0

Autolayout小结(二)

Autolayout小结(二) 在Autolayout小结(一)中介绍了在Autolayout学习中一些基本的注意点,本文会针对一些布局上常见的问题进行分析。 如何自动适应cell的高度 如何在ScrollView中使用Autol...

法斗斗 ⋅ 2015/10/14 ⋅ 0

ios 加载xib遇到的坑

storyboard,个人觉得是个好玩意儿,但是什么都做到其中总觉得杂乱。个人偏好把复杂的局部控件(比如定制的collectionviewcell)在xib文件中拉好。 在开发过程中遇到不少坑,记忆犹新的是:x...

iShown ⋅ 2016/02/05 ⋅ 0

ios开发中masonry的使用心得

去年做项目时用到一个第三方自动布局的框架——Masonry,期间碰到过一些问题,现在在此总结一下: 1.添加约束后APP崩溃的问题:(所有问题原因都能归根结底到子view没有成功加到父view上就设...

北方人在上海 ⋅ 2016/10/10 ⋅ 0

iOS AutoLayout自动布局中级开发教程(4)-label等文字自动适应大小,宽度

iOS AutoLayout自动布局中级开发教程(4)-label等文字自动适应大小,宽度 2015-01-24 00:30 相比大家会经常遇到 label 或则 textfield等显示文字的 视图时,显示不全,或者无法自动 变化长度 ,自...

法斗斗 ⋅ 2015/09/24 ⋅ 2

在Storyboard中对UIScrollView使用autolayout自动布局应该注意的地方

尝试在Storyboard中对UIScrollView使用autolayout自动布局,遇到了种种麻烦,记录一下 1、UIScrollView在StoryBoard中的布局 在StoryBoard中使用UIScrollView一定要用下图中的这种布局,如果...

yoyoso ⋅ 2015/03/23 ⋅ 0

iOS开发之Autolayout的使用

补充:iPhone6s plus 尺寸:5.5inch 分辨率:1920x1080 iPhone6s 尺寸:4.7inch 分辨率:1334x750 Autolayout是一种“自动布局”技术,专门用来布局UI界面,能很好的解决屏幕适配的问题。Aut...

shenhuniurou ⋅ 2016/03/07 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

火狐浏览器各版本下载及插件httprequest

各版本下载地址:http://ftp.mozilla.org/pub/mozilla.org//firefox/releases/ httprequest插件截至57版本可用

xiaoge2016 ⋅ 19分钟前 ⋅ 0

Java学习路径及练手项目合集

Java学习路径及练手项目合集

颖伙虫 ⋅ 35分钟前 ⋅ 0

Docker系列教程28-实战:使用Docker Compose运行ELK

原文:http://www.itmuch.com/docker/28-docker-compose-in-action-elk/,转载请说明出处。 ElasticSearch【存储】 Logtash【日志聚合器】 Kibana【界面】 答案: version: '2'services: ...

周立_ITMuch ⋅ 今天 ⋅ 0

使用快嘉sdkg极速搭建接口模拟系统

在具体项目研发过程中,一旦前后端双方约定好接口,前端和app同事就会希望后台同事可以尽快提供可供对接的接口方便调试,而对后台同事来说定好接口还仅是个开始、设计流程,实现业务逻辑,编...

fastjrun ⋅ 今天 ⋅ 0

PXE/KickStart 无人值守安装

导言 作为中小公司的运维,经常会遇到一些机械式的重复工作,例如:有时公司同时上线几十甚至上百台服务器,而且需要我们在短时间内完成系统安装。 常规的办法有什么? 光盘安装系统 ===> 一...

kangvcar ⋅ 昨天 ⋅ 0

使用Puppeteer撸一个爬虫

Puppeteer是什么 puppeteer是谷歌chrome团队官方开发的一个无界面(Headless)chrome工具。Chrome Headless将成为web应用自动化测试的行业标杆。所以我们很有必要来了解一下它。所谓的无头浏...

小草先森 ⋅ 昨天 ⋅ 0

Java Done Right

* 表示难度较大或理论性较强。 ** 表示难度更大或理论性更强。 【Java语言本身】 基础语法,面向对象,顺序编程,并发编程,网络编程,泛型,注解,lambda(Java8),module(Java9),var(...

风华神使 ⋅ 昨天 ⋅ 0

Linux系统日志

linux 系统日志 /var/log/messages /etc/logrotate.conf 日志切割配置文件 https://my.oschina.net/u/2000675/blog/908189 logrotate 使用详解 dmesg 命令 /var/log/dmesg 日志 last命令,调......

Linux学习笔记 ⋅ 昨天 ⋅ 0

MVC——统一报文格式的异常处理响应

在我们写controller层的时候,常常会有这样的困惑,如果需要返回一个数据是,可能为了统一回去构造一个类似下列的数据格式: { status:true, msg:"保存成功!", data:[]} 而且在写...

alexzhu592 ⋅ 昨天 ⋅ 0

android -------- 打开本地浏览器或指定浏览器加载,打电话,打开第三方app

开发中常常有打开本地浏览器加载url或者指定浏览器加载, 还有打开第三方app, 如 打开高德地图 百度地图等 在Android程序中我们可以通过发送隐式Intent来启动系统默认的浏览器。 如果手机本身...

切切歆语 ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部