课程设计-解决方案

课程设计-解决方案

(http://note.youdao.com/noteshare?id=4ad24062ef5a9c5569863b2802ec5f87)

课程设计的题目

H5小游戏开发——同色点点

解决的问题

实现一个可以在浏览器中运行的小游戏，也可以做成小程序

选择的语言与开发平台

语言：TypeScript、HTML、CSS、Python
平台：EgretWing、Django、Ubuntu

要解决的关键问题

• 界面布局与显示
• 玩家交互规则

技术路线图

1. 前端：

sequenceDiagram
新建项目->>构建布局与样式: HTML+CSS
构建布局与样式->>加载绘制图形: JavaScript
加载绘制图形->>核心界面与交互逻辑: Egret框架+TypeScript

划分功能模块

• 入口文件
• 界面UI绘制模块
• 圆圈绘制模块
• 功能逻辑模块

功能模块流程图

graph TD
A(入口文件)-->B[绘制UI界面]
B-->C[绘制圆圈图形]
C-->D[添加点击监听器]
D-->E{监听事件}
E-->|发生点击事件|f{首次点击?}
f-->|否|F
f-->|是|j[开始计时并监听时间]
j-->F[小圆圈重绘]
E-->|没有点击事件|E
E-->|时间到|G[关闭监听器]
G-->H(游戏结束)
F-->D