官网:汉字学习:汉字学习 主要针对小学语文的汉字学习,可以学习汉字的书写笔画,拼音等。 - AtomGit | GitCode
基本介绍
小学生汉字学习练习软件
基于 Hanzi Writer 开源项目开发的汉字学习工具,专为小学生设计的同步练习软件。
📚 功能特点
🎯 核心功能
- 年级分类: 支持小学1-6年级,按教学大纲分类汉字
- 笔画动画: 完整演示汉字的正确笔画顺序
- 手写练习: 实时书写识别和评分系统
- 测验模式: 多选题测验,巩固学习效果
- 进度跟踪: 自动记录学习进度和准确率
🎨 用户体验
- 响应式设计: 支持桌面和移动设备
- 友好界面: 专为小学生设计的直观操作
- 动画反馈: 丰富的视觉反馈和奖励机制
- 数据持久化: 本地保存学习进度
🚀 快速开始
方式一:使用Python服务器(推荐)
# 进入项目目录 cd 汉字学习 # 启动服务器 python start_server.py # 或者指定端口 python start_server.py 8081方式二:使用其他Web服务器
# 使用Node.js的http-server npx http-server # 使用Python内置服务器 python -m http.server 8080 # 使用PHP内置服务器 php -S localhost:8080方式三:直接打开
双击index.html文件在浏览器中打开(部分功能可能受限)
📖 使用指南
1. 选择年级
在页面顶部的下拉菜单中选择要学习的年级(1-6年级)
2. 选择汉字
在左侧的汉字网格中点击要学习的汉字
3. 观看笔画动画
点击"播放笔画动画"按钮,观看汉字的正确书写顺序
4. 手写练习
- 点击"开始练习"进入练习模式
- 在练习区域书写汉字
- 点击"检查书写"获得评分
- 使用"清除重写"重新练习
- 完成后点击"下一个字"继续
5. 测验模式
- 点击"测验模式"开始5道题的测验
- 根据释义选择正确的汉字
- 查看测验结果和得分
6. 进度跟踪
右侧面板显示学习进度:
- 已学汉字数量
- 练习次数
- 正确率
- 可视化进度图表
📁 项目结构
汉字学习/ ├── index.html # 主页面 ├── style.css # 样式文件 ├── script.js # 核心逻辑 ├── start_server.py # 服务器启动脚本 └── README.md # 项目说明🎓 汉字数据库
软件内置了小学1-6年级的常用汉字,按以下分类:
- 一年级: 基础汉字、数字、基本概念
- 二年级: 自然元素、基础名词
- 三年级: 家庭关系、社交词汇
- 四年级: 四季自然、生物词汇
- 五一年级: 形容词、描述词汇
- 六年级: 动作动词、学习活动
每个汉字包含:
- 汉字本体
- 拼音标注
- 释义说明
- 笔画数
🛠️ 技术实现
前端技术
- HTML5: 页面结构和语义
- CSS3: 样式设计和动画效果
- JavaScript ES6+: 核心逻辑和交互
- Canvas: 进度图表绘制
第三方库
- Hanzi Writer: 汉字笔画动画和书写识别
- LocalStorage: 数据持久化存储
兼容性
- 现代浏览器(Chrome 60+, Firefox 60+, Safari 12+)
- 移动端浏览器
- 响应式设计适配各种屏幕尺寸
📊 数据统计
软件会记录以下学习数据:
- 每个汉字的学习状态
- 练习次数和正确率
- 学习进度和完成度
数据存储在浏览器的本地存储中,清除浏览器数据会重置进度。
🎯 学习建议
有效练习方法
- 先看动画: 仔细观察笔画顺序
- 再练习: 在练习区域多次书写
- 及时检查: 获得即时反馈
- 反复练习: 确保掌握后再进行下一字
- 定期测验: 检验学习效果
家长指导
- 鼓励孩子按正确笔画顺序书写
- 及时表扬孩子的进步
- 定期查看学习进度
- 适当控制学习时间
🔧 自定义扩展
添加新汉字
在script.js的initializeCharacterDatabase()方法中,按照现有格式添加新汉字:
{ char: '新字', pinyin: 'xīn zì', meaning: '新字的意思', strokes: 笔画数 }修改样式
在style.css中调整颜色、字体、布局等样式。
功能扩展
在script.js中添加新的功能模块,如:
- 词汇组合练习
- 句子拼写
- 声音朗读
- 更多游戏模式
📝 更新日志
v1.0.0 (2025-12-16)
- ✨ 初始版本发布
- 🎯 支持1-6年级汉字学习
- ✍️ 笔画动画演示功能
- 📝 手写练习和评分
- 📊 测验模式和进度跟踪
- 📱 响应式设计支持
git提交
创建repo
https://gitcode.com/skywalk163/hanzixuexi目录初始化
git init关联远程
需要先到gitcode创建项目
git remote add gitcode https://gitcode.com/skywalk163/hanzixuexi提交信息
git add . git commit -m "first commit"创建main分支
git switch -c mainpush代码
git push gitcode main