好這是第三篇，進度有點小慢，主要最近咱們挺忙碌更新產品的，預告一下優雅草科技將要推出一款酒吧點餐-運營-活動-供應商進銷存erp的一款線下線上結合軟件，已在成都地區酒吧穩定商用好幾年，本文為伊凡原創撰寫僅僅代表伊凡個人觀點，不代表優雅草科技的觀點與其立場，謝謝，有問題歡迎來找伊凡聊。

1，頁面設計

既然我們要寫個鴻蒙版的蜻蜓短視頻系統，首先我們規劃一下我們要做的內容，因為目前我們自家的這個系統已經很龐大了我們這個專欄無法寫滿制作所有的功能因此我們精簡一下實現為制作個人中心，短視頻，圖文，BTC電商4個部分即可，我先簡單擼，擼完后優雅草的兄弟們再來精加工收尾，因此規劃為：

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

2，鴻蒙的頁面關系

首先鴻蒙的頁面是主頁面里面包含子頁面，一個ability對應一個hap，所有的hap整體打包為一個app，也就是模塊化，主頁面ability里面包含多個子頁面abilityslice，如果大家學過vue，那么其實就是vue頁面中的組件components里面的內容，可以在任何vue頁面中調用。

3，config.json 配置說明

配置文件，我將對應意思 寫在后方了。

{ "app": { "bundleName": "com.youyacao.songshuvideo", app包名 "vendor": "youyacao", 描述 "version": { "code": 1000000, 版本號- 內部看 "name": "1.0.0" 版本號-用戶看 } }, "deviceConfig": {}, 應用在設備上的信息 以及配置對應需要獲取權限的信息 "module": { "package": "com.youyacao.songshuvideo", app包名 "name": ".MyApplication", hap包的名字 "mainAbility": "com.youyacao.songshuvideo.MainAbility", hap包的入口 "deviceType": [ 能應用的設備類型， "phone" 代表手機，還有更多諸如car 車載 tv ipad 之類的 ], "distro": { 當前hap包的信息 "deliveryWithInstall": true, 是否 伴隨應用安裝 "moduleName": "entry", hap包的名稱 "moduleType": "entry", hap包的類型 "installationFree": false 如果安裝不了的時候 就改false，關于這個的討論還有點信息 }, "abilities": [ 核心內容，此處有點類似uniapp里面的page.json { "skills": [ { "entities": [ "entity.system.home" ], "actions": [ "action.system.home" ] } ], "orientation": "unspecified", "name": "com.youyacao.songshuvideo.MainAbility", "icon": "$media:icon", "description": "$string:mainability_description", "label": "$string:entry_MainAbility", "type": "page", "launchType": "standard" } ] } }

實際開發過程中會開始做這些部分，

程序的運行過程

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

類名為myapplication，下方

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

入口的ability對應的mainAbility的MainAbility 對應著下方的ability的詳細內容。

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

子頁面MainAbilitySlice 再進去 ，

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

這里進去可以看到xml文件在，ability_main.xml 雙擊進入。

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

修改一下文字和尺寸，運行看看效果

?

編輯切換為居中

添加圖片注釋，不超過 140 字（可選）

.

效果出來了，本文到此結束，第四篇介紹一些比較常用和重要的用法，第五篇直接開始做首頁。

總結

以上是生活随笔為你收集整理的【03】从零开始跟我一起制作一个鸿蒙的应用-★规划搭建鸿蒙应用版的蜻蜓短视频系页面★---优雅草科技伊凡的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。