HTML5 Canvas开发框架:CasualJS Framework
最新更新:
2011-3-6 增加显示对象碰撞检测DisplayObject.hitTestObject及示例。
CasualJS Framework是根据ActionScript3.0的架构开发的一套适用于HTML5 Canvas的面向对象的开发框架。目的是让你无缝的从AS3开发过渡到HTML5 Canvas开发。虽然Canvas提供了强大的绘图功能,但满足不了高级开发的需要。利用CasualJS的显示对象架构及渲染机制,你可以轻松的在Canvas中操控各种位图、图形、影片剪辑等显示对象,就如同在用AS3开发一样愉快。
框架特性:
* 类似AS3的显示对象列表结构封装
* 基于帧的显示对象渲染机制
* 基于帧的MovieClip动画片段实现
* 内置简单的事件模型
演示和示例:
* 显示对象DisplayObject
* 影片剪辑MovieClip
* 按钮Button
* 绘制图形Graphics
* 显示对象碰撞检测Collision
* 塔防游戏Runner
* 斗地主
API文档:
* API在线文档:http://www.riaidea.com/html5/casualjs/doc/
下载:
* 完整版本:casualjs v0.1 (包括源码、API文档和示例)
* 源码也可到google svn下载:http://code.google.com/p/casualjs/
项目主页:
* http://code.google.com/p/casualjs/
* www.html5idea.com
这是一个开源框架并且刚刚起步,如果你有兴趣参与,请联系我。
二月 12th, 2011 at 16:21
你这个框架和easeljs有什么区别或者联系?
二月 13th, 2011 at 01:04
你好,要说联系的话,都是采用的一种类似as3显示结构的oop方式,这让有过AS3开发经验的朋友更容易上手。但具体实现方式上有很大的差别,比如继承方式,渲染机制,事件模型,以及一些具体的实现比如MovieClip都不一样。
二月 22nd, 2011 at 10:12
看到这个框架很震撼,前面也有这样的想法,但是js太差了,一直在狂补,非常感谢能让我看到这个东西。持续关注并且向你学习。
七月 3rd, 2011 at 23:55
框架很不错,我用得很开心。如果能实现mask效果就更好了,发现好多动画都需要噎。
七月 5th, 2011 at 11:42
恩,会考虑的。
七月 6th, 2011 at 01:52
发现改变显示对象的width、height属性对显示外观无影响噎,成了只是储存数据的属性了,而且不修改的话它们的值一直会是0。
七月 7th, 2011 at 12:05
一个对象width和height并不能全部自动获取,bitmap除外。有些情况下需要手动指定。width和height在获取对象的显示区域,对象重叠碰撞等检测中需要用到。
七月 8th, 2011 at 15:29
原来是这样啊。
对了,用IE9的时候遇到个错误:“SCRIPT438: 对象不支持“getContext”属性或方法 casual-0.1.min.js, 行11 字符556”
我把min版解压后大概是指340多行的下面代码:
var a = document.createElement(“canvas”);
a.width = a.height = 1;
c.__hitTestContext = a.getContext(“2d”);
竟然说a不支持getContext…
七月 11th, 2011 at 14:58
问题可能不在340行的代码那里。你检查下看是那个地方的参数设置或类型有误。
七月 14th, 2011 at 11:29
发现显示对象的不透明度低于0.4左右,鼠标事件就失效了,手形指针也没有了
mc.alpha=0.3;
mc.mouseEnabled=true;
mc.useHandCursor=true;
mc.onMouseEvent=aaaFun;
七月 16th, 2011 at 23:04
这个你可以通过修改DisplayObject.__hitTestTolerance属性来调整。
十月 11th, 2011 at 19:25
好棒啊,能加我QQ么?
十一月 14th, 2011 at 10:41
楼主的框架非常好,以后会考虑使用,希望楼主继续完善程序,另外我想请问楼主您的api文档是用工具生成的还是自己做的?
十一月 16th, 2011 at 17:52
文档可以用javascript toolkit来生成。
十一月 29th, 2011 at 11:35
这个框架确实不错,但是文档内容太少了,有些地方看的很是模糊。希望楼主继续完善完善。呵呵
十一月 30th, 2011 at 18:25
请关注最新的框架quarkjs: http://github.com/quark-dev-team/quarkjs
十二月 16th, 2011 at 18:07
请问这个框架和quarkjs有什么区别。?
十二月 19th, 2011 at 15:12
架构和功能都有所不同,比如quarkjs在移动平台也有较好的性能表现。建议使用quarkjs。
一月 15th, 2012 at 17:24
希望能提供个中文api文档!期待完善,这个非常值得学习^_^