soccerGame
项目介绍
soccerGame:一个基于egret(白鹭游戏引擎)开发的简单简单简单游戏(wu liao)项目,接着上面实现的卡牌游戏,趁热打铁,再次熟练eui(os: 拖拽操作)操作,同时使用tween来实现soccer的动画。
项目演示
项目功能结构
项目运行
$ egret build xxx(项目名)
$ egret startserver xxx(项目名) -a
项目剖析
简单来说就是用eui搭建好主要的场景页面,然后在用ts去控制之间的交互。
eui组成页面
拖拖拖点点点即可
ts控制交互
主要通过按钮状态控制游戏进度,和足球的随机进球,这里的随机进球很简单,通过Math.random,如果 > 0.5,则上半边win,否则下半边win
注意
下面介绍几个有意思的点。
1.tween
这里使用了tween来做soccer上下滚动的动画,参考对应TweenApi。
2.按钮状态
在通过按钮控制游戏进度的时候,我们用到了这行:
this.btn_start.currentState = "xxx(可选:up pause resume和reset)";
我们在按钮的源码中通过设置source.xxx
来控制按钮不同状态下使用哪张图片。
3.按钮的大小缩放效果(不使用tween)
步骤:
1.找到对应button,在wing中点击上方的源码
2.找到对应源码,加上红框中的代码
接下来说这几行的意思:
width和height为90%,表示其最初大小只有原本的90%;width.down和height.down为100%,表示点击后按钮的大小会变为100%,也就是增大10%;horizontalCenter和verticalCenter为0,则表示其缩放点为正中心
项目源码
代码中写了很多注释,基本都能看懂就不再赘述啦~