当前位置：首页 > news >正文

【OpenHarmony/HarmonyOs 】数学学习报告页：本地统计卡片、正确率与隐私友好学习画像

news 2026/7/6 1:35:22

【OpenHarmony/HarmonyOs 】数学学习报告页：本地统计卡片、正确率与隐私友好学习画像

项目类型：OpenHarmony / HarmonyOS ArkTS 数学学习应用
项目名称：数学视界
对应主题：端侧 AI、隐私保护方案、全场景智慧生活
关键词：ArkTS、学习报告、本地统计、正确率、学习画像、隐私保护 📊

一、为什么学习报告页要本地化？

学习报告很有价值，但也很敏感。它可能包含：

学习天数；
连续学习记录；
挑战次数；
正确率；
计算次数；
公式浏览；
学习时长；
历史最高分；
答题数量。

这些数据能够反映用户的学习习惯和薄弱环节。如果每次生成报告都上传到服务器，就会带来隐私风险。

数学视界项目选择的是本地统计：所有报告数据都来自AppState，在端侧生成，在本地展示。

二、我的页面：学习报告的入口

MyPage.ets中的页面结构如下：

build() { Stack() { Scroll() { Column() {this.buildHeader()this.buildStatsCards()this.buildGoalSection()this.buildDataSection()this.buildSettingsSection()this.buildFeedbackSection()this.buildVersionInfo() } } } }

可以看到，“我的”页面不仅是设置页，也承担了学习报告功能：

顶部展示 App 和用户状态；
统计卡片展示关键数据；
今日目标展示学习进度；
学习数据展示更细的行为指标；
设置和反馈入口提供管理能力。

三、统计卡片：让用户快速看到学习状态

统计卡片包括学习天数、连续学习、挑战次数、正确率、计算次数、公式浏览等。

卡片构建函数：

@BuilderbuildStatCard(emoji: string,label: string,value: string,bgColor: string,textColor: string ) { Column() { Text(emoji).fontSize(20) Text(value).fontSize(20).fontWeight(FontWeight.Bold).fontColor(textColor) Text(label).fontSize(11).fontColor(this.getColor('#95A5A6', '#888888')) } }

这种设计适合移动端：每张卡片只展示一个指标，用户扫一眼就能理解。

四、正确率：端侧统计，不上传答案

正确率通过挑战统计计算：

getAccuracyRate():string{conststats = AppState.challengeStatsif(stats.totalQuestions ===0)return'—'constrate:number= Math.round((stats.totalCorrect / stats.totalQuestions) *100)returnrate +'%'}

这里用到的数据是：

totalCorrect：累计正确题数；
totalQuestions：累计答题数。

它不需要把每道题上传到云端，只要本地累计即可生成整体正确率。

五、学习数据区：从工具行为到学习画像

学习数据区展示更细指标：

this.buildDataRow('🧩','趣味百科已读', AppState.studyData.funFactsViewed +' 篇','#EBF5FF','#3498DB')this.buildDataRow('📐','单位换算次数', AppState.studyData.totalUnitsConverted +' 次','#F5EEF8','#9B59B6')this.buildDataRow('⏱️','累计学习时长',this.formatTotalTime(AppState.challengeStats.totalTimeSpent),'#FEF9E7','#E67E22')this.buildDataRow('🏆','历史最高分', AppState.challengeStats.bestScore >0? AppState.challengeStats.bestScore +' 分':'—','#EAFAF1','#2ECC71')this.buildDataRow('🔢','累计答题数', AppState.challengeStats.totalQuestions +' 题','#FDECEA','#E74C3C')

这些指标把不同模块串起来：

趣味百科阅读；
单位换算；
挑战答题；
学习时长；
历史最高分。

也就是说，报告页不是单一题库报表，而是整个数学学习行为的总览。

六、DataRow：报告项的统一呈现

每一行学习数据通过统一组件展示：

@BuilderbuildDataRow(emoji: string,label: string,value: string,bgColor: string,accentColor: string ) { Row() { Text(emoji).fontSize(16).width(32) Text(label).fontSize(14).fontColor(this.getColor('#34495E', '#FFFFFF')).flexGrow(1) Text(value).fontSize(13).fontWeight(FontWeight.Medium).fontColor(accentColor) } }

统一组件的好处是：

后续新增指标很方便；
视觉风格保持一致；
深色模式适配集中处理；
数据项不会显得杂乱。

七、学习报告和端侧 AI 的关系

“端侧 AI”不一定等于大模型。对学习 App 来说，端侧分析本身就是智能能力：

计算正确率；
统计学习时长；
分析连续学习；
判断目标是否完成；
识别最近学习行为；
生成学习建议。

例如可以基于正确率生成建议：

functionbuildReportSuggestion(rate: number): string {if(rate <60)return'建议优先复习错题和基础知识'if(rate <80)return'掌握不错，可以继续专项练习'return'表现优秀，可以尝试更高难度挑战'}

这类逻辑完全可以在本地完成，解释性也更强。

八、隐私保护：学习画像不出端

学习报告中最敏感的不是姓名，而是行为数据：

哪些题错了；
学习多久；
正确率多少；
有没有坚持；
哪些模块用得多。

数学视界当前通过AppState本地管理：

conststats = AppState.challengeStatsconstdata= AppState.studyData

报告页只是读取这些本地对象，不需要网络，也不需要用户登录。这样就能降低隐私风险。

九、全场景扩展：报告页可以拆成小卡片

学习报告很适合全场景展示，但不一定要展示完整页面。可以拆成轻量卡片：

场景	展示内容
桌面卡片	今日进度、连续学习
元服务	本周正确率、今日目标
平板页面	完整学习报告
实况窗结束态	本次挑战分数与用时

这样不同设备看到的是不同粒度的数据，而不是简单复制页面。