项目概述

项目名称: 抽奖系统 (choujiang) 项目类型: HarmonyOS移动端应用 开发平台: 华为HarmonyOS

技术栈

开发语言

• ArkTS: TypeScript的超集，专为HarmonyOS开发设计

前端技术

• ArkUI: HarmonyOS声明式UI框架
• Canvas API: 用于绘制转盘图形界面
• 组件化开发: 基于@Component装饰器的组件系统

构建工具

• Hvigor: HarmonyOS官方构建工具
• DevEco Studio: 集成开发环境

用户界面

界面类型

• GUI (图形用户界面): 基于HarmonyOS的可视化图形界面
• 移动端界面: 专为手机设备优化的触摸交互界面

界面特色

• 转盘设计: 使用Canvas绘制的彩色转盘
• 动画效果: 流畅的旋转动画和停止效果
• 响应式布局: 适配手机屏幕的界面设计
• 触摸交互: 支持点击按钮进行抽奖操作
• 视觉反馈: 实时显示抽奖状态和结果

界面组件

• 标题栏显示”幸运大转盘”
• 结果显示区域
• 转盘Canvas画布
• 中央开始/停止按钮

数据存储

存储方式: 无数据库，使用组件内存状态管理 数据类型: 奖品信息存储在@State装饰的数组中

项目功能

核心功能

1. 转盘抽奖: 6个不同奖项的随机抽奖
2. 手动控制: 用户可控制转盘开始和停止
3. 动画展示: 平滑的转盘旋转动画效果
4. 结果显示: 清晰展示中奖结果

奖项设置

• 特等奖 (红色)
• 一等奖 (青色)
• 二等奖 (蓝色)
• 三等奖 (绿色)
• 四等奖 (黄色)
• 谢谢参与 (粉色)

抽奖机制

• 完全随机: 移除了概率系统，采用纯随机算法
• 即时反馈: 转盘停止后立即显示结果
• 视觉效果: 结合颜色和动画提升用户体验

项目特点

1. 轻量化: 无需数据库，纯前端实现
2. 跨平台: 基于HarmonyOS生态
3. 用户友好: 简洁直观的操作界面
4. 性能优化: 高效的Canvas渲染和动画处理

开发环境要求

• DevEco Studio IDE: 华为官方开发环境
• HarmonyOS SDK: 版本5.1.1(19)及以上
• Node.js: 支持Hvigor构建工具的运行环境
• ArkTS开发工具链: 支持ArkTS语言和ArkUI框架

项目结构

A002_ArkTS_抽奖系统/
├── entry/                    # 主模块目录
│   └── src/main/ets/
│       ├── entryability/     # 应用入口能力
│       └── pages/
│           └── Index.ets     # 主页面组件
├── build-profile.json5       # 构建配置文件
├── oh-package.json5          # 包管理配置
└── hvigorfile.ts            # 构建脚本

构建和运行

使用Hvigor构建工具进行项目构建：

# 构建项目
hvigor assembleHap

# 调试模式构建
hvigor assembleHap --mode debug