怎样处理苹果手机小程序页面突然变大兼容问题

iPhone屏幕适配，启动页设置，xcode6 开启 iPhone6 &iPhone6 plus 分辨率

iphone手机屏幕变大之后型脊和，我们iOS开发者也要关注屏幕适配了，有时还会遇见莫名其妙的问题：如：

程序启动后状态栏字体变大：

iPhone屏幕适配 程序启动后状态栏字体变大0

iPhone屏幕适配 程序启动后状态栏字体变大1

这个问题就是因为我们的APP启动界面图片问题，简单的解决办法就是启动页面图片分辨率改成相应屏幕分辨率。具体原因往下看：

我们可以穿件一个XIB文件来当作启动页：当app启动的时候就可以自动加载这个xib文件

iPhone屏幕适配 程序启动后状态栏字体变大2

iPhone屏幕适配 程序启动后状态栏字体变大3

初代 iPhone

2007 年，初代 iPhone 发布，屏幕的宽高是 320 x 480 像素。下文也是按照宽度，高度的顺序排列。这个分辨率一直到 iPhone 3GS 也保持不变。

那时编写 iOS 的 App(应用程序)，只支持绝对定位。比如一个按钮(x, y, width, height) = (20, 30, 40, 50)，就表示它的宽度是 40 像素，高度是 50 像素，放在(20, 20)像素的位置。

iPhone 4

2010 年，iPhone 4 发布，率先采用 Retina 显示屏，在屏幕的物理尺寸不变的情况下，像素成倍增加，达到 640 x 960 像素。

这样就出现一个问题，怎么让原有的 App 运行在新的手机上面？iPhone 手机一个优势，就是有众多优秀的 App，假如不兼容原有的 App，就相当于放弃这个得来不易的优势，是很不明智的。

每当 iPhone 的屏幕有所变化，比如 iPhone 3GS 过渡到 iPhone 4, iPhone 4 过渡到 iPhone 5, iPhone 5 过渡到 iPhone 6，苹果公司都需要想办法来解决上述的兼容问题。

为了野肢运行之前的 App，引入一个新的概念 point(点)。点这个概念在 iOS 开发中十分重要，而实际用户很少关注。iPhone 4 屏幕尺寸继卜盯续保持 320 x 480，不过单位并非是像素，而是点。

在 iPhone 3GS 中，1 个点等于 1 个像素。也就是说，点跟像素可以直接互换。

在 iPhone 4 中，1 个点等于 2 个像素。

这篇文章中，我将点和像素当成一维的长度单位，而非二维的面积单位，这样对于我来说更自然些，因此 1 个点等于 2 个像素。别的文章中可能会说 1 个点等于 4 个像素，其实是指 1 个点占据了 4 个像素的面积，这样也没有说错，注意上下文语境。

iPhone 4 和 iPhone 3GS 的屏幕尺寸实际上是一样的，都是 3.5 英寸。同样一个点，实际尺寸看起来是一样的。只是 iPhone 4 在单位英寸上像素更多，看起来更细腻。

开发 iOS 的时候，使用点作为基本单位会更加方便，列表对比：

45.jpg

这里的屏幕模式可以初步理解成，一个点等于多少个像素。2x，就是 1 个点等于 2 个像素。

1、调整小程序的宽度，使其适应屏幕宽度；

2、把游戏界面的内容缩小，使磨誉其适应屏幕宽度；

3、使用媒体查询，根据屏幕宽度调整瞎悉段游戏界面的布局；

4、使用响应式布局陆陆，根据屏幕宽度调整游戏界面的布局；

5、使用CSS3的flex布局，根据屏幕宽度调整游戏界面的布局。

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。

规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物敏丛理像素，1rpx = 0.5px = 1物理像素。桥老樱

设备rpx换算px (屏幕宽度/750)px换算rpx (750/屏幕宽度)iPhone5 1rpx = 0.42px 1px = 2.34rpx iPhone6 1rpx = 0.5px 1px = 2rpx iPhone6s 1rpx = 0.552px 1px = 1.81rpx 微信小程序也支持rem尺寸单位，rem和rpx的换算关系：rem: 规定屏幕宽度为20rem；1rem = (750/20)rpx 注：开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。

所以：设计稿使用设备宽度750px比较容易计算750px的话1rpx=1px，这样的话，设计图上量出来的尺寸是多少px就是多少rpx，至于在不同的设备上实际上要换算成多少个rem就交给小程序自己含穗换算。

转换规律：

设计稿是375px：1rpx=0.5px

设计稿是750px: 1rpx=1px

---