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毛钱,谢谢老板,老板大气!

发表评论

以下作品你可能也喜欢:
首页
推荐

包括iOS和安卓(Material Design)2套组件 本作品基于https://ionicframework.com二次创作,原始著作权归原作者所有,二次著作权归本人所有。 本控件库仅支持Axure9以上版本的软件。请低版本的用户下载…

售价:¥ 80.00 销量: 18 1250
QQ截图20191010205659
推荐

软件版本:Axure 8.1(兼容Axure9) 页面数量:56 产品类型:高保真APP 当前版本:V1.1 价格:49.9 作者:Daisy 产品简介:本作品是一款在线职业培训APP原型模板,用户可通过平台购买或免费进行视频课程学习,主要…

售价:¥ 49.90 销量: 129 6659
封面
推荐

作品页数:共53页,主要包含二级菜单、三级菜单、锚点菜单、标签菜单、动态面板、顶部菜单等,以及一些跳转页面和使用介绍的页面。 应用领域:web端需要菜单的页面 作品特色:二级菜单、三级菜单、标签菜单、动态面板菜单、顶部菜单等都是用中继器制作…

售价:¥ 20.00 销量: 158 6612
page-1
推荐

一、作品说明 校园资讯、视频、文章、活动、圈子、投票、服务、专区移动端原型主要为设计、开发、测试、运营人员明确校园资讯活动服务平台的需求,以确保对行业的了解,熟悉具体的业务流程、原型设计、交互方法。 二、应用领域 原型可以应用校园资讯、视频…

售价:¥ 99.00 销量: 2 791
asd
推荐

一个刚完结的项目产品。 移动端社区项目后台管理系统。 本产品更多是以原型为主。部分交互没添加。   关于松林放牛娃元件库产品介绍 松林放牛娃店铺地址:https://www.axureshop.com/shop/3387 店铺包含元件库居多…

售价:¥ 19.90 销量: 45 5858
封面图
推荐

作品名称:电商后台原型、电商商家版后台原型 作品类型:电商后台原型模板 制作软件:Axure8(兼容Axure9) 更新日期:2020年10月09日 作品价格:¥99.00 作        者:Axure产品原型 – 亮亮 @、版本记录 …

售价:¥ 99.00 销量: 119 13815