2D游戏开发 - SkyGameEngine2d 纹理打包与缓存_拆包得到2d纹理

---

SkyGameEngine2d - 探索 简洁 易用 ，一款适合游戏入门学习的2d游戏引擎
项目地址 https://gitee.com/xfcode/SkyGameEngine2d

QQ群号：498358732
加群链接：https://jq.qq.com/?_wv=1027&k=5odSA9K
示例游戏视频链接：https://www.bilibili.com/video/av59147631/
更多文章见：SkyGameEngine2d 游戏引擎相关文章目录汇总

---

一、引擎纹理缓存

引擎中的精灵（Sprite）、UI控件等支持图片显示的组件都支持从纹理缓存中图片信息。图片可以是纹理中的某一块区域，也可以是纹理的全部区域。涉及纹理相关的类如下图所示。

• Texture2D 描述纹理数据
• SpriteFrame 对纹理数据进一步细化，确定图片显示的区域以及一些描述如何显示的数据
• SpriteFrameCache 将SpriteFrame缓存起来

注：
SpriteFrame 内部的纹理对象如果已经加载过一次，那么再次引用该对象时不会重新加载，而是从纹理缓存（TextureCache）中获取

缓存纹理有2种方式：

• 直接使用一张图片作为缓存
• 将一些小的图片用打包工具打包成大的纹理，然后使用工具生成的xml数据进行缓存

二、纹理打包

引擎支持TexturePacker工具打包生成的纹理信息。

2.1 下载&&安装TexturePacker

进入官方网站https://www.codeandweb.com/texturepacker下载工具
安装很简单 一路下一步就OK了

2.2 打包纹理

1. 打开软件（选择使用免费版即可）
   
2. 将你需要打包的图片拖入软件中间区域，拖入后效果如图所示。(注意将要打包的图片名字规范命名，方便使用)
   
3. 设置输出文件的格式为xml格式
   
4. 设置输出文件路径
   
5. 生成文件，最终会生成一个xml文件和一个png文件
   

三、在游戏中使用

3.1 将打包后的文件添加到游戏项目

将生成的文件（xml ，png）copy到游戏项目目录的res目录下

3.2 在代码中使用

以重复播放一段角色动画为例，演示如何在代码中使用打包后的纹理，以及纹理缓存。

void TestScene::enterScene()
{
   //{{
   //加载纹理到精灵帧缓存中
   auto cache = GameWorld::getInstance()->getDefultSpriteFrameCache();

   //使用打包纹理加载
   cache->addSpriteFramesWithImagePack(_R("player.xml"), _R("player.png"));

   //使用图片直接加载
   cache->addSpriteFrame(SpriteFrame::createFromPicture(_R("bg.png")), L"bg");
   //}}

   //添加背景
   m_bg = Sprite::create(cache->getSpriteFrame(L"bg"), this);
   auto size = GameWorld::getInstance()->getAppView()->getWinSize();
   m_bg->setPosition(Vector2(size.width / 2, size.height / 2));
   
   //添加玩家精灵
   m_player = Sprite::create(cache->getSpriteFrame(L"player1-2-1"), this);
   m_player->setPosition(300, 200);

   //播放动画
   std::vector<SpriteFrameSharedPtr> frames;
   frames.push_back(cache->getSpriteFrame(L"player1-2-1"));
   frames.push_back(cache->getSpriteFrame(L"player1-2-2"));
   frames.push_back(cache->getSpriteFrame(L"player1-2-3"));
   frames.push_back(cache->getSpriteFrame(L"player1-2-4"));

   auto animation = Animation::create(frames,0.2f,INT_MAX);
   AnimateSharedPtr action = Animate::create(animation);
   m_player->runAction(action);

   return;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

效果图

---

更多文章见：SkyGameEngine2d 游戏引擎相关文章目录汇总

完结