摘要：在完成了 Flutter for OpenHarmony 的环境搭建后，今天的核心任务是实现项目的“工程化”落地。本文将以经典的 Flutter 计数器应用为起点，详细演示如何将其部署到鸿蒙模拟器及真机，并结合 CSDN 旗下的 AtomGit 平台，完成代码托管与版本控制的标准化流程。这不仅是一个 Demo 的运行，更是未来大型项目开发的基石。

前言

在上文中，我们已经成功拉取了 OpenHarmony 版的 Flutter SDK（工具链），并验证了环境的可用性。本文的核心任务，是建立一个标准化的、受版本控制的、可多人协作的工程目录。

我们将以官方的计数器 Demo 为基础，将其转化为一个规范的工程，并推送到 CSDN 的 AtomGit 平台。

一、 规范化工程初始化

1. 沿用之前的的工程

为了保持学习的连贯性，我们将直接复用创建的 my_first_ohos_app 项目。

如果你还没有创建，或者想重新开始，可以在终端中执行：

flutter create --platforms ohos,android,ios my_first_ohos_app

然后进入项目目录：

cd my_first_ohos_app

2. 工程结构解析

生成的目录中，ohos 文件夹是鸿蒙平台特有的工程目录。

  • ohos/entry: 鸿蒙应用的主入口模块。
  • ohos/entry/src/main/ets: 存放 ArkTS 代码，Flutter 页面的容器就在这里。
  • pubspec.yaml: （位于项目根目录）Flutter 的依赖管理文件，后续添加鸿蒙三方库都在这里配置。
    在这里插入图片描述

二、 多端运行与真机调试

代码写好了，必须要在设备上跑起来才有意义。OpenHarmony 支持模拟器、真机（手机/平板）以及开发板（如 DAYU200）多种运行方式。

1. 模拟器运行验证

这是最快速的验证方式。

  • 打开 DevEco Studio，启动 Device Manager 中的模拟器。
  • 在项目根目录运行： 
    flutter run
  • 等待编译完成，计数器应用将出现在模拟器屏幕上。

小技巧：如果同时连接了多个设备（例如同时开了模拟器和真机），可以使用 flutter devices 查看列表，然后通过 flutter run -d <设备ID> 指定运行目标。

在这里插入图片描述

2. 真机/开发板调试

如果你手头有 OpenHarmony 的真机（如 Mate 60 Pro 鸿蒙版）或开发板，体验会更好。

步骤如下：

  1. 连接设备：使用 USB 连接电脑，确保开启“开发者模式”和“USB调试”。

  2. 验证连接：在终端输入 hdc list targets。

    注意：如果提示 hdc : 无法将“hdc”项识别为...，说明 hdc 工具未添加到系统环境变量 Path 中。
    在这里插入图片描述
    在这里插入图片描述

    • 临时解决方法：在 DevEco Studio 的 Terminal 中使用该命令（DevEco 自带环境）。
    • 永久解决方法：将 SDK 的 toolchains 目录（例如 C:\Program Files\Huawei\DevEco Studio\sdk\default\openharmony\toolchains）添加到系统 Path 环境变量中。

  3. 签名配置：DevEco Studio 支持自动签名。打开 ohos 目录下的工程，进入 File -> Project Structure -> Signing Configs，勾选 Automatically generate signature 并登录华为账号即可。

  4. 运行：

    flutter run -d <设备ID>

  5. 远程连接：如果你找不到设备ID，可以尝试使用远程连接。在手机上打开开发者模式并打开无线调试，然后在电脑的deveco studio输入手机上显示的ip地址（电脑与手机需要处于同一局域网下）在这里插入图片描述

实战记录：在真机上运行时，Flutter 的渲染性能表现非常优异，尤其是在列表滑动和动画效果上，几乎感觉不到与原生应用的差异。

在这里插入图片描述

三、 AtomGit 仓库建设与代码托管

为了符合开源标准，我们将使用 CSDN 旗下的 AtomGit 代码托管平台来管理我们的代码。

1. 创建云端仓库

登录自己的 AtomGit 主页：https://atomgit.com

  1. 点击右上角的“+”号，选择“新建仓库”。
  2. 仓库名称：命名为 my_first_ohos_app，与本地项目保持一致。
  3. 仓库描述：填写“OpenHarmony Flutter 跨平台开发实战项目”。
  4. 开源许可证：强烈建议选择 Apache-2.0 或 MIT，这是开源项目的标配。
  5. 初始化：勾选“生成 README.md”。

![请插入截图：AtomGit 创建仓库的填写页面，展示仓库名和配置]

2. 配置 .gitignore

OpenHarmony 和 Flutter 编译时会产生大量临时文件，这些绝对不能提交到 Git 仓库，否则会导致仓库体积爆炸且不仅容易产生冲突。

在项目根目录下创建或修改 .gitignore 文件，确保包含以下内容：

# Flutter
.dart_tool/
.flutter-plugins
.flutter-plugins-dependencies
build/

# Android
android/app/libs/
android/idea/
android/.gradle/

# OpenHarmony / HarmonyOS
ohos/.hvigor/
ohos/.idea/
ohos/build/
ohos/oh_modules/
ohos/entry/build/
ohos/entry/.preview/
ohos/entry/oh_modules/
*.hap
*.hsp

在这里插入图片描述

3. Git 初始化与推送

回到本地项目终端，执行以下标准 Git 命令流程：

# 1. 初始化 Git 仓库
git init

# 2. 添加所有文件（会自动忽略 .gitignore 中的文件）
git add .

# 3. 提交代码
git commit -m "feat: init flutter ohos project structure"

# 4. 关联 AtomGit 远程仓库 (请替换为你自己的仓库地址)
git remote add origin https://atomgit.com/Betelgeuse76/my_first_ohos_app.git

# 5. 推送代码到 master 分支
git push -u origin master

在这里插入图片描述

输入账号密码（这里的密码不要写登录密码，要填写个人令牌，需要去atomgit里面申请个人令牌），执行完毕后，刷新 AtomGit 页面，你应该能看到完整的项目结构和代码。
在这里插入图片描述
在这里插入图片描述

四、 总结

今天我们不仅重温了 Flutter 应用的创建与运行，更重要的是完成了工程化的关键一步——将代码规范地托管到了 AtomGit 平台。

通过配置 .gitignore 排除鸿蒙特有的构建产物，我们保证了代码仓库的纯净与轻量。接下来的日子里，我们将以此仓库为基地，逐步添加网络请求、状态管理、原生混合开发等高级功能，最终打磨出一个完整的鸿蒙跨平台应用。

欢迎加入与关注

# flutter # harmonyos # 华为
Logo
人工智能6S服务平台

作为“人工智能6S店”的官方数字引擎，为AI开发者与企业提供一个覆盖软硬件全栈、一站式门户。

更多推荐

cover

Flutter + OpenHarmony开发端组件实战

avatar 人工智能6S服务平台
cover

Flutter 框架跨平台鸿蒙开发——Button综合应用

avatar 人工智能6S服务平台
cover

Flutter 框架跨平台鸿蒙开发——Container高级应用

avatar 人工智能6S服务平台