【Cocos2d-html5游戏引擎学习笔记(5)】Sprite精灵渲染

精灵类是任何一款游戏引擎的核心，你所见到的图片画面基本都是由它展现出来的，比如我们的游戏背景，主角等等，所以学好Sprite精灵类对游戏的画面体验有着很重要的影响。我们就先介绍他的创建方式，一般来说有以下5种：

第一种：

cc.Sprite.create(fileName)通过一张图片生成精灵对象

参数：图片的名称。

var sprite1 = cc.Sprite.create("test.png"); //这里图片名称最好写在resource.js里面
sprite1.setPosition(cc.p(10,10));
this.addChild(sprite1);

第二种：

cc.Sprite.create(fileName, rect) 通过一张图片进行给定矩形裁剪生成精灵对象

参数1：图片名称

参数2：矩形的区域

var sprite2 = cc.Sprite.create("test.png", cc.rect(0, 0, 50, 50));
sprite2.setPosition(cc.p(10,10));
this.addChild(sprite2);

第三种：

cc.Sprite.createWithSpriteFrame(spriteFrame)通过缓存中的帧生成精灵对象

参数：帧的名称

var spriteFrameCache = cc.SpriteFrameCache.getInstance(); //使用精灵帧缓存，方便后面多次使用

var frameCache = spriteFrameCache.addSpriteFrames(s_plist, s_png); //第一个参数plist文件，第二个参数plist对应的png图片

var sprite3 = cc.Sprite.createWithSpriteFrame(spriteFrameCache.getSpriteFrame("test.png"));//plist里面对于的图片名称
sprite1.setPosition(cc.p(10,10));
this.addChild(sprite3);

第四种：

cc.Sprite.createWithSpriteFrameName(spriteFrameName)另外一种通过缓存中的帧生成精灵对象

参数：帧的名称

var sprite4 = cc.Sprite.createWithSpriteFrameName("test1.png");
sprite4.setPosition(cc.p(10,10));
this.addChild(sprite4);

第五种：

cc.Sprite.createWithTexture(texture, rect) 通过Texture2D，并进行裁剪生成精灵对象

参数1：Texture图片

参数2：矩形的区域

var batch = cc.SpriteBatchNode.create(s_mybach); 
this.addChild(batch);

var sprite5 = cc.Sprite.createWithTexture(batch.getTexture(), cc.rect(0, 121, 85, 121)); //需要显示的区域
var sprite6 = cc.Sprite.createWithTexture(batch.getTexture(), cc.rect(85, 121, 85, 121));
sprite5.setPosition(cc.p(10,10));
this.addChild(sprite5);

精灵类也有很多自己的属性，比如设置旋转角度，设置缩放，设置透明度等等，这些可以在官方的api中查看到，我就列举几个我比较常用的方法。

setRotation(rotation)设置旋转角度

setScale(scale)设置缩放值

setVisible(visible)设置是否可见

setOpacity(var)设置透明度

还有一些父类在精灵中常用的

setTag(var)设置标记

setAnchorPoint(point)设置锚点

getBoundingBox()  获取rect大小

想自己新建一个属于自己的Sprite也很简单

var MySprite = cc.Sprite.extend({  //继承cc.Sprite

    ctor: function (fileName) {
        this._super();
        this.initWithFile(fileName); //初始化图片
    },
    
    xxx:function(){ //自己定义自己想要的方法
    
    }
});

以上就是精灵类的介绍了，吃饭去咯~