「鴻蒙開發(fā) 3」華為鴻蒙應(yīng)用開發(fā)的低代碼（Super Visual）開發(fā)方式

開發(fā)前可以了解下鴻蒙： [鴻蒙開發(fā) 序]華為鴻蒙操作系統(tǒng)（HarmonyOS）簡介及開發(fā)環(huán)境搭建

成都創(chuàng)新互聯(lián)公司專注于樺甸網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供樺甸營銷型網(wǎng)站建設(shè)，樺甸網(wǎng)站制作、樺甸網(wǎng)頁設(shè)計、樺甸網(wǎng)站官網(wǎng)定制、小程序設(shè)計服務(wù)，打造樺甸網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供樺甸網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

開發(fā)前的準備：「鴻蒙開發(fā) 1」華為鴻蒙應(yīng)用集成開發(fā)環(huán)境DevEco Studio安裝和設(shè)置

了解鴻蒙應(yīng)用開發(fā)的基本開發(fā)流程：「鴻蒙開發(fā) 2」第一個華為鴻蒙（HarmonyOS）應(yīng)用程序（App）

本章目標：

1 了解華為鴻蒙應(yīng)用開發(fā)的可視化（低代碼）方式

2 通過構(gòu)建一個簡單的具有頁面跳轉(zhuǎn)功能的應(yīng)用

低代碼開發(fā)方式，即通過可視化界面開發(fā)方式快速構(gòu)建布局、編輯UI界面，可有效降低用戶的上手成本并提升用戶構(gòu)建UI界面的效率。

1 打開DevEco Studio，創(chuàng)建一個新工程，選擇支持Phone / Tablet / Wearable（手機 / 平板 / s可穿戴）的模板，我們在此直接選擇Empty Ability

Project name工程名稱填SuperVisual

Development mode開發(fā)方式選擇Super Visual

其它的可以使用默認設(shè)置，點擊完成，進入編輯界面

1 在Project（項目）窗口，刪除工程運行默認的入口文件夾：“entry src main js default pages index”文件夾

2 在Project窗口，選擇工程中的“entry src main js default pages”，單擊鼠標右鍵，選擇“New JS Visual”

JS visual name填first，點擊完成，進入編輯界面

創(chuàng)建完成后，可以看到“entry src main supervisual default pages page page.visual”的文件目錄結(jié)構(gòu)

3 第一個頁面內(nèi)有一個容器、文本和一個按鈕，通過Div、Text和Button組件來實現(xiàn)

（1）分別選中first.visual畫面中的Text、Div組件，單擊鼠標右鍵，選擇Delete刪除

（2）選中UI Control中的Div組件，將其拖至畫布

點擊右側(cè)屬性樣式欄中的通用樣式圖標（General），設(shè)置Div組件的高度Height為100%，使其占滿屏幕

點擊右側(cè)屬性樣式欄中的樣式圖標（Flex），設(shè)置Div組件的FlexDirection樣式為column，使Div的主軸垂直；設(shè)置Div組件的JustifyContent樣式為center，使得其子組件在主軸上居中顯示；設(shè)置Div組件的AlignItems樣式為center，使得其子組件在交叉軸上居中顯示

（3）選中UI Control中的Text組件，將其拖至Div組件的中央?yún)^(qū)域

點擊右側(cè)屬性樣式欄中的屬性圖標（Properties），設(shè)置Text組件的Content屬性為 “ Hello World ”

點擊右側(cè)屬性樣式欄中的通用樣式圖標（General），設(shè)置Text組件的寬（width）為100%，高（height）為100px

點擊右側(cè)屬性樣式欄中的樣式圖標（Feature），設(shè)置組件的FontSize樣式為60px，使得其文字放大；設(shè)置組件的TextAlign樣式為center，使得組件文字居中顯示

（4）選中UI Control中的Button組件，將其拖至Text組件下面

點擊右側(cè)屬性樣式欄中的屬性圖標（Properties），設(shè)置Button組件的Value屬性為 “ Next ”，

點擊右側(cè)屬性樣式欄中的通用樣式圖標（General），設(shè)置按的寬（width）為40%，高（height）為60px

點擊右側(cè)屬性樣式欄中的樣式圖標（Feature），設(shè)置組件的FontSize樣式為40px

至此，第一個頁面創(chuàng)建完成

我們可以在預(yù)覽窗口中看效果，點擊右側(cè)邊欄的Preview打開預(yù)覽窗口

1 在Project窗口，選擇工程中的“entry src main js default pages”，單擊鼠標右鍵，選擇“New JS Visual”

Visual配置界面，JS visual name填second，回車（Enter鍵）或者點擊完成，進入編輯界面

2 第二個頁面中有一個容器和文本，通過Div、Text組件實現(xiàn)，現(xiàn)在編輯器已經(jīng)為我們創(chuàng)建好了，我們就來修改下它們的屬性（你也可以刪除原有的自己創(chuàng)建，具體步驟參考本章第二節(jié)“二 創(chuàng)建第一個頁面”）。

選中Text組件，點擊右側(cè)屬性樣式欄中的屬性圖標（Properties），設(shè)置Text組件的Content屬性為 “ Hi，I'm always here. ”

點擊右側(cè)屬性樣式欄中的通用圖標（General），設(shè)置組件的寬（width）為100%，高為60px

點擊右側(cè)屬性樣式欄中的樣式圖標（Feature），設(shè)置組件的FontSize樣式為36px，TextAlign樣式為center

這樣我們的第二個頁面創(chuàng)建成功了

1 在Project窗口，打開工程中的“entry src main js default pages first first.js”， 導(dǎo)入router模塊，頁面路由router根據(jù)頁面的uri來找到目標頁面，從而實現(xiàn)跳轉(zhuǎn)。示例代碼如下：

2 打開或者切換到first.visual頁面，選中畫布上的Button組件，點擊右側(cè)屬性樣式欄中的事件圖標（Events），鼠標點擊Click事件的輸入框，選擇launch事件

3 在預(yù)覽窗口中查看項目效果，點擊Next按鈕后發(fā)現(xiàn)我們的頁面成功跳轉(zhuǎn)了。

到此，本章的目標就完成了。

鴻蒙OS開發(fā)版已陸續(xù)推送，首批用戶真實評價出爐，部分評價太無奈

好在華為公司并未讓大家失望，鴻蒙OS系統(tǒng)如約而至，在4月底的時候正式和大家見面了，雖然4月底推送的只是開發(fā)版本，所適配的機型數(shù)量也不夠多，而且想要體驗還得提前申請，但是好在鴻蒙OS確實是真的到來了，盡管目前適配的機型數(shù)量并不多，但是萬事開頭難，后續(xù)可以升級鴻蒙OS系統(tǒng)的華為手機必然可以迎來鴻蒙OS系統(tǒng)的推送，首批穩(wěn)定版預(yù)計也將在6月份推送，而且如今第二批的鴻蒙OS開發(fā)版也已經(jīng)開啟了申請。

不過也有華為手機用戶不太放心，想要看看鴻蒙OS系統(tǒng)的用戶評論再決定是否申請，而伴隨著鴻蒙OS開發(fā)版陸續(xù)推送，有關(guān)鴻蒙OS系統(tǒng)的首批用戶真實評價也已經(jīng)出爐了，根據(jù)用戶真實評價顯示，升級鴻蒙OS系統(tǒng)的不少人都覺得手機變得更加流暢了，甚至有網(wǎng)友還評價：無比絲滑，而流暢性對于一個系統(tǒng)而言至關(guān)重要，從這一點上來講鴻蒙OS系統(tǒng)表現(xiàn)確實很不錯。

不過其中也有部分評價還挺無奈的，都表示鴻蒙OS系統(tǒng)有點類似安卓，或者說和安卓區(qū)別不大，而這也正是鴻蒙OS系統(tǒng)到來之后關(guān)于這一系統(tǒng)吐槽最多的地方，甚至還有網(wǎng)友用“換殼安卓”來形容鴻蒙OS，但事實上鴻蒙OS本質(zhì)上已經(jīng)不是安卓了，和安卓系統(tǒng)類似其實也情有可原。

一方面安卓系統(tǒng)經(jīng)過各大廠商的努力，可以說是目前最合乎用戶習慣的一種系統(tǒng)，就連iOS系統(tǒng)的樣式也和安卓越來越相似，盲目大改反而會弄巧成拙，另一方面絕大多數(shù)軟件都只適配了iOS和安卓，如果直接全部改變，那么進入APP或者 游戲 的時候，甚至都沒有對應(yīng)的選項，所以鴻蒙OS有點像安卓是一件很正常的事情。

結(jié)合用戶評價來看，鴻蒙OS系統(tǒng)是真的還不錯，不過對于未能使用華為手機的用戶來說就很遺憾了，因為他們?nèi)绻塍w驗鴻蒙OS系統(tǒng)暫時只能通過購買華為手機來實現(xiàn)，而目前華為公司有貨在售的最便宜手機就是圖中的這款華為Mate40 Pro了，它的起步售價達到了6299元，不過好在這款手機作為一款搭載麒麟9000處理器的IP68防水旗艦自身競爭力也不差，就怕這款手機售空之后，再想購買華為手機來體驗鴻蒙系統(tǒng)的只能買二手機了。

鴻蒙智慧推薦如何自定義

鴻蒙智慧自定義設(shè)置方法：

華為鴻蒙系統(tǒng)的智慧推薦設(shè)置方法，首先打開設(shè)置，點擊智慧助手，然后點擊智慧推薦，這里就可以自定義設(shè)置了。

華為鴻蒙系統(tǒng)（HUAWEI HarmonyOS），是華為在2019年8月9日于東莞舉行華為開發(fā)者大會，正式發(fā)布的操作系統(tǒng)鴻蒙OS。

華為鴻蒙系統(tǒng)是一款全新的面向全場景的分布式操作系統(tǒng)，創(chuàng)造一個超級虛擬終端互聯(lián)的世界，將人、設(shè)備、場景有機地聯(lián)系在一起，將消費者在全場景生活中接觸的多種智能終端實現(xiàn)極速發(fā)現(xiàn)、極速連接、硬件互助、資源共享，用合適的設(shè)備提供場景體驗。

發(fā)展歷史：

2020年9月10日，華為鴻蒙系統(tǒng)升級至HarmonyOS 2.0版本。

2021年4月22日，華為鴻蒙 HarmonyOS 應(yīng)用開發(fā)在線體驗網(wǎng)站上線。5月18日，華為宣布華為HiLink將與Harmony OS統(tǒng)一為鴻蒙智聯(lián)。

2021年6月2日晚，華為正式發(fā)布HarmonyOS 2及多款搭載HarmonyOS 2的新產(chǎn)品。7月29日，華為Sound X音箱發(fā)布，是首款搭載HarmonyOS 2的智能音箱。

2021年10月，華為宣布搭載鴻蒙設(shè)備破1.5億臺。 鴻蒙 HarmonyOS 座艙汽車2021年底發(fā)布。

2021年11月17日，HarmonyOS迎來第三批開源，新增開源組件769個，涉及工具、網(wǎng)絡(luò)、文件數(shù)據(jù)、UI、框架、動畫圖形及音視頻7大類。