HarmonyOS開發入門：環境配置與Hello World實驗

實驗目標

掌握HarmonyOS開發環境配置，創建首個HarmonyOS應用并實現"Hello World"界面展示

實驗準備

1. 已安裝DevEco Studio開發環境
2. 已配置HarmonyOS開發依賴項
3. 熟悉基本TypeScript/ArkTS語法（推薦）

實驗步驟

一、創建新項目

1. 啟動IDE
   打開DevEco Studio，進入歡迎頁

2. 選擇項目模板
   File > New > New Project
   → 選擇Application
   → 選擇Empty Ability模板
   → 點擊Next

3. 工程配置

   配置項	說明
   Project name	自定義項目名稱（如：HelloWorldDemo）
   Bundle name	應用包名（格式：com.company.project，發布時需保持一致）
   Save location	選擇合適的工程存儲路徑
   Compile SDK	選擇API版本（推薦API 9）
   Model	選擇設備模型（Stage模型適合基礎應用開發）

4. 完成創建
   點擊Finish，IDE將自動生成項目框架

二、項目結構解析

創建完成后，項目目錄結構如下：

HelloWorldDemo/
├── entry/
│   ├── src/
│   │   └── main/
│   │       ├── pages/         # 頁面組件
│   │       │   └── Index.ets  # 主頁面源碼
│   │       ├── resources/     # 資源文件
│   │       └── config.json    # 頁面路由配置
├── build/                     # 編譯輸出目錄
└── ...                        # 其他配置文件

三、Hello World實現

1. 定位主頁面
   打開entry/src/main/pages/Index.ets

2. 代碼分析

@Entry          // 標識頁面入口組件
@Component      // 聲明組件
struct Index {@State message: string = 'Hello World' // 響應式狀態變量build() {     // 組件構建方法Row() {     // 行布局容器Column() { // 列布局容器Text(this.message) // 文本組件.fontSize(50)    // 設置字體大小.fontWeight(FontWeight.Bold) // 設置字體粗細}.width('100%') // 設置列寬占滿父容器}.height('100%') // 設置行高占滿父容器}
}

3. 運行效果
   編譯運行后將在設備中央顯示加粗50px的"Hello World"文字

實驗總結

1. 環境配置要點

   • 確保Compile SDK版本與設備匹配
   • 包名命名需遵循反向域名規范
   • Stage模型支持基礎應用開發

2. 開發范式理解

   • 使用ArkTS聲明式UI語法
   • 組件化開發思想（@Component）
   • 響應式狀態管理（@State）

3. 擴展建議
   嘗試修改以下參數觀察變化：

   • 調整fontSize數值
   • 修改message內容
   • 添加新的UI組件（如Button）

提示：可通過Previewer實時預覽界面效果，提升開發效率。