屏幕匹配

在开发手机app的时候，设计开发 ui 时会碰到一个绕不开的问题，那就是屏幕分辨率匹配问题
因为用户的设备不是统一的分辨率和尺寸，而是各种分辨率和尺寸起飞，要想让自己开发的APP在各种设备上都可以友好的显示，并不是那么容易的事情
这篇文章总结一下这方面的经验

android 手机

android 设备因为其开放性，早期存在N多分辨率和尺寸比例，所以要想让自己的APP 界面能够匹配多种 android 设备，需要专门来处理这些事情，这里边涉及到一些知识和技巧，下面这篇文章是一篇这方面的干货
http://www.zcool.com.cn/article/ZNjI3NDQ=.html

不过近几年，android 手机设备的分辨率已经比较统一和标准了，可以在电商网站多观察一下
现在主流的分辨率有如下两种：

1. 1280x720 (720p)
2. 1920x1080 (1080p)

更高端的2k,4k 比较少

1. 2560x1440 (2k)
2. 3840x2160 (4k)

并且这几种分辨率其实是等比例缩放的，所以只需要等比例处理就行

iPhone

iPhone手机早期只有一种尺寸和分辨率，那简直就是ios开发者的春天，不过自从 iphone 5 发布后一些都变了 iphone 变得也需要像 android 那样需要专门处理了

型号	尺寸	分辨率
iPhone	3.5英寸	480x320
iPhone 3G	3.5英寸	480x320
iPhone 3GS	3.5英寸	480x320
iPhone 4	3.5英寸	960x640
iPhone 4S	3.5英寸	960x640
iphone 5	4英寸	1136x640
iPhone 5S	4英寸	1136x640
iPhone 6	4.7英寸	1334x750
iPhone 6P	5.5英寸	1920x1080
iPhone 6S	4.7英寸	1334x750
iPhone 6SP	5.5英寸	1920x1080
iPhone 7	4.7英寸	1334x750
iPhone 7P	5.5英寸	1920x1080

react native

react native 的 Dimensions api 可以获取当前设备屏幕宽高，单位是 dp
然后可以通过 PixelRatio api 获取当前设备 dp 和 px 的转换关系
这样就可以获取屏幕宽高的 px 了

相关干货
https://segmentfault.com/a/1190000002658374