Axure RP9还原经典碰撞赛车小游戏(简易版)

微信图片-20201231112042

兼容性提醒:此作品只兼容Axure RP 9.0及以上版本,低版本软件无法使用。

Axure RP9还原经典碰撞赛车小游戏(简易版)

首先声明素材都是作者自己用PS画的,灵感来源于小时候玩的碰撞赛车小游戏(ps:是不是叫这个名字我也记不清楚了,暂且就叫这名),起因是前几天在逛Axure的贴吧,无意中看到了用Axure制作飞翔的小鸟的贴,然后进去看了下,核心思路就是利用动态面板的循环和定时去不断的触发事件,然后我就想那我能不能利用这点自己动手来制作一个小游戏,起初是想还原俄罗斯方块的,但是后面失败了,原因是Axure没办法生成元件,所以我就想到了还原碰撞赛车。

开始先梳理一下要实现的功能!这步很重要,不然后面再去调就很麻烦!

1.首先你要有可以控制移动的赛车

2.为了让赛车看起来在不断行驶,我们就要有一条没有尽头的道路

3.光开车上路没有意思,要有路障来限制小车的行进路线

4.小车碰到路障要显示“GAME OVER”

5.小车通过路障拾取油桶获得分数

6.最后再来一个计分器,这样就能知道自己的实力啦!

想好之后就要开始动手制作了!

1.没有尽头的道路

先把我们道路图片添加到页面里,因为我这里画的是一条路,所以要复制成4条路,具体几条随自己心意。

微信图片-20201231112807

一块够吗?一块不够要两块!所以我们复制成4条路就给它组合起来命名“路面1”,另外一个命名“路面2”将它们水平放置在同一水平线,1在2的前面。

接着,我们拖进来一个小矩形,大小颜色都随意,建议小点,然后转换成动态面板命名“背景移动控制器”,然后双击进去动态面板,选择State1,复制一份成State2。然后关闭,点击“背景移动控制器”添加事件,这我就不描述了,看图吧。

微信图片-20201231114256微信图片-20201231114414

微信图片-20201231114613

speed是控制速度的一个全局变量。

2.可以移动的小车

为了方便的定位小车位置,给小车添加两个全局变量“carx”“cary”,然后拖进4个形状,分别用做↑↓←→,然后添加一个矩形转换成动态面板命名“赛车位置获取器”。点击“赛车位置获取器”添加事件。

微信截图-20201231131938

微信截图-20201231132017微信截图-20201231132136

添加好后,可以获取到小车的位置,然后我们分别给4个方向键也添加事件。

控制方向↑

微信截图-20201231132459

控制方向↓

微信截图-20201231132657

控制方向←

微信截图-20201231132811

控制方向→

微信截图-20201231132947

添加好后,这些按钮都只能用鼠标点击触发事件,怎么样按键盘上面的方向键也能控制呢?!

我们回到最外层的页面,它也可以添加交互事件,就像这样!

微信截图-20201231133250微信截图-20201231133340

其余的和这个基本一致。添加好后就能当老司机了!

3.源源不断的路障

好的,有车有路,就差这最后的路障了,这里我们要用到中继器加上动态面板一起来完成!先将路障添加进页面,因为我画的是单个路障,我们的路面是4车道的,所以复制4个,并将它们组合好命名“路障1-1”,然后将它转换成动态面板,复制3次State1,这样一个动态面板里就有4个页面、16个路障、然后我们按顺序每个页面的一个路障换成油桶让小车拾取油桶增加分数。给这个动态面板添加事件,让这可通过的路障缺口随机生成。如图

微信截图-20201231134734

然后我们要判断小车是否碰撞到路障,我们拖入一个热区,将它转换成动态面板命名“路障碰撞器”,复制State1,添加事件。如图

微信截图-20201231135244

微信截图-20201231135408

微信截图-20201231135514微信截图-20201231135558

这就是一组完整的路障,但是一组没难度,我们多复制两组,分别命名“路障1-2”“路障1-3”,将这三组路障放进一个中继器里面,然后组合这个中继器命名“路障”。路障的移动和重置刷新和路面原理一致。如图

微信截图-20201231140056

微信截图-20201231140136

大体上就完成了!关于计分器和路面加速这些我就不描述了,有兴趣的朋友可以下载源文件研究!作者小赚5毛钱,谢谢老板,老板大气!

发表评论

以下作品你可能也喜欢:
阅读备份
推荐

软件版本:Axure 8.1 产品简介:这是一款交友聊天社交APP,专属为你打造的一款纯聊天的社交app,简单而一,只为聊天而存在。 主要功能: 首页:附近对动态,附近对人推选。用户可以自己筛选符合自己期望对聊天对象 社区:来自五湖四海对人…

售价:¥ 49.90 销量: 28 1702
封面
推荐

如何提升画原型的效率?如何快速跳出原型的“枷锁”,从而把更多的时间放在产品思维和产品本身商业模式上? 这是初入职场的产品新人常有的担忧,也是产品老司机一直想解决的问题。 作为资深非著名产品狗,深感那些年踩过的坑,呕心沥血,花费近两个月的时间…

售价:¥ 89.90 销量: 39 2034
----720x360
推荐

作品名称:BI大屏可视化看板系统设计方案 作品类型:产品原型、组件 模板编号:PS0008 主要适用:PC端+大屏 软件版本:Axure 8 文件大小:18.3M 产品介绍: 大屏可视化看板系统设计方案是一套完整的大屏数据可视化展示设计方案…

售价:¥ 110.00 销量: 17 6069
TIM截图20190519224446
推荐

作品依据iView  Weapp绘制,内容包含基础(色彩、字体、按钮、图标)、布局(栅格布局、宫格、面板、列表、卡片)、导航(标签栏、导航按钮、标签页、抽屉、分页、步骤条、通告栏、索引选择器、吸顶容器)、操作反馈(操作面板、轻提示、对话框、…

售价:¥ 30.00 销量: 66 3070
封面
推荐

一、作品基本信息 作品名称:【短视频社交 / 短视频资讯 / 视频直播 / 长视频】通用原型模板 作品类型:移动端原型模板 发布日期:2020-06-25 当前版本:V1.0 适用范围:App应用 Axure版本:Axure 9.0 页面数…

售价:¥ 60.00 销量: 16 1520
2018102813484779
推荐

1.相关介绍 于2020年11月05日更新最新版本。 更新的内容有:将原先空白的功能模块全部补齐,并增加和完善了动态交互效果,调整架构,将原先2个权限完善成现在的3个权限,并加入信息中心、系统管理、综合大屏看板等新的功能模块。 1.1相关原…

售价:¥ 99.99 销量: 146 19111