更新记录

1.0.1（2025-11-17） 下载此版本

init

1.0.0（2025-11-17） 下载此版本

• 三消机制：点击卡牌使其下移至底部框（最多储存7张），当出现3张相同卡牌时可消除
• 多关卡系统：支持无限关卡，难度逐级递增
• 计时器系统：关卡越高，时间越短
  • 第1关：60秒
  • 第2关：30秒
  • 第3关：15秒
  • 第4关：7.5秒
  • 依次类推（时间减半）

平台兼容性

uni-app(4.84)

uni-app x(4.84)

zsk-sheepUtil - 三消游戏组件

一个基于 uni-app-x 的三消游戏组件，支持多关卡、计时器、道具系统等功能。

功能特性

核心玩法

• 三消机制：点击卡牌使其下移至底部框（最多储存7张），当出现3张相同卡牌时可消除
• 多关卡系统：支持无限关卡，难度逐级递增
• 计时器系统：关卡越高，时间越短
  • 第1关：60秒
  • 第2关：30秒
  • 第3关：15秒
  • 第4关：7.5秒
  • 依次类推（时间减半）

道具系统

每局提供3个道具，用于辅助游戏：

• 复活道具：游戏失败时可使用复活
• 重排道具：重新排列卡牌
• 炸弹道具：消除指定卡牌

技术特性

• 响应式布局，适配手机端
• 扁平化设计，无覆盖动画
• 确保卡牌类型数量为3的倍数，保证可完全消除
• 支持背景音乐和音效（需配置音频文件）

使用方法

1. 在页面中引入组件

<template>
    <view class="page-container">
        <zsk-sheepUtil :level="gameLevel" @game-over="onGameOver"></zsk-sheepUtil>
    </view>
</template>

<script setup>
import zskSheepUtil from '@/uni_modules/zsk-sheepUtil/components/zsk-sheepUtil/zsk-sheepUtil.vue'

const gameLevel = ref(1)

const onGameOver = () => {
    console.log('游戏结束')
    // 处理游戏结束逻辑
}
</script>

2. 添加卡牌图片

将卡牌图片放置在 static/cards/ 目录下，支持以下卡牌类型：

• wool.png - 羊毛球
• grass.png - 草
• flower.png - 花
• star.png - 星星
• heart.png - 心形
• diamond.png - 钻石

3. 配置音频（可选）

如需背景音乐和音效，将音频文件放置在：

• 背景音乐：static/music/bg.mp3
• 音效：static/sounds/click.mp3、eliminate.mp3、gameOver.mp3

Props

Events

游戏规则

1. 点击游戏区域中的卡牌，卡牌会移动到底部框
2. 底部框最多可容纳7张卡牌
3. 当底部框中有3张相同类型的卡牌时，会自动消除（即使中间有其他卡牌）
4. 消除卡牌可获得分数
5. 当所有卡牌都被消除且底部框为空时，进入下一关
6. 每关有时间限制，时间到0时游戏结束
7. 可以使用道具辅助游戏

开发说明

目录结构

uni_modules/zsk-sheepUtil/
├── components/
│   └── zsk-sheepUtil/
│       └── zsk-sheepUtil.vue  # 主组件文件
├── readme.md                  # 说明文档
└── changelog.md               # 更新日志

技术栈

• uni-app-x
• Vue 3
• JavaScript

注意事项

1. 确保卡牌图片文件存在于 static/cards/ 目录
2. 图片建议尺寸：正方形，建议 100x100px 或更大
3. 组件会自动确保生成的卡牌类型数量为3的倍数
4. 计时器会在游戏开始时自动启动

许可证

MIT License