概述
平行视界是多窗口交互服务的其中一种，平行视界是以界面为基本单位实现应用内双窗口显示的系统侧解决方案。
应用可以根据自身业务设计双窗口显示界面组合，以实现符合应用逻辑的最佳单应用多窗口用户体验。适用于办公、邮箱、IM、电商等效率类或需要频繁来回切换的应用。HarmonyOS对于折叠屏展开态、平板横屏设备支持平行视界。用户应用程序可以根据自身业务特点，设计最佳的双窗口组合体验，如社交类应用的“列表+聊天”，购物类应用的“双窗口比价”等。
平行视界的开发分为两步：
- 在config.json中声明支持平行视界。
- 在src -> main -> resources -> rawfile目录下增加easygo.json配置文件，实现平行视界显示策略配置。
正文
1. 安装和配置DevEco Studio 3.0 Beta
DevEco Studio 3.0 Beta下载
DevEco Studio 3.0 Beta安装
2. 创建一个Empty Ability应用
DevEco Studio下载安装成功后，打开DevEco Studio，点击左上角的File，点击New，再选择New Project，选择Empty Ability选项，点击Next按钮。
将文件命名为Mydemo1（文件名不能出现中文或者特殊字符，否则将无法成功创建项目文件），Project Type勾选Application，选择保存路径，Language勾选Java，选择API 6，设备勾选Tablet，最后点击Finish按钮。
| 选择Empty Ability | 配置文件信息 |
|---|---|
|
|
|
3. 编写简单逻辑代码
代码文件结构如下：
在com.test.mydemo1目录下创建RightAbility文件后，代码有作修改的如下：
ability_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:alignment="center"
ohos:orientation="vertical">
<Text
ohos:id="$+id:text_helloworld"
ohos:height="match_content"
ohos:width="match_content"
ohos:background_element="$graphic:background_ability_main"
ohos:layout_alignment="horizontal_center"
ohos:text="这是MainAbilitySlice页面"
ohos:text_size="40vp"
/>
<Button
ohos:id="$+id:btn"
ohos:height="match_content"
ohos:width="match_content"
ohos:background_element="#888888"
ohos:layout_alignment="horizontal_center"
ohos:text="跳转到RightAbilitySlice页面"
ohos:text_size="40vp"
/>
</DirectionalLayout>
ability_right:
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:alignment="center"
ohos:orientation="vertical"
ohos:background_element="#DDDDDD">
<Text
ohos:id="$+id:text_helloworld"
ohos:height="match_content"
ohos:width="match_content"
ohos:layout_alignment="horizontal_center"
ohos:text="这是RightAbilitySlice页面"
ohos:text_size="40vp"
/>
<Button
ohos:id="$+id:btn"
ohos:height="match_content"
ohos:width="match_content"
ohos:background_element="#888888"
ohos:layout_alignment="horizontal_center"
ohos:text="返回到MainAbilitySlice页面"
ohos:text_size="40vp"
/>
</DirectionalLayout>
MainAbilitySlice.java:
public class MainAbilitySlice extends AbilitySlice {
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_ability_main);
findComponentById(ResourceTable.Id_btn).setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
Operation operation = new Intent.OperationBuilder()
.withDeviceId("")
.withBundleName(getBundleName())
.withAbilityName(RightAbility.class.getName())
.build();
intent.setOperation(operation);
startAbility(intent);
}
});
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
}
RightAbilitySlice.java:
public class RightAbilitySlice extends AbilitySlice {
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_ability_right);
findComponentById(ResourceTable.Id_btn).setClickedListener(new Component.ClickedListener() {
@Override
public void onClick(Component component) {
terminateAbility();
}
});
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
}
4. 在config.json中声明支持平行视界
config.json配置文件的module对象中新增metaData：
"metaData": {
"customizeData": [
{
"name": "EasyGoClient",
"value": "true"
}
]
}
5. 创建平行视界配置文件easygo.json
在src -> main -> resources -> rawfile目录下增加easygo.json配置文件：
{
"easyGoVersion": "1.0",
"client": "com.test.mydemo1",
"logicEntities": [
{
"head": {
"function": "magicwindow",
"required": "true"
},
"body": {
"mode": "1",
"abilityPairs": [
{
"from": "com.test.mydemo1.MainAbility",
"to": "com.test.mydemo1.RightAbility"
}
],
"Abilities": [
{
"name": "com.test.mydemo1.MainAbility",
"defaultFullScreen": "false"
},
{
"name": "com.test.mydemo1.RightAbility",
"defaultFullScreen": "false"
}
],
"UX": {
"isDraggable": "true"
}
}
}
]
}
上述代码easygo.json配置文件的相关元素的描述如下：
{
"easyGoVersion": 必选,固定值为"1.0",
"client": 必选,该程序的应用包名,
"logicEntities": [
{
"head": {
"function": 必选,调用组件名,固定值为"magicwindow",
"required": 必选,预留字段,固定值为"true"
},
"body": {
"mode": 必选,基础分屏模式."0":购物模式,abilityPairs节点不生效;"1":自定义模式(包含导航模式),
"abilityPairs": [自定义模式下必选,配置从from页面到to页面的分屏显示
{
"from": 自定义模式下必选,AbilityA的包名,
"to": 自定义模式下必选,AbilityB的包名,
}表示A上启动B,触发分屏(A左B右)
],
"Abilities": [可选,应用Page Ability属性列表,
{
"name": 可选,Page Ability包名,
"defaultFullScreen": 可选,Page Ability是否支持默认以全屏启动."true": 支持;,"false": 不支持
},
{
"name": 可选,Page Ability包名,
"defaultFullScreen": 可选,Page Ability是否支持默认以全屏启动."true": 支持;,"false": 不支持
}
],
"UX": {可选,页面UX控制配置
"isDraggable": 可选,是否支持分屏窗口拖动(仅针对平板产品生效)."true": 支持;,"false": 不支持(缺省值为false)
}
}
}
]
}
平板横屏的运行效果如下：
6. 添加复杂逻辑代码
具体代码见附录文件，代码文件结构如下：
7. 完善easygo.json配置文件
{
"easyGoVersion": "1.0",
"client": "com.test.mydemo1",
"logicEntities": [
{
"head": {
"function": "magicwindow",
"required": "true"
},
"body": {
"mode": "1",
"abilityPairs": [
{
"from": "com.test.mydemo1.MainAbility",
"to": "com.test.mydemo1.RightAbility"
},
{
"from": "com.test.mydemo1.RightAbility",
"to": "com.test.mydemo1.RightAbility2"
}
],
"Abilities": [
{
"name": "com.test.mydemo1.MainAbility",
"defaultFullScreen": "false"
},
{
"name": "com.test.mydemo1.RightAbility",
"defaultFullScreen": "false"
},
{
"name": "com.test.mydemo1.RightAbility2",
"defaultFullScreen": "false"
},
{
"name": "com.test.mydemo1.RightAbility3",
"defaultFullScreen": "false"
}
],
"UX": {
"isDraggable": "true"
}
}
}
]
}
平板横屏的运行效果如下：
| 图1 | 图2 | 图3 |
|---|---|---|
|
|
|
|
总结
从上述easygo.json文件可以看出，配置文件只设置了MainAbility|RightAbility和RightAbility|RightAbility2（A|B表示A左B右分屏），但是从运行效果可以发现以下四点内容：
- 若配置了A|B，则在A上启动B，触发双窗口显示（A左B右），但在B上启动A不会触发平行视界双窗口，如正文的第五点的运行效果。
- 若配置了A|B、B|C，没有配置A|D，则A左B右分屏时，B触发C，B左移，C右侧显示，即B左C右分屏；但无论从左或右触发D，都右侧显示D，即A左D右分屏，如图1所示。
- 没有配置B|D，则D窗口跟随B此时的显示方式。如果B此时是全屏，则全屏显示D；如果B此时是双窗口，则D在双窗口右边显示，即B左D右分屏，如图2所示。
- 返回页面切换和跳转显示页面基本为相反的过程，如图3所示。
最后
有很多小伙伴不知道学习哪些鸿蒙开发技术？不知道需要重点掌握哪些鸿蒙应用开发知识点？但是又不知道从哪里下手，而且学习时频繁踩坑，最终浪费大量时间。所以本人整理了一些比较合适的鸿蒙（HarmonyOS NEXT）学习路径和一些资料的整理供小伙伴学习
点击领取→纯血鸿蒙Next全套最新学习资料希望这一份鸿蒙学习资料能够给大家带来帮助，有需要的小伙伴自行领取~~
一、鸿蒙（HarmonyOS NEXT）最新学习路线
有了路线图，怎么能没有学习资料呢，小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的鸿蒙（OpenHarmony ）学习手册（共计1236页）与鸿蒙（OpenHarmony ）开发入门教学视频，内容包含：（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等）鸿蒙（HarmonyOS NEXT）…等技术知识点。
获取以上完整版高清，请点击→纯血版全套鸿蒙HarmonyOS学习资料
二、HarmonyOS Next 最新全套视频教程
三、《鸿蒙 (OpenHarmony)开发基础到实战手册》
OpenHarmony北向、南向开发环境搭建
四、大厂面试必问面试题
五、鸿蒙南向开发技术
六、鸿蒙APP开发必备
完整鸿蒙HarmonyOS学习资料，请点击→纯血版全套鸿蒙HarmonyOS学习资料
总结
总的来说，对于大家来说ye是一个挑战，也是一个机会。只有积极应对变化，不断学习和提升自己，他们才能在这个变革的时代中立于不败之地。
扫一扫
1059
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
