概述
适配的相关技术
对于适配问题在ios8后有了autolayout之后方便了很多,可以在storyboard上直接做约束来对空件和界面进行过适配,可以达到在不同的移动端版本上都能很好地展示相关的界面信息。下面是我从网上找到的相关的Autolayout技术的操作和介绍以及我在做适配的时候遇到的问题及相关的小技巧。
此篇文章是我精心的通过查找资料和结合自身编写的,大部分大牛的技术视为引用,很感谢他们博大的知识
Autolayout有很不好的一面,也是特别要注意的一面:
storyboard中使用autolayout有利有弊,好处当然是可视化,实现简单功能很节省时间,但也有弊端,例如不小心移动一个控件就会让弄乱那些约束或者控件一多加上自定义的Xx约束就全部over必须全部重新添加约束。还有就是约束不能复制粘贴,除非复制整个控制器,因为这些约束就是基于控制器的view上的,如果只复制粘贴上面的相关部分控件的话就会失去与父视图之间的约束没这样的话所有约束都是虚假和错误的,也可以说是不完整的,所以在粘贴的控制器上会报出红色的错误,那么这些约束就需要重做(切记)
以下几点是我们在开始使用之前必须弄清楚的事情:
1:我们要抛弃以往旧的布局方式不再去关注View的Frame,Center,和autoresizing. 因为这些坐标和大小的定位都可以通过来AutoLayout完成.
2:理解每一种Constraint的含义,否则,当你去看别人的实现的Constraint时,就会有种看天书的感觉.
3:按意图设计,一切按我们理想中的效果去布局,只要约束设定的合理,就一定能够完成目标布局.
开始使用
先从Interface Builder开始吧. 打开某个Xib或者StoryBoard,
在右侧Show in fileinspector里面找到Ues Autolayout,将其勾选.如下图:
自此,Autolayout便启用成功,autoresizingMask被废弃.其所有以往的功能和特性都被Autolayout取代.
然后需要在这上选择你需要适配屏幕,比如说竖屏还是横屏。
对其理解
1.实际应用中,这Compact,Any,Regular如何运用呢?
w:Any h:Any 是我们刚建立工程时候默认选择的,算是一切描述的父类.其他的种类描述都是在此基础上变化的,比如:如果weight设为Any,height设置为Regular,那么在该状态下的界面元素在只要height为Regular,无论weight是Regular还是Compact的状态中都会存在.于是:
w:Compact h:Compact - (w:Any h:Compact ,w:Compact h:Any , w:Any h:Any)
w:Regular h:Compact - (w:Any h:Compact ,w:Regular h:Any , w:Any h:Any)
w:Compact h:Regular - (w:Any h:Regular ,w:Compact h:Any , w:Any h:Any)
w:Regular h:Regular - (w:Any h:Regular ,w:Regular h:Any , w:Any h:Any)
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:Anyh:Compact
• 对于一些公有的约束(任意组合中都适用),一般放在w:Any h:Any中设置
• iPad同理
所以,我觉得Size Class最大的帮助是,解决横屏适配和iPhone iPad共享一个设计板…
需要注意的细节,也是我在适配过程中犯过的错误
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(最重要的吧).
参考资料
为iPhone6设计自适应布局(一)
为iPhone6设计自适应布局(二)
关于自动布局(Autolayout)
WWDC 2014Session笔记 -iOS界面开发的大一统
iOS8Size Classes的理解与使用
AutoLayout 进阶
以上的相关技术是搜索到iOS的技术大神的,很感谢其中的详尽的解释,让我学到了很多。
以下是我自己在做适配的时候先关的心得体会和小技巧
相关小技巧
1. 在做适配的时候还是需要提前设计好每一个控件和界面布局上的整体思路就是依赖关系,比如说父控件与子空间之间的关系,还有兄弟关系间的约束等等信息,这些提前先整体构思然后布局。
2. 在构思完之后,先找一个固定参考的我把它叫基准参照物,这个参照物控件必须是有详尽的信息,比如是大小,在父视图上得具体位置例如如下图的适配中需要的做法步骤是
(a)先可以看出左上角的人物图标,它一定是固定在这个视图的左上角,大小可以设置为aspect ratio也就是等比例大小如果先设置好了它之后就可以设置旁边的所有控件的约束了,那么下一个控件就可以依据到它的上面来进行适配,比如(导演名可以和它下对齐,左边距离它多远)(影片名可以距离导演名为5并和导演名左对齐)。。。
(b)对于必须中间的适配可以设置它为上下水平居中,还可以设置它与父视图中心线的距离,还可以用公式进行修改各种距离的参数。
3. 在有的图片上面有文字的并且文字和代码不相关的,也就是程序中没有定义属性的,在做适配的时候可以将其文字让图片设计师设计到图片上固定死,这样的话当图片在适配后的屏幕中按比例中改变大小的时候就不会出现内部字体型号不改变,或者字与字之间距离不改变,或者字与图片之间的距离不改变的尴尬。
目前技术难点
1. 在适配有改写的按钮文字的时候,不能做到文字随着按钮的变大而有规则的变大,还有文字在父视图中的位置。
2. 在UICollectionViewController的适配中间隙之间的距离不能得到很好的有目的性的控制。
最后
以上就是虚幻羊为你收集整理的适配的相关技术与相关心得体会与技术难题适配的相关技术对其理解的全部内容,希望文章能够帮你解决适配的相关技术与相关心得体会与技术难题适配的相关技术对其理解所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复