用 Cursor 从零搭一个 Compose 本地记账 App:实战记录与源码解析

最近用 Cursor 做了一次完整的 Android 练手:从底部导航骨架,迭代成一个能「记一笔、按日查账、看统计」的 Compose 记账 Demo。

这不是上架产品,而是面向学习与功能验证的本地应用:数据只存在本机 Room 数据库,无账号、无云端同步,适合用来熟悉 Compose 声明式 UI、ViewModel 状态流和 Room 本地存储。

本文记录:为什么选 Cursor、项目能做什么、技术怎么搭、和 AI 协作时怎么提需求,并附上关键代码与目录说明,方便你复现或二次开发。

项目是什么?

ComposeApplication 是一个 Kotlin + Jetpack Compose 的本地记账应用,核心能力包括:

源码地址:https://github.com/shanxi789/ComposeApplication

模块 功能说明
首页 按日查看账单列表,展示当日收入、支出与结余
记一笔 新增/编辑账单:收入/支出切换、分类选择、金额校验、备注
日期筛选 顶部日期栏 + 日历,选择任意一天查看对应账单
我的 累计/本月统计、支出分类 Top、清空数据、关于

数据仅保存在本机,适合学习 Compose + Room 的完整数据流。

界面预览

为什么用 Cursor 做这个项目?

传统开发里,搭骨架、写 DAO、调 Compose 边距,往往要反复查文档。Cursor 的优势在于:

  1. 对话式迭代:用自然语言描述需求,由 AI 生成/修改代码,再在 IDE 里直接运行验证。
  2. 理解工程上下文:能根据现有包结构、命名风格补全 Repository、ViewModel,减少风格不一致的补丁代码。
  3. 适合分阶段交付:本项目就是典型「小步快跑」------先导航,再数据库,再筛选与统计,最后打磨 UI 细节。

实际迭代路径

  1. 底部导航 + 横向分页骨架 --- Scaffold + NavigationBar + HorizontalPager
  2. Room 本地库与记账 CRUD --- Entity、Dao、Repository
  3. 按日筛选与日历选日期 --- DateFilterState、日期范围查询
  4. 「我的」页统计与数据管理 --- Flow 聚合、分类排行、清空数据
  5. UI 打磨 --- 列表布局、金额最多 10 位数字校验、Edge-to-Edge 安全区

技术栈一览

类别 选型
语言 Kotlin
UI Jetpack Compose + Material3
架构 ViewModel + Repository
本地存储 Room(KSP 编译)
异步 Kotlin Coroutines + Flow
SDK minSdk 24,targetSdk 36

架构设计

采用分层结构,UI 不直接碰数据库:

UI (Compose Screen) → ViewModel → Repository → Dao + Room Database

主界面用 Scaffold 承载底部导航,HorizontalPager 切换「首页 / 我的」。数据层由 AccountRepository 统一封装按日、按月、全量查询和 CRUD。首页 HomeViewModel 用 StateFlow 管理选中日期、账单列表、当日汇总和弹窗状态。

数据库:库名 accounting_demo.db,表 account_records(金额、类型、分类、备注、创建时间戳)。

项目目录

app/src/main/java/com/shx/composeapplication/

  • MainActivity.kt --- 主 Activity,底部 Tab + 分页
  • AccountingApplication.kt --- 全局 Repository
  • data/ --- entity、dao、database、repository、model
  • ui/home、ui/profile --- 界面与 ViewModel
  • ui/theme --- Material3 主题
  • util/ --- 金额过滤、日期、格式化

想加功能时,建议优先看 ui/home、data/repository。

实现细节

  • 金额输入:AmountInputFilter 限制数字、最多 10 位。
  • 按日筛选:DateFilterBar + 日历,按 createdAt 时间戳区间查询。
  • 我的页统计:基于 Flow 本地聚合,无需网络。
  • Edge-to-Edge:enableEdgeToEdge() 与安全区处理。

如何运行

  1. 用 Android Studio 打开项目根目录
  2. Gradle 同步完成后连接设备或模拟器,运行 app 模块

命令行:./gradlew assembleDebug

和 Cursor 协作的心得

  1. 需求要具体,一次说清楚页面和数据行为。
  2. 一次只改一块,先 CRUD 再筛选再统计。
  3. 每步都编译运行,把错误反馈给 AI 继续修。
  4. 保持目录约定,后续扩展时 AI 更容易对齐风格。

后续可扩展

账单导出、自定义分类、图表统计、深色模式、数据备份等,Repository 分层已预留扩展空间。

小结

这个 Compose 记账 Demo 走通了 Compose UI → ViewModel → Repository → Room,并在 Cursor 里通过对话迭代完成,适合作为 Jetpack Compose + Room 的练手样本。

相关推荐
千里马学框架2 天前
一起学 Android 14:ShellTransition 屏幕旋转过程深度剖析
android·智能手机·性能优化·framework·性能·屏幕旋转·rotation
美狐美颜SDK开放平台2 天前
开发直播APP时如何接入视频美颜SDK?开发流程与注意事项
android·人工智能·计算机视觉·音视频·直播美颜sdk
AFinalStone2 天前
Android7 SystemUI源码解析(七)Keyguard锁屏模块深度解析
android·systemui
致远ccc2 天前
Google Play 上架前如何测试 App?多国家 Android 环境测试
android·app测试·googleplay·多国家应用测试
ttyyttemo2 天前
Kotlin 协程中的 Job 结构化并发与取消
android
sun0077002 天前
tbox 4g/5g切换,导致wan ip 改变,导致车机旧网络不可用。需要重启车机才行
android
ai2work3 天前
ch23 综合复刻:从零做一个最小可用版本(capstone)
kotlin
其实防守也摸鱼3 天前
内网穿透与反向代理:原理、工具与实战指南
android·大数据·运维·安全·网络安全·自动化·渗透
ai2work3 天前
ch21 签名、校验与发版
kotlin
AFinalStone3 天前
Android7 SystemUI 源码解析(四)NavigationBar 导航栏与 SystemBars
android·systemui