• createjs 使用记录


    createjs由几个库组成:
    l,easeljs,这个是核心,包括了显示列表、事件机制;
    2,preloadjs,用于预加载图片等;
    3,tweenjs,用于控制元件的缓动;
    4,soundjs,用于播放声音。

    FPS : 每秒传输帧数

    ## 简单测试
    var canvas = document.getElementById('testCanvas');
    stage = new createjs.Stage("testCanvas");
    stage = new createjs.Stage(canvas);
    
    w = stage.canvas.width;
    h = stage.canvas.height;
    
    spritesheet = new createjs.SpriteSheet({
        'images':['http://cdn.gbtags.com/gblibraryassets/libid108/charactor.png'],
        'frames':{'height':100,'count':10,'width':75}
    });
    
    box = new createjs.Sprite(spritesheet);
    box.play();
    stage.addChild(box);
    createjs.Ticker.setFPS(10);
    createjs.Ticker.addEventListener('tick',tick);
    
    function tick(){
        stage.update();
    }
    
    

    处理文字和画布

    var stage = new createjs.Stage('testcanvas');
    var text = new createjs.Text('我是汉子','30px Microsoft Yahei','red');
    stage.addChild(text);
    text.text = '我是新的文字';
    text.x = 100;
    text.y = 100;
    stage.update();
    
    // beginFill 指定颜色填充 例如  "red", "#FF0000", or "rgba(255,0,0,0.5)")设置为空将导致没有填充。
    // drawRect ( x y w h ) 绘图  和 rect 相似
    // x轴 y轴 宽和高
    var stage = new createjs.Stage('testcanvas');
    var apen = new createjs.Graphics();
    apen.beginFill("red").rect(0, 0, 50, 50);
    var shape = new createjs.Shape(apen);
    
    stage.addChild(shape);
    stage.update(shape);
    

    其他

    createjs.Ticker.timingMode = createjs.Ticker.RAF;//设置循环方法,可以是requestAnimationFrame或者是setTimeout
    createjs.Ticker.setFPS(30);//舞台帧率控制

    物体碰撞伪代码
    1,掉落物的y轴 大于等于 屏幕的高度时,则超出屏幕区域
    2, 掉落物的x轴+掉落物的宽度 大于 托盘的x轴 并且
    掉落物的x轴 小于 托盘的x轴+托盘的宽度 并且
    掉落物的y轴+掉落物的高度 大于等于 托盘的y轴

    参考地址

    JavaScript游戏开发实例指南
    http://blog.csdn.net/lanix516/article/details/47357747
    http://blog.csdn.net/lanix516/article/details/47382401

  • 相关阅读:
    数据库pubs
    当前目录中查找特定类型的文件
    DBHelper,ADO直接操作数据库,扩展DataTable操作数据裤的方法
    行记录次序+等差数列
    面试的通用要求
    zoj_3367Connect them
    hdoj_4198Quick out of the Harbour
    Win32常见异常
    hdoj_1026Ignatius and the Princess I
    移动 II
  • 原文地址:https://www.cnblogs.com/geek12/p/5943233.html
Copyright © 2020-2023  润新知