报名参加CloudWeGo黑客松,奖金直推双丰收! 了解详情
写点什么

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

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

评论

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

CTF夺旗PWN题:二叉树的漏洞利用

网络安全学海

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

如何设计一款跨平台低延迟的RTMP|RTSP直播播放器

音视频牛哥

WebRTC HLS RTMP RTSP

公布半小时下载量达10W:阿里大牛出品「MyCat笔记」真香

热爱java的分享家

Java 面试 编程语言 经验分享 mycat

什么是微服务架构,有何优缺点?

雯雯写代码

微服务

提升软件开发效率,企业数字化转型更轻松?

行云创新

技术 云原生 开发 数字化转型

智慧园区综合管理平台系统开发,智慧园区综合能源管理系统方案

电微13828808271

如何利用EasyRecovery恢复c盘已删文档

淋雨

数据恢复

面试官:系统需求多变时如何设计?

Geek_1df311

程序员 架构 面试 计算机

宝马、西门子是如何开始DevOps 的?

飞算JavaAI开发助手

你不知道的$nextTick

CRMEB

TDSQL-C for MySQL版产品新特性

腾讯云数据库

tdsql 国产数据库

Go语言学习查缺补漏ing Day5

Regan Yue

Go 语言 11月日更

社交重构、游戏革新,万物皆可元宇宙?这场大会给你讲清楚了|活动预告

网易云信

人工智能 音视频 元宇宙

发布一个免费的 Elasticsearch 多集群监控和管理平台 - 极限数据平台

极限实验室

elasticsearch infini 极限实验室 极限数据平台 ES多集群管理

如何成为web安全工程师?

喀拉峻

网络安全 安全 信息安全

保姆级神器 Maven,再也不用担心项目构建搞崩了

沉默王二

Java maven

“阿里爸爸”又爆新作!Github新开源303页Spring全家桶高级笔记

热爱java的分享家

Java 面试 编程语言 经验分享 Spring全家桶

2022年游戏市场趋势——最后一个十亿蓝海待挖掘

游戏出海 手机游戏

TDSQL-C for MySQL版产品新特性

腾讯云数据库

数据库 tdsql

TDSQL MySQL版产品能力介绍及新特性

腾讯云数据库

数据库 tdsql

YU12 YV12 NV12 NV21区别

音视频牛哥

WebRTC RTMP RTSP yuv

CSS布局(三)之等分布局

Augus

CSS 11月日更

TDSQL Server产品新特性

腾讯云数据库

数据库 tdsql

质量基础设施一站式服务平台开发,国家NQI一站式云平台搭建

电微13828808271

打造一个物联网平台真的工程巨大吗?

Speedoooo

容器 ios开发 APP开发 Andriod开发

我以为自己MySQL够牛逼了,直到看到了Alibaba的面试题

热爱java的分享家

Java 面试 程序人生 编程语言 经验分享

第二届腾讯“开悟”大赛初赛放榜,强化学习研究还能这么快乐?

科技热闻

Stratifyd数据分析平台加盟腾讯云市场,赋能品牌消费洞察

深入理解 WKWebView(入门篇)

百度开发者中心

Webkit WKWebView

新来的00后真是卷王,工作没两年,跳槽到我们公司起薪26K

Geek_1df311

Java 程序员 架构 面试

白话 Linux 容器资源的隔离限制原理

恒生LIGHT云社区

Linux 运维

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