论坛首页 移动开发技术论坛

Cocos2d-x Lua中Sprite精灵类

浏览 1454 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2015-05-11  

精灵类是Sprite,它的类图如下图所示。

Sprite类图

Sprite类直接继承了Node类,具有Node基本特征。此外,我们还可以看到Sprite类的子类有:PhysicsSprite和Skin。PhysicsSprite是物理引擎精灵类,Skin是皮肤精灵类用于骨骼动画。
创建Sprite精灵对象
创建精灵对象有多种方式,其中常用的函数如下:
cc.Sprite:create ()。创建一个精灵对象,纹理[ 纹理(texture),表示物体表面细节的一幅或几幅二维图形,也称纹理贴图,当把纹理按照特定的方式映射到物体表面上的时候能使精灵看上去更加真实。 ]等属性需要在创建后设置。
cc.Sprite:create (filename)。指定图片创建精灵。
cc.Sprite:create (filename, rect)。指定图片和裁剪的矩形区域来创建精灵。
cc.Sprite:createWithTexture (texture)。指定纹理创建精灵。
cc.Sprite:createWithTexture(texture, rect, rotated=false)。指定纹理和裁剪的矩形区域来创建精灵,第三个参数是否旋转纹理,默认不旋转。
cc.Sprite:createWithSpriteFrame(pSpriteFrame)。通过一个精灵帧对象创建另一个精灵对象。
cc.Sprite:createWithSpriteFrameName (spriteFrameName)。通过指定帧缓存中精灵帧名创建精灵对象。
上述create函数我们在前面章节中介绍过,而且create函数比较简单,我们就不再介绍了。
实例:使用纹理对象创建Sprite对象
使用纹理Texture2D对象创建Sprite对象是使用createWithTexture函数实现的。本节我们会通过一个实例介绍纹理对象创建Sprite对象使用,这个实例如下图所示,其中地面上的草是放在背景(如图所示)中的,场景中的两棵树是从图所示的“树”纹理图片中截取出来的,如图所示是树的纹理坐标,注意它的坐标原点在左上角。

创建Sprite对象实例

 

场景背景图片



 

“树”纹理图片

 

“树”纹理坐标



HelloWorldScene.cpp实现的createLayer函数代码如下:

[html] view plaincopy在CODE上查看代码片派生到我的代码片
 
  1. function GameScene:createLayer()  
  2.     local layer = cc.Layer:create()  
  3.     local bg = cc.Sprite:create("background.png")                               ①  
  4.     bg:setPosition(cc.p(size.width/2, size.height/2))                               ②  
  5.     layer:addChild(bg)  
  6.     local tree1 = cc.Sprite:create("tree1.png",cc.rect(604, 38, 302, 295))              ③  
  7.     tree1:setPosition(cc.p(200,230))  
  8.     layer:addChild(tree1,0)  
  9.     local cache = cc.Director:getInstance():getTextureCache():addImage("tree1.png")     ④  
  10.     local tree2 = cc.Sprite:create()                                            ⑤  
  11.     tree2:setTexture(cache)                                                 ⑥  
  12.     tree2:setTextureRect(cc.rect(73, 72,182,270))                               ⑦  
  13.     tree2:setPosition(cc.p(500,200))  
  14.     layer:addChild(tree2,0)  
  15.     return layer  
  16. end  

在上面代码第①行cc.Sprite:create("background.png")通过background.png图片创建精灵,background.png图片如前图所示,第②行代码是设置背景的位置。
第③行代码cc.Sprite:create("tree1.png",cc.rect(604, 38, 302, 295))通过tree1.png图片和矩形裁剪区域创建精灵,矩形裁剪区域为(604, 38, 302, 295),如图所示。
rect类可以创建矩形裁剪区,rect构造函数如下:
cc.rect(x, y, width, height)
其中x,y是UI坐标,坐标原点在左上角,width是裁剪矩形的宽度,height是裁剪矩形的高度。
第④行代码通过纹理缓存TextureCache创建纹理Texture2D对象,通过Director的getTextureCache()函数可以获得TextureCache实例,TextureCache 的addImage("tree1.png")函数可以创建纹理Texture2D对象,其中的tree1.png是纹理图片名。

第⑤行代码创建一个空的Sprite对象,所以还要通过的后面的很多函数设置它的属性,其中第⑥行代码tree2:setTexture(cache)是设置纹理。第⑦行代码tree2:setTextureRect(cc.rect(73, 72,182,270))是设置纹理的裁剪区域。

 

 

更多内容请关注最新Cocos图书《Cocos2d-x实战:Lua卷——Cocos2d-lua开发

本书交流讨论网站:http://www.cocoagame.net

欢迎加入Cocos2d-x技术讨论群:257760386

更多精彩视频课程请关注智捷课堂Cocos课程:http://v.51work6.com

《Cocos2d-x实战 Lua卷》现已上线,各大商店均已开售:

京东:http://item.jd.com/11659697.html

欢迎关注智捷iOS课堂微信公共平台,了解最新技术文章、图书、教程信息

论坛首页 移动开发技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics