网罗开发 （小红书、快手、视频号同名）
大家好，我是 展菲，目前在上市企业从事人工智能项目研发管理工作，平时热衷于分享各种编程领域的软硬技能知识以及前沿技术，包括iOS、前端、Harmony OS、Java、Python等方向。在移动端开发、鸿蒙开发、物联网、嵌入式、云原生、开源等领域有深厚造诣。
图书作者：《ESP32-C3 物联网工程开发实战》
图书作者：《SwiftUI 入门，进阶与实战》
超级个体：COC上海社区主理人
特约讲师：大学讲师，谷歌亚马逊分享嘉宾
科技博主：华为HDE/HDG
我的博客内容涵盖广泛，主要分享技术教程、Bug解决方案、开发工具使用、前沿科技资讯、产品评测与使用体验 。我特别关注云服务产品评测、AI 产品对比、开发板性能测试以及技术报告，同时也会提供产品优缺点分析、横向对比，并分享技术沙龙与行业大会的参会体验。我的目标是为读者提供有深度、有实用价值的技术洞察与分析。
展菲：您的前沿技术领航员
👋 大家好，我是展菲！
📱 全网搜索"展菲"，即可纵览我在各大平台的知识足迹。
📣 公众号"Swift社区"，每周定时推送干货满满的技术长文，从新兴框架的剖析到运维实战的复盘，助您技术进阶之路畅通无阻。
💬 微信端添加好友"fzhanfei"，与我直接交流，不管是项目瓶颈的求助，还是行业趋势的探讨，随时畅所欲言。
📅 最新动态：2025 年 3 月 17 日
快来加入技术社区，一起挖掘技术的无限潜能，携手迈向数字化新征程！
文章目录
引言
过去我们做 App，核心逻辑通常是这样的：
用户操作 → 触发逻辑 → 返回结果 → 更新 UI比如：
- 点击按钮
- 提交表单
- 查询数据
整个应用基本是 规则驱动 。但在 AI 原生应用 里，应用逻辑开始发生变化：
用户输入 → AI理解 → 生成结果 → UI展示甚至很多时候：
AI 本身就是应用的核心能力。
在 HarmonyOS 生态中，如果要开发 AI 原生鸿蒙应用，通常需要考虑三个核心问题：
1、AI 能力如何接入
2、AI 如何驱动 UI
3、如何设计 AI 原生交互
一、AI 能力接入方式
在鸿蒙应用中，AI 能力通常有三种接入方式：
1 云端大模型 API
最常见方式是调用云端模型，例如：
- AI 对话
- 文本生成
- 代码生成
- 图片生成
例如请求 AI 接口：
ts
async function chat(message: string) {
const res = await fetch("https://api.ai.com/chat", {
method: "POST",
body: JSON.stringify({
prompt: message
})
})
return res.json()
}页面调用：
ts
async send() {
const result = await chat(this.inputText)
this.answer = result.text
}这种方式优点是：
- 模型能力强
- 更新快
缺点是：
- 依赖网络
- 延迟较高
2 端侧 AI 推理
HarmonyOS 也支持 端侧 AI 推理。适合场景：
- 图像识别
- OCR
- 语音识别
- 简单文本理解
优势：
低延迟
离线可用
隐私安全例如图片识别：
用户拍照
↓
端侧模型推理
↓
返回识别结果这种模式非常适合：
- 扫描类 App
- 相机类 App
- 智能助手
3 云 + 端协同 AI
很多 AI 应用会采用 混合模式：
端侧模型 → 负责基础识别
云端模型 → 负责复杂推理例如：
语音识别（端侧）
↓
文本理解（云端）
↓
生成回复这种模式可以兼顾：
- 性能
- 成本
- 体验
二、AI 驱动 UI 的设计
传统 UI 是：
逻辑驱动 UIAI 应用通常是：
AI 结果驱动 UI例如一个 AI 助手界面：
ts
@Entry
@Component
struct ChatPage {
@State messages: string[] = []
@State input: string = ""
async send() {
this.messages.push(this.input)
const result = await chat(this.input)
this.messages.push(result.text)
this.input = ""
}
build() {
Column() {
List() {
LazyForEach(this.messages, (item) => {
ListItem() {
Text(item)
}
})
}
Row() {
TextInput({ text: this.input })
Button("Send")
.onClick(() => {
this.send()
})
}
}
}
}这里 UI 的核心数据就是：
messagesAI 返回内容之后：
messages 更新UI 自动刷新，这就是 状态驱动 UI 在 AI 应用中的典型用法。
三、AI 原生交互设计
AI 应用的交互通常和传统 App 不同。传统 App：
菜单 → 页面 → 功能AI 应用更像：
输入 → AI理解 → 动态结果例如，用户输入：
帮我总结这篇文章系统可以：
自动生成摘要这种体验更接近 Agent 模式，UI 设计通常会包括：
对话区
输入区
AI生成内容区例如：
ts
Column() {
ChatList()
InputBar()
}四、AI 任务流设计
很多 AI 应用其实不是 单次请求 。而是一条 任务流。例如：
用户输入
↓
AI解析意图
↓
调用工具
↓
生成结果例如：
用户：帮我写一段 Swift 代码系统流程：
理解需求
↓
生成代码
↓
生成解释
↓
展示 UI在代码层可以这样设计：
ts
async runTask(prompt: string) {
const intent = await aiIntent(prompt)
if (intent == "code") {
return await aiGenerateCode(prompt)
}
if (intent == "summary") {
return await aiSummary(prompt)
}
}这种方式可以构建 AI Agent 系统。
五、AI UI 动态生成
AI 原生应用还有一种更高级的玩法：**AI 生成 UI。**例如，用户输入：
生成一个待办列表AI 返回：
标题 + 列表 + 按钮系统可以动态构建 UI：
ts
if (result.type == "todo") {
TodoView(result.data)
}这种模式未来会越来越常见，因为：
UI 不再是固定的，而是 AI 生成的。
六、鸿蒙 AI 应用架构示例
一个典型 AI 鸿蒙应用架构可能是这样：
pages
├─ ChatPage
├─ TaskPage
components
├─ ChatBubble
├─ InputBar
├─ ResultCard
ai
├─ aiClient
├─ promptBuilder
├─ taskRunner
services
├─ chatService
├─ toolService核心模块：
AI Client
Task Runner
Prompt Builder这样可以把 AI 能力和 UI 解耦。
总结
AI 原生鸿蒙应用开发，本质上不是：
"在 App 里加一个 AI 功能。"
而是：
让 AI 成为应用核心能力。
一个真正的 AI 原生应用通常有三个特点：
1、AI 负责理解用户意图
2、UI 根据 AI 结果动态变化
3、应用围绕任务流运行
从技术角度看，开发者需要重点关注：
- AI 能力接入
- 状态驱动 UI
- AI 任务流设计
- AI 与 UI 解耦架构
当这些设计做好之后，鸿蒙应用就会从：
传统 App进化成：
AI Agent App这也是未来应用形态非常重要的方向。