高效開發和創新業務是開發者一直追求的目標，當接到開發需求時，如果可以找到現成的API呼叫，能為開發者節省大把時間，將會留有更多的時間進行業務的創新。華為DevEco Studio聚合了華為豐富的開放能力，提供海量的API供開發者呼叫，**幫助開發者高效整合華為EMUI特色開放能力**，如平行視界。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415093020366.gif#pic_center)

**什麼是平行視界？**

---

平板處於手機與和電腦之間，最大的痛點是應用橫屏生態問題。大多數應用都是把手機APP直接平移到平板，使用者不能感知到平板的優勢。為了改善使用者體驗，從使用者痛點出發，華為推出了平行視界。

使用者在華為MatePad Pro上網購時，可以同時對比兩家商品資訊，還可以邊看新聞邊留言，邊聊著天邊刷朋友圈. 平行視界可以實現一個應用內的不同介面資訊，在左右兩個視窗同時顯示，將橫屏一分為二且兩邊操作互不干擾。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415093338801.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415093409981.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

**如何使用DevEco Studio快速實現平行視界?**

---

平行視界以Activity為基本單位，對Activity視窗生命週期管理進行改造，以左右視窗分離顯示技術、雙視窗生命週期管理、雙視窗顯示模式和切換邏輯為核心技術，來實現應用內分屏同時操作互不干擾的功能介面。

有三種視窗顯示模式供開發者選擇——不分屏模式、通用模式及自定義模式，開發者不需要進行單獨編碼，簡單配置工程後即可實現平行視界功能。

分屏設計規則

Common Mode：在該模式下，您可以設定Auto Split和Transition Activity。

Auto Split表示設定初始分屏ActivityPairs，如果使用者開啟應用時就分屏顯示，可以根據應用設定開啟時展示的左分屏和右分屏展示的Activity。Transition Activity中定義的Activity是過渡頁面（動畫），一般是在前一個頁面關閉後，後一個頁面拉起前顯示，防止APP頁面切換過於生硬。在Transition Activity中選中的Activity，在分屏設計中將無法被選擇。

− Custom Mode：在該模式下，可以設定Auto Split、Transition Activity和Custom Split。

其中Auto Split和Transition Activity同Common Mode模式完全一樣，Custom Split表示開發者可以自行定義分屏的規則。

我們可以認為Auto Split中定義的是一級頁面的佈局，而Custom Split中定義的是二級頁面的顯示規則。當在Auto Split中定義的頁面呼叫與Custom Mode中定義的規則匹配，將按照Custom Mode中定義的規則進行顯示。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415093747408.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

**一、使用DevEco Studio整合平行視界，“0程式碼”設定應用的分屏模式和分屏邏輯**

---

步驟 1   開啟HUAWEI DevEco Studio軟體。

步驟 2   開啟或者新建一個Project。以開啟一個已有Project為例進行演示，依次點選“File > Open”，選擇需要進行分屏設定的Project（以Custom Mode為例）。

步驟 3   在Project的“app-phone > src > main”下，點選滑鼠右鍵選擇“New > MagicWindow”，建立平行視界配置檔案“easygo.json”。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415093843522.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

步驟 4   在AndroidManifest.xml的application中，新增加如下meta-data欄位，表示該應用支援平行視界功能。

```java

```

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415093956213.jpg#pic_center)

步驟5 點選“+”方塊區域設定分屏規則。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094036445.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

步驟6 新增分屏規則：

1、 在Auto Split中定義規則：在螢幕左半部分選擇MainAtivity，在螢幕右半部分選擇AActivity，點選完成;

![ ](https://img-blog.csdnimg.cn/2020041509411346.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

2、 在Custom Split中定義規則：在螢幕左半部分選擇AActivity，在螢幕右半部分選擇BActivity，點選完成;

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094214394.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

步驟7 開啟螢幕預覽視窗，檢驗分屏規則

1、點選螢幕中央的Open Activity按鈕

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094255279.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

2、點選MainAtivity，將自動完成Auto Split中的分屏設定，螢幕的左半部分是X，螢幕的右半部分是A

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094359745.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094415570.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

3、當在右側A中選擇B時，將觸發Custom Split中定義的左A右B規則，發生頁面的自動向左推動

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094503931.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094515369.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

4、當在B頁面選擇A1時，將不會發生頁面的推動，僅僅是B頁面被A1替換，是由於沒有在Custom Split中定義相關規則

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/2020041509462255.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094632294.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

步驟 8  在介面上完成分屏模式和規則的設定後，會將設定的規則寫入到easygo.json檔案中，可以點選“Text”檢視原始碼。

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415094716584.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

透過點選新增，全程支援0程式碼分屏設計、極簡配置、API呼叫輕鬆幾步完成設計，是進行全屏適配還是分屏顯示，業務開發者根據自己應用的業務方向來定。最終在app可以實現這樣的分屏設定：

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200415095107284.gif#pic_center)

當前已有1000餘款app擁有平行視界能力，涵蓋新聞類、社交類、購物類、財經類、影片類等等，開發者使用DevEco Studio快速整合平行視界能力，可以節省一大半的時間。我們的宗旨的是讓開發者高效開發，極致創新，希望能邀請更多的開發者使用DevEco Studio，共同打破安卓平板橫屏生態壁壘，實現共贏發展。

**二、如何獲取DevEco  Studio**

---

登入[https://developer.huawei.com/consumer/cn/deveco_studio](https://developer.huawei.com/consumer/cn/deveco_studio)，點選“試用申請”來獲取

![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20200422134712659.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDcwODI0MA==,size_16,color_FFFFFF,t_70#pic_center)

---

往期連結：[Android | 教你如何開發掃二維碼功能](http://blog.itpub.net/69970551/viewspace-2690255/)

內容來源：[https://developer.huawei.com/consumer/cn/forum/topicview?tid=0201222670744610015&fid=26](https://developer.huawei.com/consumer/cn/forum/topicview?tid=0201222670744610015&fid=26)

原作者：英雄小好漢

DevEco Studio使用指南--平行視界

相關文章