iOS屏幕等比适配方案
屏幕适配是每个前端开发者的必备技能之一,为了更好的视觉体验,我们对自己的产品的要求必须更加严格。在经历诸多项目的历练之后,相信每个人都会有最适合自己的一套方案。
目前iOS的主流UI开发方式有两种,可视化编程(Interface Builder)以及纯代码开发,至于说两种开发方式的优缺点什么的就不赘述了,这里主要分享一下我自己的适配方案。
简单来讲,所谓屏幕适配,最核心的一点在于控件布局、以及页面中展示的文字都以屏幕宽度为参考实现等比缩放。例如,设计稿参考的屏幕宽度尺寸为750px,那么控件布局中实际展示的尺寸为:控件的设计尺寸 / 750px * 屏幕宽度。
关于可视化编程,苹果提供的AutoLayout只能满足一些基本的适配需求,在需要进行等比适配的项目中,就显得很鸡肋了。例如,黄色的view在设计图中距离父视图的左边距为30px,在5s(640 * 1136px)中的实际尺寸应该为30 / 750 * 640 = 25.6px,但是在xib中我们无法实现这种操作,需要将该约束拉到对应的文件中进行修改,无比麻烦,如果你的项目对适配要求较高,建议放弃该方案(但是也保不齐大佬有修改constant的扩展方案,毕竟黑魔法确实强大)。
于是后来就放弃了可视化编程,转用纯代码开发,纯代码开发配合Masonry使用能很大程度的满足各种适配需求。如果对AutoLayout很熟悉的话,那么上手Masonry也非常简单。
可以看出红色的view相对黄色的有一个明显的缩进,将需要添加约束的值使用reallySize转换一下即可。
至此,已经可以实现各种控件的等比缩放,但是众所周知,iOS原生开发中文字如果不做特殊处理的话在所有屏幕中显示的大小都是一样的,接下来就需要处理一下文字的等比适配。通过两个类别就可实现,也是用的别人的轮子。
XIB、StoryBoard创建的Label,新建一个Label的类别,使用黑魔法交换awakeFromNib方法即可。
纯代码创建的Label,新建UIFont的类别,交换systemFontOfSize、boldSystemFontOfSize方法,还想添加其他字体等比自行添加。
Over。