收尾  加入游戏开始结束页面

我记得游戏中有开始界面也有结束界面的,而且结束界面有赢得还有输的,赢了还会显示步数是多少。
那好吧   我在main.js中加入了一个
//流程控制
function startGame(){ 开始游戏画面,一点就进入游戏场景
}
function enterGame(){
    
    游戏运行画面,这里把StartGame里面的开始图片remove掉然后夹杂游戏场景,加入小猫和circle
}
function gameOver(win){游戏结束有两种(赢和输),所以这里存入一个参数,假定true就是赢,false就是输,加载不同类型的动画。

}
function resetGame(){
  游戏重新开始,就是输了或赢了再点一次就会出现的结果喽。。这里面要清空所有的东西,然后调用StartGame函数}
这个流程控制很清明了,但不是有一点问题是,在游戏里面,我的每一步都是通过mousedown来控制的,而流程控制里重新开始还有start进enter也是要掉哟个mousedown的哦,所以这里设置状态变量
var gameState;
var STATE={START:0,PLAY:1,END:2
};
如果状态是start,那么我点击响应的就只能是startgame的内容喽,等等,这样就去分开了。


另外:
var step;这是干啥的呢?这是在赢了游戏在之后要打印出来的用了多少步。

代码:
//流程控制
function startGame(){gameState=STATE.START;//添加开始游戏界面
    var images=new createjs.Bitmap("res/btn_start.png");stage.addChild(images);images.x=GridOffsetX;images.y=GridOffsetY-100;images.name="start";}
function enterGame(){stage.removeChild(stage.getChildByName("start"));gameState=STATE.PLAY;step=0;createMap();createCat();
}
function gameOver(win){//结束游戏画面
    var pic;var text;if(win){pic="res/victory.png";text=new createjs.Text("你用了"+step+"步哦","20px Arial","#000000");}else{pic="res/failed.png";text=new createjs.Text("zhangyugege比你强哦","20px Arial","#000000");}var image=new createjs.Bitmap(pic);stage.addChild(image);image.y=200;text.x=100;text.y=400;stage.addChild(text);gameState=STATE.END;
}
function resetGame(){//清空当前场景。。。
    stage.removeAllChildren();enterGame();
}

最后对于main.js关于easeljs的一些东西,我罗列一下:

window.οnlοad=function() {stage=new createjs.Stage("myCanvas");createjs.Ticker.timingMode=createjs.Ticker.RAF_SYNCHED;   createjs.Ticker.addEventListener("tick",handleTick);    加入事件监听createjs.Ticker.framerate=30;                         帧率,30就够了,不是很激烈的游戏canvas=document.getElementById ("myCanvas");          这是把场景作用在canvas上面,与html的canvas形成了关系canvas.addEventListener("mousedown",handleMouseDown);  加入鼠标响应事件,它也是随帧率刷新的,相当于一个定时器startGame();                                               把游戏开始第一个调用的函数搞到这里来。
                                        这里面这些都easeljs必写的东西
}function handleMouseDown(event) {                                      这个函数与cocos2d框架的区别的这个可以与touch函数互通,在手机端触摸也是可以的,而cocos2d的mousedown不能做touch的事情。}function handleTick(event){    stage.update(event);  在这里相当于cocos2d框架下的update函数把,让游戏动起来的根本原因就是不断的刷新场景}
byebye

easeljs web开发围住神经小猫咪【三】相关推荐

  1. easeljs web开发围住神经小猫咪【一】

    前两天学的围住神经小猫咪----图片版,在这里总结一下,与之前的神经猫有了很多新的东西. 开始. 一.加载背景,圆圈,小猫咪 这里要用到easeljs,首先建立index.html之后引入easelj ...

  2. easeljs web开发围住神经小猫咪【二】

    前两天状态不好. 接着上次没写完的继续写. 围住神经小猫咪游戏,我确定小猫类,圆圈类,并会加载鼠标点击事件,在点击事件里面,我不但控制圆圈的变化,还控制小猫的移动,就这么简单!哈哈 一.加载圆圈 开始 ...

  3. flask web如何加载html,Flask Web开发学习笔记(三)

    本文主要整理下几个Flask扩展: 0.Flask-Bootstrap:集成Twitter开发的一个开源框架Bootstrap. 1.Flask-Script:为Flask程序添加一个命令行解析器 2 ...

  4. Java Web 开发必须掌握的三个技术:Token、Cookie、Session

    来源:jianshu.com/p/8ef0c5a551d3 整编:Java技术栈(公众号ID:javastack) 在Web应用中,HTTP请求是无状态的.即:用户第一次发起请求,与服务器建立连接并登 ...

  5. 第一百一十五期:Web开发必须掌握的三个技术:Token、Cookie、Session

    在Web应用中,HTTP请求是无状态的.即:用户第一次发起请求,与服务器建立连接并登录成功后,为了避免每次打开一个页面都需要登录一下,就出现了cookie,Session. 作者:一颗小梪梪 在Web ...

  6. Web 开发必须掌握的三个技术:Token、Cookie、Session

    在Web应用中,HTTP请求是无状态的.即:用户第一次发起请求,与服务器建立连接并登录成功后,为了避免每次打开一个页面都需要登录一下,就出现了cookie,Session. Cookie Cookie ...

  7. 201711671116《Web开发技术》第三周作业

    作业/小组任务 2019-534145 提交第三章编程作业 6. xiti6.jsp:   <%@ page contentType="text/html;Charset=GB2312 ...

  8. 转:web开发常用js收藏三

    169.动态修改CSS的另一种方式this.runtimeStyle.cssText = "color:#990000;border:1px solid #cccccc";// 1 ...

  9. 《Python Web开发实战》踩地雷记17/3/25

    写东西一定要随时保存,昨天晚上又被自己给坑了,悲伤脸. 1.vim 设置vim中Tab的缩进 cd ~vim .vimrc 在文件中输入下面的内容并保存 set tabstop=4 set shift ...

最新文章

  1. BERT的通俗理解 预训练模型 微调
  2. 【转载】SAP 计划策略组40、50对比分析
  3. android 十八 蓝牙及Wi-Fi
  4. 分析堆栈溢出原因_我分析了有关堆栈溢出的所有书籍。 这是最受欢迎的。
  5. 启动/关闭数据库、实例及服务
  6. HBase的BulkLoad详解
  7. Oracle PL/SQL 存储过程
  8. Linux期末考试试题长沙理工,Linux期末考试试题8套(含答案)
  9. 2018华为网络技术大赛笔记
  10. Redis入门指南之一(简介)
  11. 目录扫描暴力破解网站管理员密码
  12. AtCoder Beginner Contest 233(A~D)题解
  13. 中国一共有多少神仙!今天让大家开开眼!
  14. 【LeetCode】1056. Confusing Number 解题报告(C++)
  15. 使用C# .net开发微信公众号之设置所属行业
  16. 微信小程序微信授权登录,使用getPhoneNumber()部分手机无法获取动态令牌code(Taro)
  17. 在路上●我的年轻●勇往直前●匆匆十年
  18. 解决报错Connection terminated as request was larger than 10485760
  19. 百度飞桨,让AI落地有解!
  20. GSoC 2022 Blender VSE: 第二、三周总结

热门文章

  1. Win10自动更新之后很卡怎么办?
  2. android 图片编辑工具,图片编辑工具下载
  3. java pdf添加便利贴_电脑win10的便利贴在哪里|win10如何添加便利贴
  4. 怎么升级计算机硬盘,电脑升级之硬盘篇:给电脑升级硬盘也有讲究,否则换了也白搭...
  5. ajax contenttype详解_jQuery ajax contentType processData 笔记
  6. 使用了语音识别后word选中文本的显示阴影从淡蓝色变成黑色
  7. 《加菲猫》和《加菲猫2:双猫记》BD版本电驴(ed2k)
  8. Linux下Stunnel的安装和使用
  9. 反编译apk文件查看源码,反编译apk获取资源
  10. Thinkpad T460p替换机械硬盘、加装内存条详细教程