前言:这篇文章是笔者在项目中对布局技术进行技术选型和应用的相关介绍,供大家参考。

&& [self.buttonscount] > 0)

{

UIButton *button = self.buttons[0];

[button autoPinEdgesToSuperviewEdges];

}

else

{

[self.buttonsautoMatchViewsDimension:ALDimensionWidth];

[[self.buttonsfirstObject] autoPinEdgeToSuperviewEdge:ALEdgeLeft];

UIButton *previousView = nil;

for (UIButton * btn inself.buttons)

{

[btn autoAlignAxisToSuperviewAxis:ALAxisHorizontal];

[btn autoPinEdgeToSuperviewEdge:ALEdgeTop];

[btn autoPinEdgeToSuperviewEdge:ALEdgeBottom];

if (previousView)

{

[btn autoPinEdge:ALEdgeLefttoEdge:ALEdgeRightofView:previousView];

}

previousView = btn;

}

[[self.buttonslastObject] autoPinEdgeToSuperviewEdge:ALEdgeRight];

}

}

这里对一组button(其数量是变化的)设置了约束,它们宽度固定,水平排列,两两相连,左右都顶到了view的最边缘。

对于一般的view来说,4个约束可以固定一个view。可以想象一下,你的view能否同时满足这几个条件,满足这几个条件以后它是不是就动不了了。

框架使用最佳实践:

学习和研究第三方库中的示例代码和api说明,能够帮助我们快速的掌握其api使用;如果有必要可以深入其源代码了解其中的细节。一般来说,其示例代码中的api调用方式是相对标准和安全的,值得我们参考和借鉴。

One more thing(关于autolayout的错误调试:)

autolayout错误会打印如下:

Unable to simultaneously satisfy constraints.     Probably at least one of the constraintsin the following list is one you don't want. Try this: (1) look at eachconstraint and try to figure out which you don't expect; (2) find the code thatadded the unwanted constraint or constraints and fix it. (Note: If you'reseeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer tothe documentation for the UIView propertytranslatesAutoresizingMaskIntoConstraints) (    "<NSAutoresizingMaskLayoutConstraint:0x887d630 h=--&v=--& V:[UIButtonLabel:0x886ed80(19)]>",    "<NSAutoresizingMaskLayoutConstraint:0x887d5f0 h=--&v=--& UIButtonLabel:0x886ed80.midY == + 37.5>",     "<NSAutoresizingMaskLayoutConstraint:0x887b4b0h=--& v=--& V:[UIButtonLabel:0x72bb9b0(19)]>",     "<NSAutoresizingMaskLayoutConstraint:0x887b470h=--& v=--& UIButtonLabel:0x72bb9b0.midY == - 0.5>",     "<NSLayoutConstraint:0x72bf860V:[UILabel:0x72bf7c0(17)]>",     "<NSLayoutConstraint:0x72c2430UILabel:0x72bfad0.top == UILabel:0x72bf7c0.top>",     "<NSLayoutConstraint:0x72c2370UILabel:0x72c0270.top == UILabel:0x72bfad0.top>",     "<NSLayoutConstraint:0x72c22b0V:[UILabel:0x72bf7c0]-(NSSpace(8))-[UIButton:0x886efe0]>",     "<NSLayoutConstraint:0x72c15b0V:[UILabel:0x72c0270]-(NSSpace(8))-[UIRoundedRectButton:0x72bbc10]>",     "<NSLayoutConstraint:0x72c1570UIRoundedRectButton:0x72bbc10.baseline ==UIRoundedRectButton:0x7571170.baseline>",     "<NSLayoutConstraint:0x72c21f0 UIRoundedRectButton:0x7571170.top== UIButton:0x886efe0.top>" )

这里的约束看起来很难理解,应该是打印了类似VFL的约束表示。

我在项目中引入了NSLayoutConstraint+Description,重写了其description方法,这样在出错时可以容易的阅读当前出错的约束情况,加以鉴别。

附录:Autolayout出现前的iOS布局技术

关于旋转屏:

对于iphone应用开发者来说,绝大部分应用都是不需要支持旋转屏幕的;苹果的系统应用倒是有几个支持转屏(不过也主要是简单列表的布局,支持起来比较容易)。Iphone的长宽比例相差较大,因此如果要得到一个比较良好的体验,横屏和竖屏的布局一般都需要重新设计,由此带来了巨大的工作量;从用户体验来说也看不到支持横屏的必要性。因此,对于iphone应用来说,绝大部分应用都是不支持旋转屏幕的。大家可以看一下手机里的流行应用(微信、支付宝、网易新闻等),可能只有一些视频类应用的个别页面会支持转屏(播放视频横屏体验更佳)。

而对于iPad来说,其长宽比例较为接近(4:3),且苹果一开始就建议iPad应用开发者适配横竖屏以提升用户体验(横屏使用iPad对用户来说很平常,这点和iphone差别较大)。因此,对于iPad开发者来说,因为转屏场景的存在,布局适配一直是开发中需要注意的一个重点问题。

固定frame写法:

写死frame来布局,在只有320*480一套分辨率的时候非常happy; frame无需计算;  在iphone5推出之前(2012年9月发布),写死frame来布局UI是非常方便快速的;而对于iphone开发者来说,一般不需要考虑屏幕旋转的问题(上面我们已经说了,大部分app是锁定屏幕方向的)。这个时代的iphone 开发者是非常幸福的(android开发者需要适配碎片化的分辨率)。但iphone5、iphone6、iphone6plus带来的分辨率碎片化让固定 frame写法增加了很大的工作量,且代码难以阅读和维护。

Autoresizing技术:

就是在创建视图的同时给出其相对于父视图的“对齐方式与缩放系数”,即autoresizingMask。当父视图发生变化时,通过每个子视图的 autoresizingMask即可自动得出子视图的位置。

然而autoresizingMask的问题在于:

1.    其描述界面变化规则不够灵活,很多变化规则根本无法精确描述。autoresizingMask缩放比例是UIKit内部计算的,开发者无法指定缩放比例的精确值;且一般情况下,距离往往比比例更加精确(这点大家和设计同学沟通的时候应该有体会)。

2.    变化规则只能基于父视图与子视图之间,无法建立同级视图或者跨级视图之间的关系。

总结:Autoresizing用来简单的指定和父view之间的关系还是比较方便的。其在我们当前的项目中使用的也比较多,但它的局限性决定了它只能作为frame布局的辅助,应用于一些简单场景,对于复杂多样化的布局力不从心。在autolayout问世以前,通过autoresizing也可以处理一些简单页面的旋转屏布局(在细节要求不高的情况下)。

AutoLayout技术选型和应用的更多相关文章

  1. #数据技术选型#即席查询Shib+Presto,集群任务调度HUE+Oozie

    郑昀 创建于2014/10/30 最后更新于2014/10/31   一)选型:Shib+Presto 应用场景:即席查询(Ad-hoc Query) 1.1.即席查询的目标 使用者是产品/运营/销售 ...

  2. 老王讲自制RPC框架.(一.前言与技术选型)

    (#)背景 随着互联网的发展,网站应用的规模不断扩大,常规的垂直应用架构已无法应对,分布式服务架构以及流动计算架构势在必行,亟需一个治理系统确保架构有条不紊的演进. 单一应用架构 当网站流量很小时,只 ...

  3. Atitit 开发2d游戏的技术选型attilax总结

    Atitit 开发2d游戏的技术选型attilax总结 1.1. 跨平台跨平台:一定要使用跨平台的gui技术,目前最好的就是h5(canvas,webgl,dom) +js了..1 1.2. 游戏前后 ...

  4. 《2016ThoughtWorks技术雷达峰会----js爆炸下的技术选型》

    JS爆炸下的技术选型  刘尚奇    ThoughtWorks, 高级咨询师 JS每6个星期出现一个新框架,那么如何进行JS的选型.以下从四个方面来分析. 1.工具 NPM for all the t ...

  5. 手机web站点和手机app 技术选型的困惑于思考

    今年一直在关注移动端技术的发展,自己也用博客园的rss接口玩了半年,关于技术选型的困惑和大家说说 一 趋势 随着手机硬件不断的升级,外加4g牌照的发放,不出2年时间移动端web站点和手机app一定会进 ...

  6. atitit.技术选型方法总结为什么java就是比.net有前途

    atitit.技术选型方法总结为什么java就是比.net有前途 #----按照不同的需要有不铜的法... 一般有开发效率,稳定性上的需要.. 作者 老哇的爪子 Attilax 艾龙,  EMAIL: ...

  7. 消息中间件的技术选型心得-RabbitMQ、ActiveMQ和ZeroMQ

    消息中间件的技术选型心得-RabbitMQ.ActiveMQ和ZeroMQ 作者:chszs,转载需注明.博客主页:http://blog.csdn.net/chszs RabbitMQ.Active ...

  8. (转).net项目技术选型总结

    原文作者:mcgrady 原文地址:.net项目技术选型总结 做.net开发已经几年了,也参与开发了很多大大小小的项目,所以现在希望总结出一套开发.net项目的常用技术,也为以后做项目技术选型的时候作 ...

  9. 【SSM之旅】Spring+SpringMVC+MyBatis+Bootstrap整合基础篇(一)项目简介及技术选型相关介绍

    试水 一直想去搭建个自己的个人博客,苦于自己的技术有限,然后也个人也比较懒散.想动而不能动,想动而懒得动,就这么一直拖到了现在.总觉得应该把这几年来的所学总结一番,这样才能有所成长. 不知在何时,那就 ...

随机推荐

  1. GridView点击排序

    快速预览:GridView无代码分页排序GridView选中,编辑,取消,删除GridView正反双向排序GridView和下拉菜单DropDownList结合GridView和CheckBox结合鼠 ...

  2. ural 1221. Malevich Strikes Back!

    1221. Malevich Strikes Back! Time limit: 1.0 secondMemory limit: 64 MB After the greatest success of ...

  3. python 代码片段7

    #coding=utf-8 #列表 book=['python','development',8] book.append(2008) print book book.insert(1,'web') ...

  4. HTML6 展望

    HTML5 概述 HTML5 是 HTML 语言最受欢迎的版本之一,它支持音频和视频.离线存储.移动端.和标签属性等等.还提供了<article>, <section>, &l ...

  5. Robotium 测试方法

    1.检查CheckBox 是否选上,用solo.isCheckBoxChecked( “text” ). 有时候checkBox 没有相关的text,这时要用solo.isCheckBoxChecke ...

  6. object-c cocos2d-x 写程序时注意调试的技巧

    (1)写程序时最好在类的init函数中显示类名,表明现在在执行哪个类,样例代码 CCLOG(@"cocos2d: Using Director Type:%@", [self cl ...

  7. tyvj100题留念

    全是水题萌萌哒~0~... 留个纪念

  8. js判断鼠标位置是否在某个div中

    div的onmouseout事件让div消失时,会出现这样的情况,就是当鼠标移至div中的其它内容时,此时也判定为离开div,会触发 onmouseout事件,这样div中的内容就不能操作了.解决的办 ...

  9. 多个mysql增加多个服务

    //mysql安装目录 mysqld --install mysqld --remove mysql5.5 mysqld --remove mysql5.5 C:\Program Files\MySQ ...

  10. 从网页上抓取Windows补丁信息然后整型输出(PowerShell)

    $report = [pscustomobject]@{'Date' = $null; 'MSRC' = $null; 'KB' = $null; 'Severity' = $null; 'Versi ...