鸿蒙 Next 小众爱好图鉴 App 开发实战：兴趣发现 + 分类系统 + 收藏管理

作者：duluo
SDK 版本：HarmonyOS API 24 (Next)
开发工具：DevEco Studio
语言框架：ArkTS + ArkUI
字数：约 9600 字

---

目录

1. 引言
2. 产品概念与爱好模型
3. 两 Tab 架构设计
4. 发现页与分类筛选
5. 爱好卡片设计
6. 收藏系统
7. 详情弹窗
8. 连续第八款零错误
9. 第四十二款 App 全景回顾
10. 结语

---

1. 引言

1.1 小众爱好的价值

在互联网时代，任何一个小众爱好都能找到同好——不管你喜欢的是微观景观、押花艺术还是天体观测，网上都有一群和你一样的人。

“小众爱好图鉴"App 做的是把 12 种有趣的小众爱好集合在一起，让用户发现"原来还有这种爱好”。不是功能型工具，而是一本可翻阅的"兴趣百科全书"。

1.2 第四十二款 App

App 数量：    42
代码总行数：  ~21,100 行
编译错误数：  ~315 个
博客总字数：  ~420,000 字
技术博客数：  42 篇

---

2. 产品概念与爱好模型

2.1 功能需求

• 浏览 12 种小众爱好
• 5 个分类标签筛选
• 收藏感兴趣的爱好
• 查看详情 + 入门建议

2.2 爱好数据模型

interface Hobby {
  id: number; name: string; emoji: string; cat: string;
  diff: string; cost: string; desc: string; tip: string; fans: number;
}

9 个字段。diff（难度）、cost（花费）、tip（入门建议）是区别于其他 App 的特色字段，为每种爱好提供实用信息。

2.3 12 种爱好的分布

5 个分类各覆盖 1-4 种爱好。难度从⭐到⭐⭐⭐⭐四档，花费从免费到高四档。

---

3. 两 Tab 架构

Tab	图标	功能
0	🔍	发现 — 浏览所有爱好
1	⭐	兴趣 — 已收藏列表

---

4. 发现页设计

5 个分类标签 + 爱好卡片列表。每张卡片展示 emoji、名称、分类、难度、花费、粉丝数、描述、入门建议。

4.1 粉丝数格式化

formatNum(n: number): string {
  return n >= 10000 ? (n / 10000).toFixed(1) + '万' : n + '';
}

12450 → “1.2万”，3450 → “3450”。万以上用"万"单位，千位数直接显示。

---

5. 爱好卡片

🌿 微观景观            ❤️ 1.2万
手工 · ⭐⭐ · 花费低
在小小的容器里打造一个完整的微缩世界…
💡 从苔藓瓶开始，成本不到 50 元。  ⭐ 收藏

五层信息：emoji + 名称 | 分类/难度/花费 | 描述 | 入门建议 | 收藏按钮。

---

6. 收藏系统

addInterest(id: number): void {
  this.interested = [id, ...this.interested];
}

收藏的爱好在"兴趣"Tab 中展示。与系列中其他 App 的收藏/联系/借出系统一致。

---

7. 详情弹窗

弹窗展示全部信息 + 入门建议（绿色高亮）+ 收藏按钮。

---

8. 连续第八款零错误

本 App 是系列中第 8 款零错误 App（App 31/33/35/37/38/39/40/42），连续零错误仍在继续。

---

9. 第四十二款 App 全景

指标	数值
代码行数	231 行
编译错误数	0 个
@Builder	6 个
爱好数	12 种
分类	5 个

---

10. 结语

12 种爱好、12 篇介绍、12 条入门建议——不需要很多代码，只需要内容足够有趣。

---

（全文完）