（做一个小记录，所以会有错误修改的记录和思考，有空整理一个完整的教程，还存在一些bug，待填坑）    看看能不能做一个蓝牙版的双人模式

最终效果展示

游戏开发背景

最近大学里需要用appinventor开发一个app，怀念自己的童年了，就想做一个黄金矿工了，于是我拿出我的《游戏设计与开发-unity实战完全自学教程》吸收其中的程序设计的思路，同时我想到appinventor的特性，传感器的使用比较方便，那我能不能做出一个基于传感器的黄金矿工呢？

那就试试吧！

游戏功能

1.操作方式：修改原来的方向键上下来控制放钩子和丢炸弹的操作，利用方向传感器，让手机左右摇摆来控制钩子的摆动，同时利用加速度传感器，如果手机快速向下放，就会放爪子。如果手机快速向上放，就会丢炸弹。用下滑来控制钩取，上滑控制丢鞭炮。

2.游戏模式：在规定时间内抓取矿石，玩家通过抓取矿石达到对应的分数

3.添加排行榜，利用网络数据库，可以看到每次游玩的记录分数

准备工作

需要一些资源，就用《游戏设计与开发-unity实战完全自学教程》中的配套素材了。

这里用脚本截取了一些帧图片，非常感谢这篇博客

Unity基础篇：Unity2D图集（2）：将剪裁好的图片导出。_unity导出图片-CSDN博客s、

思路呈现

同时首先要收集一些参数，这个项目打算是做成横屏的，先需要收集适度摇晃手机的参数和适度移动手机的参数，确定什么角、什么分量适合做变量，所以先做一个简单的app，检测一下。项目组件设计和逻辑设计如下图所示：

​

​

通过测试发现方位角不适合作为变量，因为在手机从画面朝上翻转到画面朝下的过程中值会改变，水平放置时，向左向右移动时也会改变。同时翻转角很适合当变量，手机从画面朝上翻转到画面朝下的过程中值不会改变，当我们像平时打游戏的时候的姿势拿着手机时，左右摇晃，参数大概是在-30到30左右，基于这个数据，我们来做钩子方向的摆动。同时在测试也发现在钩子左右摇晃时，加速度就在改变，所以决定采用滑动效果来控制钩取了，好像更难了，属于是不破不立了（后期看看能不能把这个坑填了）

​

然后是钩子要放射出去，所以我们要知道appinventor的运动方向是什么样的，如下图所示：

​

这里就又有一个问题了，虽然我们可以控制钩子的朝向时,如果给设置速度的话，就不是我们想要的移动方向，就像我现在基于如图所示的设计的演示的这样，虽然方向为0，却不是向下的移动。

​

​

那我们要怎么做呢，这里我想到的是新建一个球形精灵（颜色设置为透明），用于控制钩子的方向，进行以下的操作，如图所示：

​

​

但还涉及一些逻辑，比如什么时候收回钩子啊等等，就下面再介绍解决方法，但这里要注意了我们的钩子会跟着球形精灵运动，所以后面一定要考虑到这个球形精灵。

现在出现了一个问题，因为app inventor中用户界面没有图层的概念，不能实现局部覆盖的效果，钩子与人物是分离的，如图所示，要如何解决呢？可能就是解决不了，毕竟appinventor不是做动画效果的行家。

​

思路固化了，认为人物不进行交互，就不放在画布里。解决方法就是把所有的元素都放在画布中就行

界面设计

开始界面

界面设计

 ​

组件	所在组件栏	用途	命名	属性设置
Screen	——	应用于缺省的屏幕，作为放置所需其他组件的容器	Screen1	应用名称： 传感黄金矿工 背景图片： Background2.png 图标： Background2.png 标题： 传感黄金矿工 屏幕方向： 锁定横屏
水平布局	界面布局	将组件按行排列	水平布局1	水平对齐：居中 垂直对齐：居中 背景颜色：透明 高度：60比例 宽度：70比例
按钮	用户界面	用于进入下一个屏幕	开始按钮	背景颜色：透明 字号：25 高度：100像素 宽度：100像素 文本：开始 文本颜色：红色
音频播放器	多媒体	用于播放背景音乐	音频播放器1	循环播放：勾选 源文件： BG1.mp3

逻辑设计

​

关卡界面

界面设计

​

​

组件	所在组件栏	用途	命名	属性设置
Screen	——	应用于缺省的屏幕，作为放置所需其他组件的容器	Screen_game	屏幕方向： 锁定横屏
垂直布局	界面布局	将组件按列排列	垂直布局1	高度：充满 宽度：充满
水平布局	界面布局	展示分数，剩余时间等	水平布局1	宽度：充满
标签	用户界面	展示剩余时间	剩余时间	文本： 剩余时间：0s
标签	用户界面	展示现在的动画状态，方便调试	动画状态	宽度：25比例 文本： 当前的动画状态为：
标签	用户界面	展示当前抓到的物体，方便调试	当前抓到的物体	宽度：25比例 文本： 当前抓到的物体：
标签	用户界面	展示目前的炸弹数，判断是否可以使用炸弹	炸弹数	宽度：15比例 文本： 炸弹数：
标签	用户界面	展示获得的分数	分数	文本： 分数：
画布	绘图动画	作为放置其他画布元素的容器	画布1	背景颜色：透明 背景图片： Background1.png 高度：充满 宽度：充满
球形精灵	绘图动画	作为控制钩子移动的一个透明元素 （创建该元素的原因可见准备工作中的思路呈现）	controlMove	画笔颜色：透明 X坐标：257 Y坐标：36
球形精灵	绘图动画	作为控制滑动功能的组件	slipBtn	画笔颜色：红色 X坐标：15 Y坐标：81
球形精灵	绘图动画	绘制绳索时需要这个组件计算初始坐标	Rope	X坐标：270 Y坐标：31 （放置在Clip钩子图片的中心） 画笔颜色：透明
图像精灵	绘图精灵	作为钩子	Clip	高度：20像素 宽度：32像素 图片：Clip.png X坐标：257 Y坐标：36 （坐标跟球形精灵controlMove一致）
图像精灵	绘图精灵	作为矿工	Miner	高度：30像素 宽度：40像素 图片：Miner_0.PNG X坐标：257 Y坐标：12
图像精灵	绘图精灵	随机分数袋子，抓取后得到随机100-350的分数	Bag	背景图片：Bag.PNG X,Y坐标可以自己设置 大小可以自己调整
图像精灵	绘图精灵	作为矿石的一种，抓取后得到300的分数 体积：Gold1>Gold2>Gold3	Gold1	背景图片：Gold.PNG X,Y坐标可以自己设置 大小可以自己调整
图像精灵	绘图精灵	作为矿石的一种，抓取后得到200的分数 体积：Gold1>Gold2>Gold3	Gold2	背景图片：Gold.PNG X,Y坐标可以自己设置 大小可以自己调整
图像精灵	绘图精灵	作为矿石的一种，抓取后得到100的分数 体积：Gold1>Gold2>Gold3	Gold3	背景图片：Gold.PNG X,Y坐标可以自己设置 大小可以自己调整
图像精灵	绘图精灵	钻石，抓取后得到300的分数	diamond	背景图片：diamond.PNG X,Y坐标可以自己设置 大小可以自己调整
图像精灵	绘图精灵	作为显示是否有炸弹的图片	BombUI	高度：20像素 宽度：10像素 图片：BomeUI.png X坐标：306 Y坐标：19
图像精灵	绘图精灵	用于当使用炸弹时显示爆炸的特效	BomeEffect	高度：30像素 宽度：30像素 图片：bEff_0.PNG 位置随便放
计时器	传感器	用于图片动画效果的控制等	计时器1	计时间隔：100
计时器	传感器	用于标签文本内容显示等	计时器2	计时间隔：100
方向传感器	传感器	用于钩子摇摆效果的控制	方向传感器1
对话框	用户界面	用于游戏结束时让用户输入姓名	对话框1
音频播放器	多媒体	用于播放背景音乐	BG播放器	循环播放：勾选 源文件：BG2.mp3
音频播放器	多媒体	用于例如丢炸弹、钩子钩取，抓取到矿石的音效	Event播放器
微数据库	数据存储	用于获取已经存在的排行榜数据和更新排行榜数据	微数据库1

逻辑设计

思路呈现

1.实现unity中的有限状态机的动画效果，即根据不同的状态执行不同的动画效果（crazy）

对于矿工：

动画名称	包括的帧图像名称（按帧的顺序）
Bomb（丢炸弹的样子）	Miner_5,Miner_6,Miner_7
Down(丢出钩子的样子)	Miner_1
Idle(没进行任何操作的样子)	Miner_0
Up（收钩子的样子）	Miner_3,Miner_2,Miner_4,Miner_0,Miner_2

                         

首先我们需要计时器进行实时监测，来进行矿工状态的检测，  同时我还需要重新定义一个变量作为计时器，用于动画时长的控制（有限状态一词的由来），这点非常重要！

动画切换的流程如下图所示：

​

这里的state可以检测是否使用传感器控制钩子的方向

然后通过如图所示的逻辑设计进行矿工图片的切换

​

2.实现钩子随着方向传感器参数发生改变也偏移方向的效果

当钩子处于Idle状态时（就如上文说的用state==0进行判断），才可以摆动，其他状态时都不行，钩子和控制钩子移动的球形精灵要如何移动，逻辑设计如下：

​

3.实现钩子钩取和收回的效果，同时在下滑的过程中检测勾中的物体，进行相应的分数的增加。

钩子钩取和收回的效果还是基于球形精灵（controlMove）进行移动的。然后需要检测钩子是否碰到物体或者到达边界，如果钩子成功收回，要记录分数，并且让勾上来的物体消失。

加分的逻辑设计如图所示

​

根据不同抓到的物体进行加分，成功抓取就使原本的物体隐藏

碰撞边界和物体的逻辑设计，如图所示

​

​

​

思路是根据碰撞到的精灵，通过自定义的回到初始位置模块进行球形精灵（controlMove）的速度的设置，然后在计时器中让钩子一直跟随着这个球形精灵，如图所示

​

检测是否成功收回物体的逻辑设计如图所示

​

思想就是当钩子收回来检测是否有碰撞到精灵（三种情况，勾到了，没勾到，勾到了同时使用了炸弹），然后调用加分模块进行分数的计算，然后重置controlMove球形精灵的坐标。

4.模拟绳索的效果

        新建一个球形精灵作为钩子的两个爪子的中心，然后用画布的划线功能进行绳索的效果，粗略的话，我们可以用红点表示中心,如图所示，划线就是从（x1,y）到（x'+x1-x,y）

精确点就是（x1,y）到（x'+x1-x,y'+y1-y）

​        

那么逻辑设计就是这样的，如图所示

​

3.滑动实现抓取功能的设计：

打算利用一个球形精灵（命名为slipBtn）作为滑动的检测对象，当向下拖动（检测y坐标是否增加），时，就进行钩取，当向上拖动（检测y坐标是否减少）时，就进行丢炸弹（如果有的话）。app inventor坐标系如图所示

​

然后编写如图所示的逻辑设计（在下滑时要确保矿工处于Idle状态，在上滑时要确保矿工处于Up的状态同时要有鞭炮）

​

5.使用鞭炮功能

在滑动功能中，已经包括了当有炸弹时并且矿工处于UP状态（也就是钩子收回）时，才可以使用鞭炮，此时会调用爆炸的特点，同时基于游戏特性，会改变controlMove球形精灵的速度，从而影响钩子的速度，如图所示

​

同时还需要在计时器中让爆炸效果有动画，同时跟着球形精灵（controlMove）移动，同时矿工也会有对应的动画，如图所示

​

这里还定义了一个m_timer作为一个计时器变量，作用是让爆炸的过程持续0.5s，就结束这个过程，进行“UP”状态。同时在爆炸时还需要找到物体，逻辑设计如图所示

​

6.游戏时间控制功能

初始化一个变量，赋值20，然后在计时器（间隔为100ms）中每次减0.1，当时间小于0时，调用游戏结束的模块，停止两个计时器（一个用于动画控制，一个用于控制文本的展示）

​

​

​

​

7.名字，分数统计存储

思路是通过一个二维列表存储这次的分数和用户名，分数就是时间到了以后的最终分数，用户名需要用户通过对话框输入，如图所示

​

​

思路：设计的二维列表，一个元素的第一项用于存储名字，第二项用于存储分数，逻辑设计主要是通过本地数据库访问rank标签，获得已有的排行榜数据，然后存入现在的数据。在这个过程中首先要查找输入的名字是否在原有的列表中出现。如果出现了，就需要比较先前分数和现在分数进行比较，保留较高的分数，如果没有出现就为列表添加元素。

在这个过程中出现了几个问题 (代码编程编多了hh)

1.认为下标是从0开始

​

所以我们的访问我们存储的名字和分数的索引应该是1和2。

2.认为给二维列表，例如（（1,2） （2,1））加数据要加入（3，4），其实是加入（（3,4））

​

如上图，这样才是正确的。

​

如上图，这样是错的。

排行榜界面

界面设计

​

组件	所在组件栏	用途	命名	属性设置
Screen	——	应用于缺省的屏幕，作为放置所需其他组件的容器	Screen_Rank	应用名称： 传感黄金矿工 背景图片： Background2.png 图标： Background2.png 标题： 传感黄金矿工 屏幕方向： 锁定横屏
垂直布局	界面布局	将组件按列排列	垂直布局1	高度：充满 宽度：充满
水平布局1	界面布局	用于让文字居中	水平布局1	水平对齐： 居中 垂直对齐： 居中 宽度：充满
标签	用户界面	作为标题	排行榜	文本： 历史最高得分排行榜
列表显示框	用户界面	用于显示具体的得分排名	列表显示框1	背景颜色：白色 高度：充满 宽度：充满 文本颜色：黑色 字号：22
微数据库	数据存储	用于读取存储排行榜数据	微数据库1

逻辑设计

​

思路呈现

1.实现数据的排序

主要是基于冒泡排序的思想（遍历列表，相邻的元素比较大小，满足条件交换位置，每次得到一个最大值/最小值）进行排序，框架如图所示：

​

涉及到的元素的交换（类似于交换a,b的值 定义一个t变量  a=t,a=b,b=t），难点在于这里是二维列表中元素的交换，我们需要交换两个参数---名字和分数，如下图所示

​

在比较大小时，需要注意的是我们比较的是设计的二维列表是形如((姓名，分数))的像是，我们要的是每个二维列表中元素的第二个参数，当满足前一个用户的分数小于下一个用户的分数的时候，就交换位置，这样就可以实现降序的效果，如下图所示

​

2.实现列表显示框显示存储数据的效果，通过遍历从数据库中获取到的排行榜列表，每一行显示一名用户的名字和分数，逻辑设计如下图所示

​

​

tips：列表显示框的元素字串通过“,”可以实现分割为项的效果

总结

浅浅介绍一下思路，具体细节未展现，可以查看aia文件查看具体的逻辑设计和组件设计或者下载app体验一下效果。

缺点：还原度不是很高，缺少了版本游戏的关卡的设计，同时没有引入商店系统

想法：这个项目尝试了appinventor比较难以实现的功能，事实证明appinventor不太适合做这种贴图多的应用，同时没有在代码中自重生成物体的功能（可能要用类似于对象池的操作嘛），也没有让屏幕重新初始化和在下一个屏幕复用的模块，能难做相似关卡的设计，同时也涉及到了一些数值的运算设计，同时利用appinventor进行调试比较困难。

下载链接（有vip的可以点一点）：①

https://download.csdn.net/download/jiangjiahao123n/88637671

②

通过百度网盘分享的文件：appinventor_goldMaker (2).zip
链接：https://pan.baidu.com/s/1PLsPNJYDupiM6M48LSDAhA?pwd=ifxd 
提取码：ifxd 
--来自百度网盘超级会员V4的分享