Orca原创，转贴请标明链接Orca的移动开发轨迹。
目前整个学习笔记的版本是cocos2d-x 2.1.0beta3。
一、sprite的创建
1.基本的创建方法
先打开HelloWorldScene.cpp，重写一遍背景的加入。
// 进行测试，首先是加入普通sprite
// 计算整个屏幕的size
CCDirector * _pdirector = CCDirector::sharedDirector();
CCSize winSize = _pdirector->getVisibleSize();
CCSprite *bg = CCSprite::create("helloworld.png");
bg->setPosition(ccp(winSize.width / 2, winSize.height / 2));
this->addChild(bg);
这是最基本的加入sprite的方式。先用文件生成指向sprite对象的指针，然后设置这个对象的属性。设置完了以后再加入当前的layer。
sprite即精灵，这是我们整个游戏当中的基础对象。
对于sprite的属性，我们可以查阅官方文档。
可见它继承于Node，TextureProtocol，RGBAProtocol
可以先在sprite.h里面看一下sprite类的声明。
先看有关创建部分
/** Creates an sprite with an image filename.
The rect used will be the size of the image.
The offset will be (0,0).
*/
static CCSprite* create(const char *pszFileName);
/** Creates an sprite with an image filename and a rect.
The offset will be (0,0).
*/
static CCSprite* create(const char *pszFileName, const CCRect& rect);
其实我们可以发现，以前有许多创建sprite的接口，但是都已经被标注为This interface will be deprecated sooner or later.
也就是说，现在官方推荐使用的创建sprite的方式就只剩下两个重载函数。
1.static CCSprite* create(const char *pszFileName);
2.static CCSprite* create(const char *pszFileName, const CCRect& rect);
第一个方式是直接从文件创建，第二个方式是从文件创建指定范围大小的精灵。
CCRect这是指定一个图像范围的类，这里先不管，先看create里面支持的文件到底有哪些。
仔细看源代码可以发现，create里面使用了initWithFile方法，再到这个方法去看实际调用的函数：
CCTexture2D *pTexture = CCTextureCache::sharedTextureCache()->addImage(pszFilename);
是的，是从texturecache对象里面调用了addImage。
那么去看看addImage方法的说明。
/** Returns a Texture2D object given an file image
* If the file image was not previously loaded, it will create a new CCTexture2D
* object and it will return it. It will use the filename as a key.
* Otherwise it will return a reference of a previously loaded image.
* Supported image extensions: .png, .bmp, .tiff, .jpeg, .pvr, .gif
*/
也就是说支持的文件格式有png、bmp、tiff、jpeg、pvr、gif。
好了，基本理解是这样的，接下来我们再试验一下create的另外一个重载函数。
static CCSprite* create(const char *pszFileName, const CCRect& rect);
这次使用的代码如下：
CCDirector *_director = CCDirector::sharedDirector();
CCSize winSize = _director->getVisibleSize();
// 设定生成图片的范围，这里是设置为从原图480x320的中点开始向右下，占据整个图片1/4的面积
CCRect testret = CCRectMake(240.0f, 160.0f, 240.0f, 160.0f);
CCSprite *bg = CCSprite::create("helloworld.png", testret);
// 设置锚点的位置为(100%, 0%);
bg->setAnchorPoint(ccp(1.0f, 0));
bg->setPosition(ccp(winSize.width, 0));
this->addChild(bg);
那么根据上面的代码得出的结果是
这里的说明基本在代码里面注释了。要注意的是，设定ccrect范围的时候，是从左上角往下面数的，这点和坐标系从左下数不同。
还值得一提的是有关锚点。锚点指的是整个sprite里面的重心点的位置，在sprite进行放置、旋转、缩放时，均以锚点为sprite的中心点。
在目前的cocos2dx当中，默认的锚点是(0.5, 0.5)，也就是在图片的正中心。我们这里改到了右下角(1.0, 0)。
关于anchor这里不再赘述，可以搜索有关anchor的知识。
2.使用压缩图片的创建
由于opengles的图片存取策略（详细的请自己查阅，这里不做解释了），所以要使内存占用最小，最好使用一些图片打包工具来进行图片打包。
我们这里就使用texturepacker来处理吧。
texturepacker的下载地址，当然这个是要收费的：texturepacker
首先随便拿几个文件放到texturepacker里面
Imageformat我们一般选择RGBA4444，这种格式可以处理透明，失真也比较少。
算法选择FloydSteinberg+Alpha。
此外需要提醒的是，为了使失真尽可能的少，图片最好少使用大范围高梯度的渐变，如果非要使用的话请多加一些细条纹纹理。理由涉及到压缩算法，我也不是很清楚，有兴趣的可以去拜谷歌娘。
// 获取framecache单例
CCSpriteFrameCache *_spriteFrameCache = CCSpriteFrameCache::sharedSpriteFrameCache();
// 设置基本纹理模式为RGBA4444
CCTexture2D::setDefaultAlphaPixelFormat(kTexture2DPixelFormat_RGBA4444);
// 在cache里面添加
_spriteFrameCache->addSpriteFramesWithFile("test.plist");
// 从plist当中创建sprite
CCSprite *testP1 = CCSprite::createWithSpriteFrameName("b1.png");
//
testP1->setPosition(ccp(100, 200));
bg->addChild(testP1);
效果图如下
再补充一条
使用batchnode添加sprite
// 建立一个batchnode，加载纹理
CCSpriteBatchNode *spriteBatch = CCSpriteBatchNode::create("test.png", 20);
this->addChild(spriteBatch);
CCSprite *testP1 = CCSprite::createWithSpriteFrameName("b1.png");
testP1->setPosition(ccp(100, 200));
spriteBatch->addChild(testP1);
代码就是这样。
关于CCSpriteBatchNode，需要说明的是，它可以在同时渲染多个精灵，只要在同一个batchnode里面的精灵都可以渲染出来，这样对游戏的帧率，内存的优化是非常有好处的。
这里使用的是SpriteBatchNode和SpriteFrameCache配合使用的方法。把Batchnode结点理解为一个layer容器就可以理解上面的写法了。
二、基本属性的设置
这里我们已经设定过了anchorpoint和position，接下来要设定的是sprite的其他常用的属性：
1.color
// 创建一个sprite
CCSprite *pea1 = CCSprite::create("Images/Pea.png");
pea1->setPosition(ccp(100, 40));
bg->addChild(pea1);
// 再来一个
CCSprite *pea2 = CCSprite::create("Images/Pea.png");
bg->addChild(pea2);
// 位置在pea1的大小右侧再加10
pea2->setPosition(ccp(pea1->getPositionX() + pea1->getContentSize().width + 10, pea1->getPositionY()));
// 设置颜色
pea2->setColor(ccc3(255, 0, 255));
// 再来一个
CCSprite *pea3 = CCSprite::create("Images/Pea.png");
bg->addChild(pea3);
// 位置在pea2的大小右侧再加10
pea3->setPosition(ccp(pea2->getPositionX() + pea2->getContentSize().width + 10, pea2->getPositionY()));
// 设置颜色
pea3->setColor(ccBLUE);
显示效果
大致就是这样，也没有别的需要解释的了。
2.scale
继续跟着上面的代码来。
// 设置缩放 pea1->setScale(0.2f); pea2->setAnchorPoint(ccp(0, 1.0f)); pea2->setScaleX(0.5f); pea3->setScaleY(1.2f);
p2的anchorpoint位置发生了改变，因此缩放的重心也就发生了改变，所以变成了这样。
3.rotate
rotate就是设定旋转角度。这个也和anchorpoint的位置有关
// 设置rotate
pea1->setRotation(0.5f);
pea2->setRotation(30.0f);
setRotation的参数是角度，这个也没什么好说的。
4.透明度
// 设置透明度 pea1->setOpacity(40); pea2->setOpacity(80); pea3->setOpacity(255);
- 关于这条可以看下文档：If the the texture has premultiplied alpha then, the R, G and B channels will be modified. Values goes from 0 to 255, where 255 means fully opaque.所以说取值范围是0～255。
效果
5.设置内容
// 设置内容
CCTextureCache *_texturecache = CCTextureCache::sharedTextureCache();
pea1->setTexture(_texturecache->addImage("Images/grossinis_sister1.png"));
这里要注意的有两点：
1）texture要使用的话必须先加入CCTextureCache类的单例当中。
2）如果填充texture的话，被填充的texture会自动适应原有sprite的size。
其实还有不少属性，等用到的时候再说吧。
下一篇正式进入testcpp各示例的说明。