iOS 8 AutoLayout与Size Class自悟

storyboard中可以进行所有尺寸屏幕的适配(iphone和ipad),它抛弃了传统意义上我们适配时所谓的具体宽高,把屏幕的宽和高分别分成两种情况:紧凑-compact,正常-regular(any-任意,其实就是这2种的组合,所以没分成3种情况)。所以就是9种。

w:Any h:Any 是我们刚建立工程时候默认选择的,算是一切描述的父类.其他的种类描述都是在此基础上变化的,比如:如果weight设为Any,height设置为Regular,那么在该状态下的界面元素在只要height为Regular,无论weight是Regular还是Compact的状态中都会存在.

2. 再来看一组数据和一张图(国外一位博主给出的,很形象):

iPhone4S,iPhone5/5s,iPhone6

竖屏:(w:Compact h:Regular)

横屏:(w:Compact h:Compact)

iPhone6 Plus

竖屏:(w:Compact h:Regular)

横屏:(w:Regular h:Compact)

iPad

竖屏:(w:Regular h:Regular)

横屏:(w:Regular h:Regular)

3.可以总结为: 

  • 如果项目不支持横屏显示,使用w:Compact h:Regular(或者直接取消使用Size Class)
  • 如果项目支持横屏显示,使用w:Compact h:Regular+w:Any h:Compact
  • 对于一些公有的约束(任意组合中都适用),一般放在w:Any h:Any中设置
  • iPad同理

所以,我觉得Size Class最大的帮助是,解决横屏适配和iPhone iPad共享一个设计板…(个人意见)

试验反馈一

1.首先,先建立一个工程,展开如下页面

PS:这是iOS8的新特性,真的用到项目里需要等放弃兼容iOS7 。。。显然,目前还是不行的

2.在Any Any情况下,放置一个Label,并设置约束上-左-下-右为0-0-20-0

3.在Compact Any情况下,又放置一个Label,并设置约束上为20

4.继续在Compact Any情况下,来看看横屏状态下的变化

5.最后切换到Regular Any下,完成6 Plus 的横屏显示

试验反馈二

试验一里面,验证了一下概念中所列举的各个屏幕适用的组合,接下来,算是Size Class 解决横屏的妙用

PS:运用于,横屏适配,重新排版竖屏时候的UI布局

除了改动不同组合下约束,也能改动控件在不同组合下是否显示

试验反馈三

AutoLayout这里不给具体如何设置,因为不知道如何写,感觉还是大家多动手去写,去试,最有效了

下面给出AutoLayout设置的图解

简答测试Demo结果图:

如果不横屏,也可以直接取消Size Classes(图不一样,不同时间写的…囧)

最终Demo

Demo的Github地址:https://github.com/ConanMTHu/Size-Classes-Demo/tree/master

 

总结

直接说以后都应该使用storyboard+autolayout感觉是不负责的说法,但是深入思考autolayout是很有必要的!

如下情况使用autolayout会有帮助:

  • 当需要展示的内容很多并且尺寸不固定;
  • 程序需支持屏幕旋转(主要是iPad程序,iPhone程序横屏的场景有点非主流,也不排除..手游..);
  • 程序通用于iPhone和iPad(最重要的吧).

但storyboard中使用autolayout有利有弊,好处当然是可视化,实现简单功能很节省时间,但也有弊端,例如不小心移动一个控件就会让弄乱那些约束或者控件一多加上自定义的XXXXXXXX

时间: 2024-10-05 01:24:06

iOS 8 AutoLayout与Size Class自悟的相关文章

iOS 8 AutoLayout与Size Class自悟(转载)

iOS 8 AutoLayout与Size Class自悟 Size classiOS 8 AutoLayout 前言 iOS8 和iPhone6发布已经过去蛮久了,广大的果粉终于迎来了大屏iPhone,再也不用纠结为大屏买三星舍苹果了…但是对于iOS开发人员来说,迎来了和 Android开发开发一样的问题—>各种屏幕的适配(是不是可以要求加工资的节奏).对于适配,网传各种有关Size Class的论点,前段时间太忙,一直没去研究,套用+总的话,苹果在适配方面提供的方法做的比安卓好太多了.自己实

iOS 8 AutoLayout与Size Class自悟[转]

http://www.cocoachina.com/ios/20141217/10669.html 前言 iOS8和iPhone6发布已经过去蛮久了,广大的果粉终于迎来了大屏iPhone,再也不用纠结为大屏买三星舍苹果了…但是对于iOS开发人员来说,迎来了和Android开发开发一样的问题—>各种屏幕的适配(是不是可以要求加工资的节奏).对于适配,网传各种有关Size Class的论点,前段时间太忙,一直没去研究,套用+总的话,苹果在适配方面提供的方法做的比安卓好太多了.自己实测之后,确实很方便

iOS 8 AutoLayout与Size Class

iOS8和iPhone6发布已经过去蛮久了,广大的果粉终于迎来了大屏iPhone,再也不用纠结为大屏买三星舍苹果了-但是对于iOS开发人员来说,迎来了和Android开发开发一样的问题->各种屏幕的适配(是不是可以要求加工资的节奏).对于适配,网传各种有关Size Class的论点,前段时间太忙,一直没去研究,套用+总的话,苹果在适配方面提供的方法做的比安卓好太多了.自己实测之后,确实很方便0.0(不过,还是想说,适配的核心始终是AutoLayout) 概念初探 iOS8之前,公司在开发项目时,

iOS Xcode6 AutoLayout跟Size Classes(4)size classes 的应用

iOS 8在应用界面的可视化设计上添加了一个新的特性-Size Classes,对于任何设备来说,界面的宽度和高度都只分为两种描述:正常和紧凑.这样开发者便可以无视设备具体的尺寸,而是对这两类和它们的组合进行适配.这样不论在设计时还是代码上,我们都可以不再受限于具体的尺寸,而是变成遵循尺寸的视觉感官来进行适配 要知道Size Classes并不能帮我们自动布局,而是帮助我们来管理不同类型的IB 但是我们看到图中的宽度和高度都是Any,Any是什么意思呢?如果weight设为Any,height设

iOS Xcode6 AutoLayout跟Size Classes(2)

我们来实际用一下autoLayout 新建一个XIB如下,并且拖动一个文本框,然后将其颜色改变为红色 我们的需求是他将要距离上边30距离左边右边10距离下边10(如果以传统的写死那么在不同的手机上将会是一个特别糟糕的问题,所以我们应该使用自动布局来约束它,解决这个问题) 首先我们选中创建出来的文本框并点击如下按钮 然后将其约束为距离上下左右都10 最后xib会变成这样 然后再跟大家说一下Xcode6的布局神器 然后我们刚才创建的视图就出来啦 还可以选择更多的手机哦

iOS Xcode6 AutoLayout跟Size Classes(5)size classes 屏幕旋转的应用

z以后一篇介绍sizeclasses啦.这次弄一个播放页面.会用到旋转然后重新布局的 如下创建出视图: 然后用自动布局来约束它 竖屏差不多为这样 然后我们来做出横屏 约束后差不多是这个样子 然后来看下转换屏幕方向的效果 竖屏: 横屏 这里解释一下为什么是6 plus的尺寸.因为前边我选择横屏的时候选择了w:Regular h:Compact所以这个尺寸是适合于6plus的,其他的话是没有的

ios Xcode6 AutoLayout跟Size Classes(3)

现在我们来弄一个相对复杂一点的布局 如下 需求为要求用户名距离上边30文本框跟按钮距离左右40 .他们的间距为30 我们来设置它的间距(其实完全可以想像为盒子设置与它邻居的间距,这样不就是简单了) 然后来看效果 假如我们需要来改变第三个框跟按钮的位置怎么办我们这样来 点击按钮弹出来的一条线(这是约束线) 然后修改constant的距离1000是优先级我们改为10 效果图 是不是很简单了

iOS 8 AutoLayOut入门

http://blog.csdn.net/asdfg13697116596/article/details/42562565 iOS 8 AutoLayOut入门自从iOS6带来Auto Layout这个特性以来,用户界面的布局便变得简单起来.iOS8更是做的更好本文主要针对初学者分享一下自己最近学习AutoLayout的心得体会.Let’s Start!首先,什么是AutoLayout?简单来说,就是自动布局,当你旋转屏幕或者缩放你的UI来适应不同大小的屏幕等,程序的视图看起来依然很nice,

IOS不用AutoLayout也能实现自动布局的类----MyLinearLayout横空出世

下载地址: https://github.com/youngsoft/MyLinearLayout       众所周知,对于IOS开发者来说,随着手机屏幕的尺寸在增多,不可避免的也需要考虑适配的问题了.这个问题在IOS6以前我们可以通过autoresizingMask和frame进行组合来解决视图伸缩.旋转的适配,但是这个方案不彻底还是需要编写很多的代码来完成:而在IOS6以后推出了AutoLayout的解决方案,这个方案的实现和可操作性太过于复杂和繁琐不仅编写的代码特别多,就是在XIB上进行