鴻蒙應用開發項目式教程（AI助學）（微課版）-教案 全麗莉 項目6-10 桌面計算器-綜合實訓-智能充電家用版應用

《鴻蒙應用開發項目式教程》課程教學單元設計第1頁共7頁《鴻蒙應用開發項目式教程》課程教學單元設計項目6桌面計算器授課教師：授課班級:學時：8教學條件計算機實訓室、DevEcoStudio開發工具、投影設備、廣播教學軟件教學素材教材《鴻蒙應用開發項目式教程》、教學課件、實訓項目單、案例源碼庫、微課視頻、教學網站教學目標設計知識目標：1．熟悉FormKit的服務卡片架構、特征等2．掌握ArkTS卡片的創建方法3．掌握ArkTS卡片配置文件的結構和作用4．掌握ArkTS卡片從創建到銷毀的完整生命周期流程技能目標：能夠使用ArkTS卡片開發計算器卡片素質目標：1．培養工程化思維與規范意識2．具有職業責任感，強化質量意識任務描述手機桌面計算器是日常高頻使用工具，本次任務要求基于鴻蒙ArkTS+ArkUI框架，開發一款桌面計算器應用。需完成項目資源配置、計算器主界面搭建、四則運算邏輯編碼、桌面ArkTS卡片開發、配置文件編寫、卡片生命周期管理，最終在預覽器和模擬器中調試運行，實現計算器基礎運算與桌面卡片復用功能。教學內容1．鴻蒙項目目錄結構認知、字符串資源與應用圖標配置。2．ArkUI聲明式UI布局、狀態管理與按鈕組件開發。3．中綴表達式解析、調度場算法、后綴表達式運算邏輯實現。4．計算器卡片界面復用開發與頁面代碼修改。5．module.json5、form_config.json卡片配置文件編寫。6．FormExtensionAbility卡片生命周期回調方法使用。7．應用預覽器測試、模擬器功能測試與Bug調試。重點：掌握ArkUI界面開發、計算器運算邏輯、ArkTS卡片配置文件編寫難點：調度場算法邏輯理解、卡片生命周期回調、組件功能復用任務分析與實現1.任務需求分析：開發帶桌面卡片的鴻蒙計算器。2.項目架構設計：采用ArkUI前端展示+運算算法+Form卡片擴展Ability三層架構，卡片復用主頁面代碼簡化開發。3.核心功能實現：借助FormExtensionAbility管理卡片生命周期，雙配置文件實現桌面卡片。

教學過程設計主要步驟教學內容教學方法教學手段師生活動問題引入手機桌面計算器如何開發？鴻蒙桌面卡片是什么？如何實現計算器功能與桌面卡片計算器？教師講授引導法多媒體教師：講解演示學生：觀察思考知識講解1.鴻蒙項目目錄結構、字符串與圖標資源配置；2.ArkUI聲明式布局、@State狀態管理、按鈕組件應用；3.中綴轉后綴表達式、調度場算法原理；4.ArkTS卡片結構、module與form配置文件作用；5.卡片生命周期7個核心回調函數功能。啟發講解討論歸納多媒體課件演示代碼投屏思考交流互動分組討論記錄筆記示范操作1.創建鴻蒙項目并配置string.json、應用圖標資源；2.編碼實現Index.ets計算器主界面布局與按鈕事件；3.講解運算核心代碼、中綴轉后綴算法調試；4.開發CardCalculator.ets卡片界面、復用業務邏輯；5.編寫module.json5和form_config.json配置文件；6.編寫卡片生命周期代碼、預覽器與模擬器測試。問題引導操作演示分析歸納多媒體投屏DevEcoStudio實時演示觀摩思考歸納總結實戰訓練學生獨立完成完整實訓任務：參照課本項目案例，獨立完成鴻蒙計算器全流程開發，完成界面搭建、運算邏輯編碼、卡片配置、生命周期編寫，在預覽器和模擬器中運行測試。動手實踐做中學DevEcoStudio真實開發環境實踐操作查閱資料巡視指導評估討論1.評估學生項目完成進度與代碼規范；2.展示標準參考源碼與實現方案；3.抽取學生作品演示運行效果、集體點評；4.從功能實現、代碼規范、界面布局進行綜合考核。教師啟發討論歸納分數激勵實訓項目單作品投屏思考結果演示課堂總結1.ArkUI聲明式開發是鴻蒙界面開發核心，狀態管理是交互基礎；2.調度場算法是實現計算器優先級運算的關鍵，需理解棧的使用邏輯；3.ArkTS卡片支持代碼復用，只需修改入口組件即可共享業務邏輯；4.module.json5和form_config.json是卡片正常運行的核心配置文件，路徑和參數必須準確；5.FormExtensionAbility進程有10s存活限制，耗時業務需交由主應用處理。教師講解多媒體課件演示代碼回顧整理筆記引導創新課后作業完善本次計算器項目，獨立完成AI賦能拓展任務：在主界面和卡片界面新增計算歷史記錄保存功能，展示最近1條運算記錄；提交完整項目源碼、運行截圖及開發實訓報告。教師講授多媒體布置作業提出要求《鴻蒙應用開發項目式教程》課程教學單元設計項目7校園通應用授課教師：授課班級:學時：12教學條件計算機實訓室、DevEcoStudio開發工具、投影設備、廣播教學軟件教學素材教材《鴻蒙應用開發項目式教程》、教學課件、實訓項目單、案例源碼庫、微課視頻、教學網站教學目標設計知識目標：1．了解NetworkKit網絡服務概念2．了解網絡連接管理、網絡狀態變化3．掌握使用HTTP訪問網絡的方法4．掌握使用RCP訪問網絡的方法技能目標：1．能熟練將項目接入網絡2．能熟練使用NetworkKit請求數據素質目標：1．樹立規范使用網絡、注重數據安全的意識2．在封裝網絡請求、處理異步數據時，培養構建清晰的代碼結構與主動調試排錯的習慣任務描述本項目旨在開發一款名為“校園通”的移動應用，為師生提供便捷的校園信息服務。在主界面展示當前日期以及用戶信息；點擊“進入校園”按鈕后進入校園通主功能界面，展示校園新聞和本周課表，底部留言板提供提交留言功能。教學內容1.網絡服務NetworkKit簡介。2.網絡狀態變化。3.使用HTTP請求網絡數據。4.使用RCP請求網絡數據。5.搭建本地Node服務器。重點：使用HTTP請求網絡數據難點：數據的請求與處理，異步處理、異常捕獲任務分析與實現1.任務需求分析：開發校園通App，實現首頁數據加載、校園新聞、課程表、留言提交以及新聞詳情彈窗查看等網絡交互功能。2.項目架構設計：采用鴻蒙ArkUI前端頁面+Node.js本地服務端架構，通過HTTP協議完成客戶端與服務端的數據通信與接口調用。3.核心功能實現：配置網絡權限并搭建本地Node服務器，使用HTTP的GET/POST請求完成數據拉取與留言提交，新增接口與彈窗組件實現新聞詳情查看功能。

教學過程設計主要步驟教學內容教學方法教學手段師生活動問題引入結合日常校園場景提問：校園通知、課表、留言等信息如何在手機App上實時展示？引出NetworkKit網絡框架，講解本項目將借助HTTP網絡通信，完成校園通App數據交互開發。教師講授引導法多媒體教師：講解演示學生：觀察思考知識講解介紹NetworkKit網絡服務整體作用、應用場景與所需網絡權限配置；講解網絡狀態監聽的對象創建、事件訂閱、啟停監聽全套流程；詳解HTTP協議GET/POST請求用法、請求參數、響應結果解析及異常處理；簡述RCP通信框架核心概念與基礎使用；5.講解Node.js本地HTTP服務器搭建、路由接口編寫與跨域配置。啟發講解討論歸納多媒體課件演示代碼投屏思考交流互動分組討論記錄筆記示范操作搭建Node.js本地服務器，編寫用戶、日期、新聞、課表、留言及新聞詳情接口；在鴻蒙項目中配置網絡權限，搭建項目頁面目錄；編碼實現首頁GET請求加載日期、用戶信息，完成頁面路由跳轉；4.實現主頁面新聞、課表數據拉取與留言板POST提交功能。問題引導操作演示分析歸納多媒體投屏DevEcoStudio實時演示觀摩思考歸納總結實戰訓練1.完成網絡權限配置、搭建本地Node服務器。2.完成實現校園通首頁、主頁面基礎布局。3.使用GET/POST網絡請求，完成數據展示與留言提交。動手實踐做中學DevEcoStudio真實開發環境實踐操作查閱資料巡視指導評估討論展示學生實訓作品，從權限配置、網絡請求、功能完整性、代碼規范四個維度進行點評；匯總網絡請求失敗、跨域報錯、數據解析異常等常見問題并統一講解解決方案；3.分組討論GET與POST請求的使用區別、移動端網絡開發注意事項。教師啟發討論歸納分數激勵實訓項目單作品投屏思考結果演示課堂總結1回顧NetworkKit、網絡狀態監聽、HTTP請求、Node服務等核心知識點；2.梳理校園通App從服務端搭建、權限配置、頁面開發到網絡交互的完整開發流程；重申網絡請求異步處理、異常捕獲、跨域處理等重難點；4.強調規范編碼與嚴謹排查問題的職業素養。教師講解多媒體課件演示代碼回顧整理筆記引導創新課后作業完善課堂實訓項目項目，獨立完成AI賦能拓展任務：進一步完善校園通功能，用戶可以點擊校園新聞欄右側的詳情按鈕，通過彈窗展示校園新聞的詳情。教師講授多媒體布置作業提出要求《鴻蒙應用開發項目式教程》課程教學單元設計項目8視頻播放器應用授課教師：授課班級:學時：12教學條件計算機實訓室、DevEcoStudio開發工具、投影設備、廣播教學軟件教學素材教材《鴻蒙應用開發項目式教程》、教學課件、實訓項目單、案例源碼庫、微課視頻、教學網站教學目標設計知識目標：1．理解HarmonyOS多媒體開發框架MediaKit的核心功能及其應用場景2．掌握AVPlayer組件的功能特性和狀態機生命周期3．掌握XComponent組件在視頻渲染中的角色及其與AVPlayer的協作機制4．掌握PanGesture手勢控制的用法技能目標：能夠使用ArkTS實現視頻播放器素質目標：1．培養用戶導向的設計思維2．培養規范的編程習慣，強化資源管理安全意識任務描述創建一個視頻播放器應用。該應用能夠獲取本地存儲視頻，通過AVPlayer進行視頻播放控制，實現播放/暫停、視頻切換、倍速播放、進度控制、音量調節等功能。視頻播放界面支持全屏播放。教學內容1.MediaKit框架各組件功能介紹、rawfile視頻資源獲取方式。2.AVPlayer完整狀態機生命周期與各狀態API調用規則。3.XComponent組件創建Surface實現視頻渲染配置。4.播放控制：播放暫停、切視頻、倍速、進度、音量代碼實現。5.PanGesture手勢綁定、三階段回調實現滑動調音量。6.窗口API實現全屏橫豎屏切換與控件顯隱控制。7.MVVM分層編碼、模擬器整體聯調測試。重點：AVPlayer狀態管理、播放器各項播放控制、PanGesture手勢開發難點：AVPlayer多狀態流轉邏輯、MVVM分層開發、全屏尺寸自適應任務分析與實現1.任務需求分析：開發本地視頻播放器，實現視頻加載、播放控制、手勢調參、全屏播放全套功能。2.項目架構設計：采用MVVM分層架構，分離UI、數據、業務控制代碼，便于后期功能擴展。3.核心功能實現：借助AVPlayer做媒體解碼，XComponent渲染畫面，PanGesture完成手勢交互，窗口API實現全屏切換。

教學過程設計主要步驟教學內容教學方法教學手段師生活動問題引入手機播放器如何讀取本地視頻？播放卡頓、畫面渲染依靠什么組件？滑動調節音量依靠什么手勢？教師講授引導法多媒體教師：講解演示學生：觀察思考知識講解1.MediaKit整體框架與各子模塊作用；2.resourceManager讀取rawfile視頻資源方法；3.AVPlayer狀態流轉與對應API；4.XComponent創建Surface綁定播放器流程；5.PanGesture手勢三個回調方法與方向參數；6.窗口API橫豎屏、狀態欄隱藏實現原理。啟發講解討論歸納多媒體課件演示代碼投屏思考交流互動分組討論記錄筆記示范操作1.新建項目并導入mp4視頻至rawfile目錄；2.編寫Model實體類與ViewModel實現視頻列表解析；3.編碼XComponent渲染頁面、初始化AVPlayer并綁定Surface；4.分步實現播放暫停、進度拖動、倍速、音量控制代碼；5.添加PanGesture手勢實現滑動調音量；6.編寫全屏切換邏輯，模擬器調試尺寸適配。問題引導操作演示分析歸納多媒體投屏DevEcoStudio實時演示觀摩思考歸納總結實戰訓練學生獨立完成實訓：參照教材案例，基于MVVM完整實現視頻播放器，完成資源讀取、播放控制、手勢、全屏全部功能，模擬器調試運行。動手實踐做中學DevEcoStudio真實開發環境實踐操作查閱資料巡視指導評估討論1.核查項目完整度與資源釋放代碼規范性；2.展示標準參考代碼與實現方案；3.隨機抽取學生作品演示播放效果，集中點評優缺點；4.從功能、代碼規范、兼容性綜合評分。教師啟發討論歸納分數激勵實訓項目單作品投屏思考結果演示課堂總結1.MediaKit是鴻蒙多媒體開發基礎，AVPlayer是播放器核心；2.AVPlayer狀態嚴格有序切換，錯誤調用會造成播放異常與內存泄漏；3.XComponent提供渲染表面，是視頻畫面正常顯示必備組件；4.PanGesture三段回調配合坐標計算可快速實現各類滑動交互；5.項目遵循MVVM分層便于維護，使用完畢必須調用release釋放媒體資源。教師講解多媒體課件演示代碼回顧整理筆記引導創新課后作業完善現有播放器項目，完成AI拓展任務：新增上下手勢調節屏幕亮度功能，提交完整項目源碼、運行截圖與實訓報告。教師講授多媒體布置作業提出要求《鴻蒙應用開發項目式教程》課程教學單元設計項目9第一個元服務授課教師：授課班級:學時：4教學條件計算機實訓室、DevEcoStudio開發工具、模擬器設備、投影設備、廣播教學軟件、網絡環境（用于華為開發者賬號授權）教學素材教材《鴻蒙應用開發項目式教程》、教學課件、實訓項目單、案例源碼庫、微課視頻、教學網站、元服務開發官方規范文檔教學目標設計知識目標：1.了解元服務相關概念2.熟悉元服務的創建方法3.熟悉元服務卡片的創建方法4.熟悉元服務的運行方法技能目標：能夠熟練創建元服務素質目標：1.加強關注交互細節和用戶體驗優化的意識2.增強對鴻蒙系統新特性的快速學習與應用能力任務描述本項目為鴻蒙元服務基礎實訓項目，基于DevEcoStudio開發工具完成首個鴻蒙元服務開發。學生需完成元服務工程創建、華為開發者賬號授權與AppID配置、項目基礎配置、元服務圖標生成配置、主界面搭建、桌面服務卡片創建與界面修改，最終實現桌面卡片展示“我是卡片，點我進入元服務”，點擊卡片跳轉元服務主界面并展示“AtomicService”。同時結合AI賦能任務，完成天氣、溫度動態刷新拓展功能，掌握元服務從創建、開發、配置到模擬器運行測試的全流程，熟練掌握鴻蒙元服務輕量化開發核心流程與規范。教學內容1.元服務基礎認知：元服務概念、核心特征、優勢、使用場景，對比傳統應用與元服務的區別。2.元服務命名規范：合規命名規則、各類禁用詞匯與違規內容要求，掌握元服務開發合規標準。3.元服務工程搭建：AtomicService項目創建、CloudDev資源關聯、華為賬號授權、AppID選擇與項目配置。4.項目資源配置：通過ImageAsset生成元服務圖標，完成模塊配置文件圖標參數設置。5.界面開發：元服務主界面文字內容修改、服務卡片創建、模板選擇與卡片界面內容定制。6.元服務運行測試：模擬器直接運行項目、桌面添加服務卡片、卡片點擊啟動元服務的完整操作。7.AI賦能拓展開發：借助CodeGenie優化界面代碼、生成隨機溫度、天氣模擬函數，實現信息定時刷新功能。重點：元服務工程創建與配置、服務卡片創建與界面修改、元服務模擬器運行與桌面部署操作、元服務命名合規規范。難點：元服務與服務卡片的關聯邏輯、AI輔助代碼生成與優化、動態數據刷新功能實現、元服務合規開發細節把控。任務分析與實現1.任務需求分析：明確元服務主界面、桌面卡片展示效果，掌握卡片跳轉核心交互邏輯，熟知合規開發要求。2.開發流程設計：工程創建→賬號授權與項目配置→圖標資源配置→主界面開發→服務卡片創建與修改→模擬器測試部署→AI拓展功能開發。3.核心效果實現：桌面卡片展示指定文案，點擊卡片正常跳轉元服務，主界面展示指定內容，拓展實現天氣溫度動態刷新。教學過程設計主要步驟教學內容教學方法教學手段師生活動問題引入講解鴻蒙元服務的應用場景，對比傳統APP，提問元服務輕量化優勢是什么？手機桌面小組件、負一屏服務和元服務卡片有何區別？如何自主開發一款可桌面展示的鴻蒙元服務？教師講授、引導提問法多媒體課件、真機演示教師：場景演示、問題引導、知識點導入學生：觀察體驗、思考問題、互動作答知識講解1.元服務核心概念、特征、優勢與使用場景；2.元服務與傳統應用的差異對比；3.元服務官方命名規范、各類禁用規則與合規要求；4.元服務開發整體流程與項目目錄結構；5.服務卡片與元服務的關聯原理、交互邏輯。啟發講解、案例對比、討論歸納多媒體課件、代碼投屏、規范文檔展示學生：認真聽講、分組討論、記錄知識點教師：答疑解惑、梳理知識框架示范操作1.打開DevEcoStudio，新建AtomicService空項目；2.完成華為開發者賬號授權、關聯AppID、配置項目信息；3.導入圖片資源，生成并配置元服務圖標；4.修改元服務主界面代碼，展示指定文字內容；5.新建DynamicWidget服務卡片，修改卡片界面文案；6.模擬器運行項目，演示桌面添加卡片、點擊跳轉效果。問題引導、分步演示、實操講解、歸納總結投屏實時演示、DevEcoStudio實操展示學生：觀摩操作、記錄步驟、梳理開發流程教師：分步講解、強調重難點與易錯點實戰訓練學生獨立完成完整實訓任務：創建元服務工程、完成賬號與項目配置、配置應用圖標、修改主界面與卡片界面、在模擬器中運行項目、添加桌面卡片并測試跳轉功能；排查修復運行Bug。項目驅動、動手實踐、做中學DevEcoStudio開發環境、模擬器、實訓指導書學生：獨立實操、自主排錯、完成功能開發教師：巡回指導、針對性答疑、糾正操作問題評估討論1.檢查學生項目完成情況，核對界面展示、卡片跳轉、功能運行效果；2.檢查項目命名、配置是否符合官方規范；3.展示優秀學生作品，對比問題案例集中點評；4.從功能實現、代碼規范、合規性、拓展功能完成度綜合考核。作品點評、分組互評、歸納激勵作品投屏、實訓評分標準學生：作品演示、互評交流、總結問題教師：點評優缺點、給出優化建議課堂總結1.梳理元服務輕量化、免安裝、即用即走的核心特點；2.總結元服務從工程創建、資源配置、界面開發到部署測試的完整流程；3.強調元服務開發合規命名的重要性；4.歸納元服務卡片與主服務的交互核心邏輯。梳理歸納、重難點復盤多媒體課件、知識框架復盤學生：整理筆記、鞏固知識點教師：整體復盤、梳理知識體系課后作業完善本次元服務項目代碼，獨立完成AI賦能拓展任務：實現天氣信息和溫度情況定時刷新功能；提交完整源碼、運行截圖、實訓報告任務布置、自主拓展多媒體學生：課后自主完善、復盤鞏固教師：明確作業要求與提交標準《鴻蒙應用開發項目式教程》課程教學單元設計項目10綜合實訓——智能充電家用版應用授課教師：授課班級:學時：12教學條件計算機實訓室、DevEcoStudio開發工具、投影設備、廣播教學軟件教學素材教材《鴻蒙應用開發項目式教程》、教學課件、實訓項目單、案例源碼庫、微課視頻、教學網站教學目標設計知識目標：1.掌握工具類的封裝方法2.熟悉主界面的搭建方法3.掌握主界面的數據獲取方法4.熟悉API調用方法技能目標：1.能熟練構建復雜界面2.能熟練獲取后端數據素質目標：1.培養在綜合項目中整合數據綁定與UI布局的系統開發思維2.提升解決復雜問題的能力任務描述本次任務為鴻蒙綜合實訓，基于ArkTS+ArkUI框架開發智能充電家用版應用，面向新能源車用戶實現充電樁與車輛管理、充電狀態監控、開始/結束充電控制。需完成項目目錄搭建、RequestUtil/StorageUtils工具類封裝、ApiGroup接口管理、主界面（車輛信息、充電狀態、功能按鈕、底部導航）開發、充電動畫與狀態切換、后端數據獲取與綁定，最終在預覽器與模擬器中調試運行，滿足多鴻蒙終端控制與實時監控需求。教學內容1.鴻蒙智能充電項目目錄結構規范與工程創建。2.HTTP請求封裝RequestUtil（GET/POST/PUT）。3.輕量級存儲StorageUtils（增刪改查）。4.Tabs底部導航、TabContent與自定義組件HomeComp實現。5.主界面五區域布局：頂部欄、車輛信息、充電狀態、功能按鈕、底部導航。6.ApiGroup接口封裝與后端數據獲取。7.開始/結束充電、狀態切換與充電進度動畫。8.預覽器與模擬器測試、接口聯調與Bug修復。重點：工具類封裝、底部導航實現、主界面布局、API接口調用與數據綁定難點：HTTP請求與本地存儲結合、充電狀態管理、異步數據獲取與界面刷新、動畫效果實現任務分析與實現1.任務需求分析：界面結構、充電控制、數據展示、終端適配。2.項目架構設計：工具層、接口層、UI組件層、界面路由層。3.核心功能實現：工具類封裝→接口封裝→