近期有一个游戏叫围住神经猫,报道说是使用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. ubuntu install zabbix

    ubuntu install zabbix reference1 reference2 some ERRORS raise during install process, may it help. z ...

  2. Java垃圾回收之老年代垃圾收集器

    1.Serial Old 收集器(-XX: +UseSerialOldGC, 标记-整理算法) 1.1 单线程收集,进行垃圾收集时,必须暂停所有工作线程 1.2 简单高效,Client模式下默认的老年 ...

  3. upupoo(网页壁纸)自主修改一:农历

    最近在使用一款upupoo的壁纸软件,感觉还可以,主要是对其中html可设置为壁纸方面情有独钟 前几天在它的网页区发现了一个壁纸,感觉挺好: 感觉内容有点少,今天在工作空余时间就在其中加上了农历,同时 ...

  4. hdu3094 A tree game

    题目描述 题解: 树上删边. $SG[u]$^=$SG[son[u]]+1$ 代码: #include<cstdio> #include<cstring> ; template ...

  5. 13. OPTIMIZER_TRACE

    13. OPTIMIZER_TRACE OPTIMIZER_TRACE表提供由跟踪语句的优化程序跟踪功能生成的信息. 要启用跟踪,请使用optimizer_trace系统变量. 有关详细信息,请参阅M ...

  6. 【HIHOCODER 1037】 数字三角形

    链接 问题描述 小Hi和小Ho在经历了螃蟹先生的任务之后被奖励了一次出国旅游的机会,于是他们来到了大洋彼岸的美国.美国人民的生活非常有意思,经常会有形形色色.奇奇怪怪的活动举办,这不,小Hi和小Ho刚 ...

  7. Vue微信自定义分享时安卓系统config:ok,ios系统config:invalid signature签名错误,或者安卓和ios二次分享时均config:ok但是分享无效的解决办法

    简述需求:要求指定页面可以进行微信自定义分享(自定义标题,描述,图片,链接),剩下的页面隐藏所有基础接口.二次分享依然可以正常使用,切换至其他页面也可以正常进行自定义分享. 这两天在做微信自定义分享的 ...

  8. Android GradientDrawable的XML实现

     Android GradientDrawable的XML实现 Android GradientDrawable与附录文章1类似,这次以XML而非Java代码形式实现.比如写好一个shape文件放 ...

  9. HDU2069-Coin Change

    Coin Change 这题题意和UVA674很像,但加了一个限制条件不能超过100个硬币.于是我们可以用d[i][j]来表示硬币数量为i时金钱总数为j时的方法总数,总钱不能超过250. const ...

  10. JS替换回车换行符

    replace(/\r/ig, '<br>').replace(/\n/ig, '<br>')