近期有一个游戏叫围住神经猫,报道说是使用html5技术来做的。 html5的跨平台的优良特性非常不错。对于人手不足,技术不足,选用html5技术实现跨平台的梦想真是不错。

近期在看coco2d-js这个跨平台游戏开发框架。非常不错,写了一个demo程序供大家參考。

/**
* Created by caicai on 14-7-27.
*/
var Ball = cc.Sprite.extend({
velocity:null,
ctor:function () {
this._super(res.Ball_png);
var size = cc.director.getWinSize();
this.x = size.width/2;
this.y = size.height/2; this.velocity = cc.p(10,10);
},
update:function(dt){
this.setPosition(cc.pAdd(this.getPosition(), cc.pMult(this.velocity, dt)));
this.checkHitEdge();
},
checkHitEdge: function() {
var pos = this.getPosition();
var winSize = cc.director.getWinSize(); if (pos.x > winSize.width - this.width || pos.x < this.width) {
this.velocity.x *= -1;
} else if (pos.y > winSize.height - this.height || pos.y < this.height) {
this.velocity.y *= -1;
}
}
}); var GameLayer = cc.Layer.extend({
_ball:null,
_touchBeginAt: null,
ctor:function () {
this._super(); this._ball = new Ball();
this.addChild(this._ball); cc.eventManager.addListener({
event: cc.EventListener.TOUCH_ONE_BY_ONE,
swallowTouches: true,
onTouchBegan: this.onTouchBegan,
onTouchMoved: this.onTouchMoved,
onTouchEnded: this.onTouchEnded
}, this); this.scheduleUpdate();
return true;
}, update:function(dt){
this._ball.update(dt);
}, onTouchBegan:function(touch, event) {
this._touchBeginAt = touch.getLocation();
console.log("begin")
return true;
}, onTouchMoved:function(touch, event) {
}, onTouchEnded:function(touch, event) {
console.log("end")
var endAt = touch.getLocation();
if(this._touchBeginAt == null) return true;
var velocity = cc.pSub(endAt, this._touchBeginAt);
event.getCurrentTarget()._ball.velocity = velocity;
return true;
} }); var BallScene = cc.Scene.extend({
layer:null,
onEnter:function () {
this._super();
this.layer = new GameLayer();
this.addChild(this.layer); this.schedule(this.update, 0); },
update: function(dt){
this.layer.update(dt);
} });

眼下还不完好,还有改进空间。

coco2d-js demo程序之滚动的小球的更多相关文章

  1. 微信小程序-通知滚动小提示

    代码地址如下:http://www.demodashi.com/demo/14044.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  2. js文字展示各种滚动效果

    js文字展示各种滚动效果:http://www.dowebok.com/demo/188/

  3. RCF进程间通信Demo程序

    在上一篇文章RPC通信框架--RCF介绍中,介绍了RCF的优点,本篇文章从头开始演示如何用RCF编写一个跨进程通信的Demo程序. 将RCF编译为静态库 从官网下载到的源码中包含一个RCF的项目,但是 ...

  4. Sequence.js 实现带有视差滚动特效的图片滑块

    Sequence.js 功能齐全,除了能实现之前分享过的现代的图片滑动效果,还可以融合当前非常流行的视差滚动(Parallax Scrolling)效果.让多层背景以不同的速度移动,形成立体的运动效果 ...

  5. Js倒计时程序

    Js倒计时程序 点击下载

  6. js点击左右滚动+默认自动滚动类

    js点击左右滚动+默认自动滚动类 点击下载

  7. js 实现单行文本滚动效果

    js 代码如下: /***************滚动场次开始*****************/ function ScrollText(content, btnPrevious, btnNext, ...

  8. js 实现文字列表滚动效果

    今天要实现抽奖名单在首页滚动展示的效果,就用js写了一个,代码如下: html代码: <style type="text/css"> *{margin:;padding ...

  9. c# winform 点菜宝接口demo程序

    前几天写了一篇关于c#调用 win32API的文章,有同学对点菜宝接口感兴趣,所以就把写的demo程序共享出来,大家一起讨论改进,so放百度云地址: 百度云下载地址

随机推荐

  1. spring boot jar的生成

    1)准备demo 2)打开idea项目结构 3)添加 4)按顺序 6)bulid 7)完成  查看out文件

  2. Spring上传报错413

    SpringMVC上传文件报错413 笔者今天工作时,运维的同事反馈我们上线不久的项目上传文件过大时,总是提示上传失败. 场景重现一下,发现报错信息显示413:Request entity too l ...

  3. vue 父子组件的加载顺序

    一.加载渲染过程 父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount ...

  4. 转:使用 /proc 文件系统来访问 Linux 内核的内容

    使用 /proc 文件系统来访问 Linux 内核的内容 https://www.ibm.com/developerworks/cn/linux/l-proc.html /proc 文件系统并不是 G ...

  5. 小白菜OJ 1122 公牛母牛配(最大二分图匹配模板)

    题意: n只公牛和m只母牛,某些公牛和某些母牛互相喜欢.但最后一只公牛只能和一只母牛建立一对一匹配.要使得最后牛群匹配对数最大. 链接: http://caioj.cn/problem.php?id= ...

  6. sql中Distinct&Count的用法

    Distinct作用:消除重复的数值 1.如: select id from T1 select distinct id from T1 二者的检索效果如下: distinct可以用来修饰多列,如: ...

  7. MyISAM和InnoDB索引实现对比

    MyISAM索引实现 MyISAM引擎使用B+Tree作为索引结构,叶节点的data域存放的是数据记录的地址.如图:  这里设表一共有三列,假设我们以Col1为主键,则上图是一个MyISAM表的主索引 ...

  8. Linux的常用shell命令技巧集

    1.删除0字节文件 find -type f -size 0 -exec rm -rf {} ; 2.查看进程 按内存从大到小排列 ps -e -o "%C : %p : %z : %a&q ...

  9. coraldraw快捷键

        显示导航窗口(Navigator window) [N] 运行 Visual Basic 应用程序的编辑器 [Alt]+[F11]  保存当前的图形 [Ctrl]+[S]  打开编辑文本对话框 ...

  10. 数列分块入门1~9 loj6277~6285

    hzwer的讲解 一 给出一个长为 \(n\) 的数列,以及 \(n\) 个操作,操作涉及区间加法,单点查值. #include <iostream> #include <cstdi ...