精靈就是cocos是螢屏上移動的物件，它能被控制，比如我們HelloWorld場景的這個圖片就是精靈(Sprite)
怎么才算精靈？你能控制它的，就是一個精靈，否則就只是一個節點(Node)
準確的說，精靈是一個能通過改變自身的屬性：角度，位置，縮放，顏色等，變成可控制影片的 2D 影像
精靈很容易被創建，它有一些可以被配置的屬性，比如：位置，旋轉角度，縮放比例，透明度，顏色，等等
auto mySprite = Sprite::create("xxxxxx.png");
// 改變位置
mySprite->setPosition(Vec2(500, 0));
// 設定旋轉角度
mySprite->setRotation(40);
// 設定縮放比例
mySprite->setScale(2.0);
// 設定錨點
mySprite->setAnchorPoint(Vec2(0, 0));
創建精靈
我們的HelloWorld直接使用了一張影像來創建精（PNG, JPEG, TIFF, WebP，都可以），但也有一些其它的方式，比如使用圖集和精靈快取創建
圖片創建
回一下HelloWorld場景里的代碼
auto sprite = Sprite::create("sinnosuke.png");
精靈會使用整張影像，影像是多少的解析度，創建出來的精靈就是多少的解析度
但如果你想要的是一個 尺寸只有原始影像一部分的精靈，你可以在創建的時候指定一個矩形
指定矩形
指定矩形需要四個值，初始 x 坐標，初始 y 坐標，矩形寬，高
auto sprite = Sprite::create("sinnosuke.png", Rect(0, 0, 50, 50));
//我的圖片解析度是200*200
效果就是新之助會一只眼盯著你
矩形的初始坐標要從圖形的左上角開始算，即左上角的坐標是 (0, 0)
如果你把矩形的寬高指定為影像的寬高，矩形的初始坐標指定為 (0, 0)，那和默認設定是一樣的（這里圖片的解析度就是200x200）
auto sprite = Sprite::create("sinnosuke.png");
//效果相同
auto sprite = Sprite::create("sinnosuke.png", Rect(0,0,200,200));
圖集創建
圖集(Sprite Sheet)是通過專門的工具將多張圖片合并成一張大圖，并通過 plist 等格式的檔案索引的資源，使用圖集比使用多個獨立影像占用的磁盤空間更少，還會有更好的性能，這種方式已經是游戲行業中提高游戲性能的標準方法之一
下圖就是一個圖集
在使用圖集時，首先要將其全部加載到名叫 SpriteFrameCache 的快取中
SpriteFrameCache 是一個全域的快取類，快取了添加到其中的 SpriteFrame 物件，提高了精靈的訪問速度，SpriteFrame 只加載一次，后續一直保存在 SpriteFrameCache 中
加載圖集
獲取到 SpriteFrameCache 的實體，把圖集添加到實體中
auto spritecache = SpriteFrameCache::getInstance();
spritecache->addSpriteFramesWithFile("sprites.plist");
現在我們就能利用這個物件創建精靈了
精靈快取
Cocos2d-x 為了提高精靈的訪問速度，提供了一個精靈的快取機制，
我們可以創建一個精靈并把精靈放到精靈的快取物件SpriteFrameCache中：
auto mysprite = Sprite::createWithSpriteFrameName("mysprite.png");
相對的，我們也可以從精靈的快取物件 SpriteFrameCache 訪問一個精靈
訪問方法是先從快取物件中獲取對應的 SpriteFrame，然后從 SpriteFrame創建精靈，方法：
auto newspriteFrame =
SpriteFrameCache::getInstance()->getSpriteFrameByName("Blue_Front1.png");
auto newSprite =
Sprite::createWithSpriteFrame(newspriteFrame);
控制精靈
在創建完精靈后，你可以開始修改精靈的屬性去控制它了
錨點
所有的節點(Node)物件都有錨點值，Sprite 是 Node 的子類，自然也具有錨點
錨點是節點物件在計算坐標位置時的一個基準點，理解不了沒關系，直接看圖：
以我們剛才的展示的精靈為例，設定錨點(0,0)：
mySprite->setAnchorPoint(Vec2(0, 0));
精靈的左下角(0, 0)就變為了計算坐標的基準點，setAnchorPoint就以這個基準點來設定精靈位置
再看看其它的錨點效果（紅點表示錨點的位置）
錨點對于確定節點物件的位置非常有用的
默認情況下，所有的節點物件錨點是 (0.5, 0.5)
位置
精靈的位置受錨點影響，當我們想設定一個精靈的位置時，主要使用 setPosition() 方法，只有想改變精靈與基準坐標點的相對位置時，才考慮使用 setAnchorPoint() 設定錨點
// position a sprite to a specific position of x = 100, y = 200.
mySprite->setPosition(Vec2(100, 200));
旋轉
通過setRotation() 方法，設定一個角度值可控制精靈的旋轉，正值精靈順時針旋轉，負值精靈逆時針旋轉，默認位置的角度值是0.0
mySprite->setRotation(20.0f);
mySprite->setRotation(-20.0f);
mySprite->setRotation(60.0f);
mySprite->setRotation(-60.0f);
結果如下
縮放
通過setScale()方法控制精靈的縮放，可以控制精靈水平縮放，垂直縮放，也可以整體縮放，默認水平和豎直的縮放值都是1.0
mySprite->setScale(2.0);
mySprite->setScaleX(2.0);
mySprite->setScaleY(2.0);
傾斜
通過 setSkewX() 控制精靈的傾斜度，可以控制精靈水平傾斜，豎直傾斜，或者水平豎直同時傾斜，默認水平和豎直的傾斜值都是0.0
mySprite->setSkewX(20.0f);
mySprite->setSkewY(20.0f);
顏色
通過 setColor() 控制精靈的顏色，將一個 RGB 值設定到 Color3B 物件，呼叫精靈的 setColor() ，就能完成精靈顏色的設定，RGB 是三個從 0-255 的值，三個值分別代表紅綠藍的顏色深度，數值越大，顏色越深
如果你不想自己指定 RGB 的三個值，也可以使用 Cocos2d-x 提供的預定義顏色，比如: Color3B::White，Color3B::Red，
mySprite->setColor(Color3B::WHITE);
//等效于
mySprite->setColor(Color3B(255, 255, 255));
透明度
精靈的透明度可以通過 setOpacity() 傳入一個特定的值來設定，這個值的范圍是0-255，數值越大透明度越低，255 代表完全不透明，0 代表完全透明
mySprite->setOpacity(30);
多邊形精靈
多邊形精靈(Polygon Sprite) 也是精靈
普通精靈在繪圖處理中被分為了兩個三角形，多邊形精靈則是被分為了一系列三角形
為什么要使用多邊形精靈
因為可以提高性能，真的，深入分析這個是如何提高性能的，會需要很多和像素填充率有關的技術術語，所以我們這里先不深入，只要知道能提高性能就行了
注意上圖
- 左側，精靈繪制時被處理成一個有兩個三角形組成的矩形
- 右側，精靈被處理成一系列小的三角形
右側多邊形精靈需要繪制的像素數量比左側精靈需要的像素數量更小
AutoPolygon
AutoPolygon是一個工具類，它可以在程式運行時，通過跟蹤關鍵點和三角測量，將一個矩形影像劃分成一系列小三角形塊
首先將影像資源傳入 AutoPolygon 進行處理，然后我們使用它生成的物件進行精靈的創建就能得到多邊形精靈
auto pinfo = AutoPolygon::generatePolygon("xxxxxx.png");
auto sprite = Sprite::create(pinfo);
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/14549.html
標籤：其他
上一篇：Cocos2d-x入門之旅[1]HelloWorld
下一篇：unity 之 背包系統