更新记录

1.0.4（2021-06-29）

1. 加入魔方拼图模块
2. 更改滑动拼图描述

1.0.3（2021-06-25）

1. 添加拖动拼图模式

1.0.2（2021-06-25）

1. 更新滑动拼图操作模式，添加滑动操作
2. 修改游戏完成时弹窗代码位置，改为由success函数触发
3. 添加部分说明文档

平台兼容性

项目简介

项目来源

我本人耍了很多密室逃脱类型的解谜游戏，所以个人倾向于自己制作一款。 拼图游戏在解密谜题小游戏里面非常常见，所以我想自己写一个模块，来为未来的密室逃脱游戏开发做铺垫。

其他游戏项目

1. 第一弹简单扫雷游戏,获得2021Dcloud插件大赛贡献奖
2. 第二弹简单卡牌游戏,获得2021Dcloud插件大赛贡献奖
3. 第三弹简单俄罗斯方块游戏,获得2021Dcloud插件大赛贡献奖
4. 第四弹简单数字游戏集合,获得2021Dcloud插件大赛贡献奖

另附2021年Dcloud插件大赛获奖结果

项目玩法

滑动拼图

游戏中一张图片被分割为多个图块，这些图块按照向上向下向左向右的方式进行打乱，玩家通过移动图块对原始图片进行还原。

控制方式：上下左右滑动游戏区域，或点击下方按钮

旋转拼图

游戏中一张图片被分割为多个围绕同一圆心的环形图块，这些图块按照不同的旋转角度进行打乱，玩家通过旋转图块对原始图片进行还原。

控制方式：选中图层左右滑动旋转图层到合适位置

拖动拼图

游戏中一张图片被分割为多个图块，这些图块打乱后排列在下方，玩家通过移动图块对原始图片进行还原。

控制方式：长按选中并拖动下方的图块到地图区域放置，致歉：目前对于已拖动到地图的图块无法再次拖动，也无法删除，如果需要置换其他图块，请将目标图块再次拖动到该区域完成交换，替换的图块会被重新放置到下方。

魔方拼图

游戏中的图片依照向上下左右平移的方式进行打乱，玩家通过点击四周的方向键移动图块复原图片

控制方式：点击四周的方向键移动图块复原图片

插件说明

插件引用方式

// index.vue
<templete>
    <puzzle gameType="slice"></puzzle>
</templete>

<script>
    import puzzle from '@/uni_modules/gwh-jigsaw_puzzle/components/gwh-jigsaw_puzzle/gwh-jigsaw_puzzle.vue'
    export default{
        components:{
            puzzle
        },
        // do something else 
    }
</script>

参数说明

公共参数

私有参数

滑动拼图模式

gameType = 'slice'

旋转拼图模式

gameType = 'rotate'

拖动拼图模式

gameType = 'move'

魔方拼图模式

gameType = 'cube'