VIVO高长宽比设备应用适配指导意见

一、 适配背景

目前vivo有意向采用1080×2400/1080×2460/1080×2520等更高长宽比分辨率,经测试发现有些游戏和应用存在异常边、花边、裁切、黑边过大等情况,为避免以上情况,需要对这些游戏和应用进行相应适配调整。建议游戏或应用适配时考虑更大屏幕比例的情况,提高不同屏幕比例的兼容性;同时建议不要固定屏幕比例来判断适配,这样会导致游戏或应用只能兼容固定屏幕比例。

二、调整意见

1、游戏logo或背景出现异常边

描述:logo或背景两侧,出现黑边、蓝边、白边等异常边。

原因:logo或背景宽高比例过小。

措施:建议采用第一条。

(1)提供宽高比例更大的logo或背景;

(2)优先匹配屏幕高度,宽度可稍微裁切(不影响用户体验);

(3)比例相差不大的情况下,可适度拉伸(不影响用户体验)。

2、游戏出现异常边

描述:游戏两侧出现黑边、蓝边、白边等异常边。

原因:游戏固定了宽高或屏幕比例。

措施:请参见第6条获取屏幕宽高,确保背景和游戏能充分铺满屏幕。

游戏各种按钮、状态栏等需要根据屏幕宽高,调整对屏幕相对位置,确保显示完整、布局美观。

3、游戏两边出现花边

描述:游戏两侧出现杂色边,后面内容覆盖了之前内容。

原因:游戏固定了宽高或屏幕比例,后续某帧超过该比例,造成花边。

措施:请参见第6条获取屏幕宽高,确保背景和游戏能充分铺满屏幕。

游戏各种按钮、状态栏等需要根据屏幕宽高,调整对屏幕相对位置,确保显示完整、布局美观。 

4、视频两边出现裁切

描述:播放视频时,视频宽度上发生裁切,造成显示内容变少。

原因:视频优先匹配高度,造成宽度上内容裁切。

措施:请参见第6条获取屏幕宽高,将优先适配高度,改为优先适配宽度,保证视频内容的完整性,并合理安排其他布局。

5、应用底部黑边过大

描述:应用底部黑边过大,底部文字、对话框等位置偏上,造成显示不美观。

原因:屏幕比例变大时,底部黑边相应变大,但是底部文字、对话框等未按屏幕高度动态调整,而是固定了与视频的相对位置。

措施:请参见第6条获取屏幕宽高,然后根据屏幕高度,向下动态调整文字或对话框的相对位置,使显示更美观。

6、获取屏幕宽高方法

(1)获取屏幕物理宽高

建议游戏或满屏应用使用,获取屏幕真实物理宽高。

    WindowManager manager = this.getWindowManager();
    Point outSize = new Point();

Display display = manager.getDefaultDisplay();
    display.getRealSize(outSize);
    int width = outSize.x; //屏幕物理宽度
    int height = outSize.y; //屏幕物理高度

(2)获取应用宽高

建议非满屏应用使用,在某些情况下,应用宽高和屏幕物理宽高有差异。

如在有导航栏、刘海、非透明状态栏等情况下,可以使用以下方法获取实际应用宽高。

WindowManager manager = this.getWindowManager();

DisplayMetrics outMetrics = new DisplayMetrics();

Display display = manager.getDefaultDisplay();

display.getMetrics(outMetrics);

int width = outMetrics.widthPixels; //应用宽度

int height = outMetrics.heightPixels; //应用高度

三、模拟验证

使用分辨率为1080的屏幕,比例任意的手机:

1、进入开发者选项,打开USB调试;

2、电脑进入cmd命令行,输入”adb devices”,确保能连上手机;

3、Cmd命令行输入:”adb shell wm size 1080×2400/1080×2460/1080×2520”

模拟分辨率为1080×2400/1080×2460/1080×2520的情况;

4、测试应用或游戏,是否出现黑边、花边、裁切等情况;

5、测试完毕,cmd命令行输入:”adb shell wm size reset”,恢复屏幕分辨率。

vivo小窗适配指南

1、小窗功能介绍

vivo全局小窗在安卓原生的多窗口功能基础上,进行了一系列的优化和创新。以小窗的形式展现应用,并支持不同窗口形式(小窗、分屏、全屏)之间快速切换。
小窗入口包括但不限于:近期任务卡片“小窗”选项,应用内滑、悬浮通知下拉等。用户可以通过 设置-快捷与辅助-多任务 路径进入多窗口功能设置页,了解相关功能介绍。
(注:不同机型、不同版本表现可能有所差异)。

2、小窗应用适配关键点

应用适配全局小窗时,因一些容易被忽略的适配点,导致应用进入小窗模式后出现兼容性问题。为此,我们整理了全局小窗应用适配的五大关键点,帮助开发者快速适配。

2.1 声明支持多窗口模式
应用适配全局小窗需要先声明支持安卓原生多窗口,和多窗口适配策略相同,都需在 [activity] 或 [application] 节点中添加 android:resizeableActivity 属性。

参考代码:

<application
    android:name=".MyActivity"
    android:resizeableActivity="true" />

安卓官方多窗口适配参考链接:https://developer.android.com/guide/topics/ui/multi-window.html

2.2 正确处理Configuration变化
在应用横竖屏旋转和窗口大小变化时,如需自行处理多窗口配置,请设置android:configChanges属性,之后Activity和 Fragment将收到 onConfigurationChanged()方法回调,而不是先销毁再重建。
在管理视图更新、重新加载资源等工作时,注意不要沿用之前的Config信息,而需重新获取最新的资源信息。参考代码:

<activity
  android:name=".MyActivity"
  android:configChanges="screenSize | smallestScreenSize 
		| screenLayout | orientation" />

2.3 正确启动Activity的task
应用需给Activity设置独立的android:taskAffinity属性,以防因继承rootActivity的多窗口属性导致无法启动到小窗模式。
因为task中的Activity会继承rootActivity的多窗口属性。如果启动该task的rootActivity是unresizable的,则即使要启动的Activity是resizable的也无法启动到小窗模式。
参考代码:

<activity
  android:name=".MyActivity"
  android:taskAffinity="com.test.example" />

2.4 正确使用Context
应用在适配小窗模式时,应使用Activity的Context加载合适的资源和计算相对位置。
在应用进程中,存在Application和Activity两类Context,其中Application Context对应的是屏幕资源信息,而Activity Context对应的是窗口的资源信息。
如果应用在小窗模式下使用的是 Application Context处理UI 相关的操作,会导致加载的资源因无法感知到小窗而显示异常。
Activity如何获取特定窗口类型下的窗口尺寸,参考代码:
java:

int screenWidthDp = getResources().getConfiguration().screenWidthDp;
int screenHeightDp = getResources().getConfiguration().screenHeightDp;

kotlin:

val screenWidthDp: Int = resources.configuration.screenWidthDp
val screenHeightDp: Int = resources.configuration.screenHeightDp

2.5 正确处理小窗下的沉浸式
小窗模式下,应用顶部有个功能bar,应用在沉浸式适配时需为此功能bar预留一定空间。因此应用在布局时,需要监听安卓原生的WindowInsetsListener接口回调,针对captionBarInsets变化来处理view高度,注意不要使用固定高度!!!

参考代码:
java:

getWindow().getDecorView().setOnApplyWindowInsetsListener((v, insets) -> {
    //应用在回调中计算view高度
    return insets;
});

kotlin:

window.decorView.setOnApplyWindowInsetsListener { v: View?, insets: WindowInsets ->
    //应用在回调中计算view高度
    insets
}

2.6 其他界面布局建议
• 布局参数尽量使用相对的布局参数,不要使用固定尺寸
• 避免根据屏幕大小,输入法高度等计算view的布局参数,如设置popwindow、dialog等子窗口的位置时,避免使用整个屏幕的相对位置
• 避免对DecorView,content等根布局进行定制,比如设置DecorView的背景、在DecorView添加子布局等
• 注意生命周期处理,如小窗模式下出现页面点击、拖动无响应问题,可能跟布局或生命周期有关
• 避免根据物理屏幕方向设置当前功能或布局