vivo 互联网客户端团队- Xu Jie
日益新增的机型，给开发人员带来了很多的适配工作。代码能不能统一、apk能不能统一、物料如何选取、样式怎么展示等等都是困扰开发人员的问题，本方案就是介绍不同机型的共线方案，打消开发人员的疑虑。
一、日益纷繁的机型带来的挑战
1.1 背景
科技是进步的，人们对美的要求也是逐渐提升的，所以才有了现在市面上形形色色的机型
（1）比如vivo X60手机采用纤薄曲面屏设计，属于直板机型。
（2）比如vivo 折叠屏高端手机，提供更优质的视觉体验，属于折叠屏机型。
（3）比如vivo pad，拥有优秀的操作手感和高级的质感，属于平板机型。
1.2 我们的挑战
在此之前，我们主要是为直板手机去服务，我们的开发只要适配这种主流的直板机器，我们的UI主要去设计这种直板手机的效果图，我们的产品和运营主要为这种直板机型去选择物料。
可是随着这种形形色色机型的出现，那么问题就来了：
（1）开发人员的适配成本高了，是不是针对每一种机型，都要做个单独的应用进行适配呢？
（2）UI设计师要做的效果图要多了，是不是要针对每种机型都要设计一套效果图呢？
（3）产品和运营需要选择的物料更受限制了，会不会这个物料在一个机器上正常。在其他机器上就不正常了呢？
为什么这么说，下面以开发者的角度来做介绍，把我们面临的问题，做说明。
二、 开发者的窘境
2.1 全机型适配成本太高
日渐丰富的机型适配让我们这些android开发人员疲于奔命，虽然可以按照要求进行适配，但是大屏幕的机型适配成本依然比较高，因为这些机型不同于传统的直板手机的宽高比例（9:16）。所以有的应用干脆就直接两边留白，内容区域展示在屏幕正中央，这种效果，当然很差。
案例1：某个视频APP页面，未做pad上的适配，打开之后的效果如下，两边大量留白，是不可操作的区域。
案例2：某新闻资讯类APP，在pad上的适配效果如下，可见的范围内，信息流展示内容较少，图片有拉伸、模糊的问题。
2.2 全机型适配成本高在哪
上面的案例其实只是表面的问题之一，作为开发人员，需要考虑的因素有很多，首先要想到这些机型有什么特点：
然后才是需要解决的问题：
三、寻找全机型适配方案之旅
3.1 方案讨论与确定
页面拉伸、左右留白是现象，这也是用户的直接体验。那么这就是我们要改善的地方，所以现在就有方向了，围绕着 “如何在可见区域内，展示更多的信息” 。这不是布局的简单重新排列组合，因为 方案绝对不是只有开发决定如何实现就可以怎么实现的，一个apk承载着功能到用户手里涉及了多方角色的介入。产品经理需要整理需求、运营人员需要配置物料、发布apk，测试需要测试等等，所以最终的方案不是一方定下来的，而是一个协调统一后的结果。
既然要去讨论方案，那么就要有依据，在此省略讨论、评审、定稿的过程。
先来看看直板、折叠屏、pad的外部轮廓图，知道页面形态如何。
3.2 方案落地示意图
每个应用要展示的内容不一致，但是原理一致，此处就以下面几个样式为基础介绍原理。原则也比较简单，尽可能展示更多内容，不要出现大面积的空白区域。
下面没有介绍分栏模式的适配，因为分栏的模式也可能被用户关闭，最终成为全屏模式，所以说，可以选择只适配全屏模式，这样的适配成本较低。当然，这个也要根据自己模块的情况来确定，比如微信，更适合左右屏的分栏模式。
3.2.1 直板机型适配方案骨骼图
直板机型，目前主流的机型，宽高比基本是9:16，可以最大限度地展示比较多的内容，比如下图中的模块1、模块2、 模块3的图片。
3.2.2 折叠屏机型适配方案骨骼图
折叠屏机型，屏幕可旋转，但是宽高比基本是1:1，高度和直板机器基本差不多，可以达到2000px的像素，所以在纵向上，也可以最大限度地展示比较多的内容，比如下图中的模块1、模块2、 模块3的图片。
3.2.3 PAD机型适配方案骨骼图
pad平板，屏幕可旋转，并且旋转后的宽高比差异较大，纵向时，宽高比是5 : 8，横向时，宽高比是8 : 5。
在pad纵向时，其实高度像素是足够展示很多内容的，比如下图中的模块1、模块2、 模块3的图片；
但是在pad横向时，没办法展示更多的内容（倒是有个方案，最后再说），只能下图中的模块1、模块2的图片。
3.3 方案落地规范
3.3.1 一套代码适配所有机型
确定一个apk能不能适配所有机型，首先要解决的是要符合不同机型的特性，比如直板手机只能纵向显示，折叠屏和pad支持横竖屏旋转。
描述如下：
（1）需求
- 直板屏：强制固定竖屏；
- 折叠屏：外屏固定竖屏、内屏(大屏)支持横竖屏切换；
- PAD端：支持横竖屏切换；