写点什么

华为发布折叠屏官方适配方案

  • 2019-03-18
  • 本文字数:2674 字

    阅读完需:约 9 分钟

华为发布折叠屏官方适配方案

2 月底,在西班牙巴塞罗那召开的 MWC2019 华为终端全球发布会上,华为正式发布了 5G 折叠屏手机 HUAWEI Mate X,同时,华为也宣布这款手机将在今年年中上市,消息一出,瞬间刷爆朋友圈。关于这款手机背后的黑科技,相信大家都已经有所了解,我们就不再展开讨论,对于开发者来说,最关心的莫过于折叠屏的适配问题,对此,我们联系到了华为终端的相关技术专家,为大家获取了折叠屏的官方适配方案,以下全文就是适配文档。

背景和范围

此文档针对华为 Mate X 以及后续可能的折叠屏产品,提供应用适配的规格要求描述,以及适配指导。以确保应用在折叠屏显示各种形态下,皆可以布局正确,显示美观,并且屏幕物理形态切换时,应用尽可能做到不重启,不中断当前用户业务。

适用范围

文档适用于 Android 平台 APP 相关的设计,开发,测试人员等。

规格描述

Mate X 物理形态概述


对于通用软件,可能存在如下形态,即:


  • 展开态,全屏点亮工作;

  • 折叠主屏态:折叠态,主屏工作;

  • 折叠副屏态:折叠态:副屏工作。

静态适配需求规格描述

大屏静态显示规格:



大屏规格定义:应用在大屏展开下,可以撑满全屏显示,且在横竖屏切换形态下,布局和操作按键都正常,不出现任意方向的黑边。


如上图,A 图为撑满全屏,OK、BCD 都是错误的适配规格。

主屏静态显示规格

屏幕比例:19.5 : 9


参照下图:


副屏静态显示规格

副屏规格:25 :9


副屏下,默认不以全屏显示,以主屏比例显示,即在副屏下也显示 19.5:9 居下显示。应用只需要做好 19.5:9 的适配即可,副屏以 19.5:9 在屏幕下方显示由系统统一控制。


动态适配需求规格描述

说明:


(1)任意形态下打开一个应用,满足以上静态显示规格;


(2)当用户物理形态切换时,应用需要做到不重启应用,并自动在新的设备形态下按照静态规格布局。


即:在用户进行展开,折叠等操作, 应用任务不中断,自动适应各种屏幕下的静态布局规格。


设计和开发指导

大屏布局 UI 设计指导

如下适配建议以及各应用适合适配类型,仅作为推荐性建议,具体由应用根据各自业务特性进行针对性设计。

适配建议一:X 轴方向自适应

说明:


即,尽量保持 Y 轴方向上元素不变,X 轴方向上自适应。


示例:





范围(推荐性):适用于界面元素相对单一,没有大量列表类、或较多显示元素的页面。

适配建议二:布局内容扩展

说明:参考 pad 布局显示更多内容,对于区分了手机和 pad 布局的应用,在展开态优先考虑参考 pad 的大屏布局适配展开态界面,显示更多内容;尽量保证 Y 轴方向元素的不变。


示例:




范围(推荐性):一般适用于 WEB 类应用,页面特征一般为元素多,适配原则以尽量显示较多元素优先。

适配建议三:分栏布局

说明:对于设计过分栏能力的模块,需要在展开态体现分栏布局。


示例:



范围:一般有明显 list 二级菜单的元素结构比较适合。

适配建议四:横竖屏布局一致

说明:考虑到展开态 8:7.1 的比例,展开态的横屏和竖屏建议一套布局。横竖一致;不对展开态的横屏特殊处理,挪移布局不用体现。


示例:



适配开发指导

开发约束

说明:具备 8:7.1, 19.5:9, 25:9, 三种可能的显示形态。


强烈建议应用支持可变比例显示(resizeable),在可预见的屏幕比例范围内,都可以做到良好适配。且在比例切换时,应用能够自己处理 screenSize 变化,不需要重走生命周期。总结来说,即要求应用可以完全支持自适应布局,无论静态还是场景切换下。

适配规格:支持热切换能力

应用适配折叠屏需要做“屏幕比例适配”和“切换显示比例应用不重启适配”。

屏幕比例适配

适配方式 1:应用支持自适应能力(推荐)


应用只要能做到自适应,在任意比例的屏幕都能做到全屏显示。


1.应用如何申明自适应



2.设置方法:在 manifest 文件的或节点中设置 android:resizeableActivity 的值为 true,可声明应用支持自适应显示,Activity 将能以分屏和 freeform 模式启动。


android:resizeableActivity=["true" | "false"]
复制代码


适配方式 2:设置应用支持的最大比例和最小比例适配


为保证应用在主副屏或者大屏态能保证满屏显示,请尽快确保应用可以支撑较高范围的宽高比,避免后续反复适配,华为建议最高宽高比支持到 2.4 或者更大(可以确保在主屏、辅屏下满屏显示,如果设置的比例小于 2.4 可能因为最终屏幕比例与当前规格存在差异引起应用无法全屏显示),最小宽高比为 1:1(可以确保在展开态大屏下满屏显示)。


最大宽高比申明: maxaspecratio:2.4(2.4 表明在主副屏下满屏显示)


Android 7.1 及以下版本,在 manifest 文件的<application>节点中增加 <meta-data>数据,设置最大支持比例:


<meta-data android:name="android.max_aspect" android:value="2.4" />
复制代码


Android 8.0 及以上版本,在 manifest 文件的 <activity> 节点中增加 android:MaxAspectRatio 属性,声明最大支持比例:


< activity android:maxAspectRatio="2.4">     ...    </activity>
复制代码


最小宽高比申明: minaspectratio:1.0 (App | Activity Level )


Q 之前版本:在 manifest 文件的 <application>节点中增加 <meta-data>数据,设置最小支持比例(声明为 1.0 即表示在展开态大屏下满屏显示):


< meta-data android:name="android.min_aspect" android:value="1.0" />
复制代码


Q 版本之后支持:在 manifest 文件的 <activity>节点中增加 android:MinAspectRatio 属性,声明最小支持比例:


 <activity android:minAspectRatio="1.0">     ...    </activity>
复制代码

切换显示比例应用不重启适配

应用如何自处理 screenSize 事件,确保热切换时不重走生命周期。


在 manifest 文件的 <activity> 节点中的 android:configChanges 属性增加 screenSize|orientation|smallestScreenSize 字符串,当屏幕比例变化时,系统会回调 Activity 的 onConfigurationChanged() 方法,而避免 Activity 重新启动。


android:configChanges="screenSize|orientation|smallestScreenSize"
复制代码


应用复写 onConfigurationChanged() 方法,在方法中实现针对不同比例下界面布局的相应调整,如切换布局、调整控件位置和间距等。

调试

模拟调试

如果开发者没有折叠屏手机,可以通过修改屏幕分辨率来模拟调试:


1.主屏(折叠)切全屏(展开)模拟方法:


  • 预先将手机设置主屏分辨率:


adb shell wm size 1136x2480


  • 通过修改手机分辨率为全屏分辨率模拟状态切换:


adb shell wm size 2200x2480


2.全屏(展开)切主屏(折叠)模拟方法:


  • 预先将手机设置全屏分辨率:


adb shell wm size 2200x2480


  • 通过修改手机分辨率为主屏分辨率模拟状态切换:


adb shell wm size 1136x2480


现在华为官网已经上线预约 Mate X 适配真机测试的活动,有兴趣的开发者可通过此链接了解:


https://developer.huawei.com/consumer/cn/activity/709


更多内容,请关注前端之巅。



2019-03-18 08:0022972

评论

发布
暂无评论
发现更多内容

安卓App和鸿蒙App有什么不同?

InfoQ IT百科

linux之fping命令

入门小站

Linux

有哪些比较靠谱的低代码开发平台?

InfoQ IT百科

软件激活码是什么?

InfoQ IT百科

趁着同事玩游戏偷偷认识k8s一家子补补课

囧么肥事

Kubernetes 容器 云原生 k8s Kubernetes 集群

DAO社区的胜利,Tiger DAO VC胜在治理与共识

西柚子

【漏洞分析】jdk9+Spring及其衍生框架

网络安全学海

网络安全 信息安全 渗透测试 WEB安全 漏洞挖掘

现在企业开发哪种APP有前景?

源字节1号

微信小程序 软件开发 前端开发 后端开发

如何部署自己的网站?

InfoQ IT百科

目前WPS支持在哪些设备上使用?

InfoQ IT百科

极致体验,揭秘抖音背后的音视频技术

火山引擎边缘云

音视频 边缘计算 音视频技术

在线YAML转HTML工具

入门小站

工具

低代码开发平台能开发哪些应用?

InfoQ IT百科

appdata是什么文件夹?

InfoQ IT百科

做 App 还是小程序好?

InfoQ IT百科

DAO社区的胜利,Tiger DAO VC胜在治理与共识

小哈区块

未来几年如何把握住音视频开发的大浪潮,音视频高级开发工程师培养计划

赖猫

音视频 编程开发 音视频开发

浅析分布式系统之体系结构 技术基本目标----一致性(单对象、单操作)

snlfsnef

分布式 系统设计 基本原则 一致性 设计思想

关于缓存更新的一些可借鉴套路

架构精进之路

缓存 4月日更 4月月更

WPS是什么软件?

InfoQ IT百科

使用WPS需要注册/登录账号吗?

InfoQ IT百科

zip格式的文件怎么打开?

InfoQ IT百科

利用 Dio 完成数据更新的 Patch 请求

岛上码农

flutter 安卓开发 4月月更 跨平台开发 ios 开发

云原生新时代弄潮儿k8s凭什么在容器化方面独树一帜?

囧么肥事

Kubernetes 容器 k8s 容器服务 Kubernetes 集群

架构实战营作业三

热猫

残酷春天里的中国科技(四):跨越地方保护主义

脑极体

WordPress 是什么?

InfoQ IT百科

如何隐藏电脑上的文件?

InfoQ IT百科

外包学生管理系统--架构详细设计方案

凯博无线

SOFARegistry 源码|数据分片之核心-路由表 SlotTable 剖析

SOFAStack

GitHub 开源 程序员 开发者 源码解析

基于DDD思想的技术架构战略调整

Qunar技术沙龙

DDD 构架

华为发布折叠屏官方适配方案_大前端_华为开发者联盟_InfoQ精选文章