正式定档!QCon 北京站改期为2024年4月11-13日,地点:北京·国测国际会议会展中心 >>> 了解详情
写点什么

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

  • 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:0021638

评论

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

代码整洁之道

田维常

代码

2021年的28天写作,从微信视频号开始

赵新龙

法庭上的CTO 28天写作

大作业一:架构设计方案评审

Nick~毓

Kube-OVN 0.5.0 发布,支持 NetworkPolicy、用户自定义网卡和MTU

York

灵雀云 Kubernetes k8s Kube-OVN

Kube-OVN 0.6.0 发布,支持 IPv6、流量镜像及更多功能

York

灵雀云 Kubernetes k8s Kube-OVN

Kube-OVN v 0.7.0 发布,IPAM、子网和安全功能增强

York

灵雀云 Kubernetes k8s Kube-OVN

架构师训练营技术知识点

三板斧

架构师训练营第 1 期

软件界旷世之架:测试驱动开发(TDD)之争

华为云开发者联盟

软件 测试 TDD 代码 devcloud

Yarn RM写ZNode超数据量限制bug修复

笨小康

大数据 zookeeper YARN

“持证”就能上岗 京东绿色内推招聘通道开启

京东科技开发者

云计算 大数据 程序人生

同城快递系统-大作业

三板斧

极客时间架构师一期

中国特色新基建可视化,工程监控画面还能这么美?你绝对没见过

一只数据鲸鱼

物联网 新基建 数据可视化 绿色工业

电商后链路如何做好私域运营?

Linkflow

客户数据平台 CDP 客户画像

SpringCloud从入门到精通01---父项目创建

Felix

SpringCloud Eureka 高可用架构

再谈自研开源Kube-OVN, 设计思路及实现原理

York

灵雀云 Kubernetes k8s Kube-OVN

Python进阶系列文章汇总

Kaito

Python 爬虫

剖析JDK:强引用、软引用、弱引用、虚引用有何区别?

后台技术汇

28天写作

技术实录 | 灵雀云基于 OVN 的 Kubernetes 网络架构解析

York

灵雀云 Kubernetes k8s Kube-OVN

SpringCloud从入门到精通02---支付模块01

Felix

Kube-OVN v0.9.0更新,网络可视化和控制平面稳定性提升

York

灵雀云 Kubernetes k8s Kube-OVN

教小师妹快速入门Maven,嘿嘿嘿...

田维常

maven

OVS 设计与实现阅读笔记,五年前的这篇论文里这些问题已经明了

York

Kubernetes k8s Kube-OVN

灵雀云Kube-OVN:基于OVN的开源Kubernetes网络实践

York

灵雀云 Kubernetes k8s Kube-OVN

容器网络方案调研:都是网络插件,Kube-OVN凭啥脱颖而出?

York

灵雀云 Kubernetes k8s Kube-OVN

软件测试--缺陷报告

测试人生路

软件测试

Kube-OVN再更新! v0.8.0 支持网关高可用以及网络监控集成

York

灵雀云 Kubernetes k8s Kube-OVN

腾讯大佬亲自总结出“Java知识地图+学习路线”从点到面一应俱全!不看血亏

比伯

Java 编程 架构 程序人生 计算机

一个20年技术老兵的 2020 年度技术总结

万俊峰Kevin

微服务 go-zero Go 语言

2021年阿里巴巴面试参考指南泰山版开源(Java版)

Java架构追梦

Java 架构 面试 分布式 微服务

灵雀云开源项目 Kube-OVN 亮相开源基础设施峰会

York

灵雀云 Kubernetes k8s Kube-OVN

一份阿里Java学习路线出现“病毒式”传播,导致44人秋招同时拿到offer

Java架构师迁哥

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