2013 年 4 月 18 日
客座文章:TexturePacker 简介
今天的文章来自 TexturePacker 的创始人 Andreas Loew。TexturePacker 提供功能齐全的图形用户界面,包括多点触控支持、缩放以及带有所有已用精灵的树形视图。最重要的是,极快的布局算法可以实时显示所有更改。
了解有关 TexturePacker 的更多信息,以及如何使用更少的纹理内存并提高游戏的性能。
我是 Andreas Loew,Code’n’Web 的创始人。我们的目标是通过提供专业的高质量工具来帮助人们创建出色的游戏。
目前,我们有两个与 Corona SDK 一起使用的工具:TexturePacker,它可以让您在不到 20 秒的时间内创建可用于游戏的精灵表,以及 PhysicsEditor,一个物理体编辑器,您可以使用它来自动跟踪游戏对象的轮廓,并在几秒钟内创建碰撞形状。
在这篇文章中,我想帮助您通过使用更少的内存和获得更高的帧率来改善您的游戏。
改进您的游戏
对于游戏,您始终需要图形 - 背景、角色、对象。您自己绘制它们,或者您的美工交付它们 - 通常是 PhotoShop PSD 文件、Flash 动画或已准备好的 .png 文件。
首先想到的是将所有这些图形放在您游戏的文件夹中并加载每一个。
但这是一个非常糟糕的主意!为什么?
减少内存消耗
提高您的游戏性能
应用您刚刚学到的知识
现在您知道为什么精灵表真的可以帮助您改进游戏了。那么,让我们看看如何在游戏中使用它们。
为此,您将使用一些图形和内容缩放进行简单的设置。TexturePacker 将为您动态创建缩放的资源。无需手动调整精灵大小!
资源和项目可以在这里下载:CoronaSDK-TexturePacker-Tutorial.zip。
创建主精灵表
下载 TexturePacker,适用于 MacOS 和 Windows。您可以免费使用它,但有一些限制,也可以购买完整版。您应该使用试用版进行本教程。
安装并同意许可条款后,您应该会看到一个空的 TexturePacker 屏幕。
现在您应该首先添加您的资源:将整个 assets 文件夹拖放到右侧窗格中。TexturePacker 会扫描文件夹的内容并添加所有已知的图像格式。它会在右侧创建一个树形视图,其中包含每个加载的精灵的小图标。
TexturePacker 会监视此文件夹 - 对文件所做的任何更改都会在您重新进入 TexturePacker 后立即在精灵表中更新。
还会添加子文件夹中的精灵 - 它们的精灵名称中会包含文件夹名称 - 例如 “cloud/cloud_01”。
将数据格式设置为 Corona SDK(图像表),然后选择 PNG 作为纹理格式 - 这应该是默认设置。
要设置数据文件,请使用 “…” 按钮打开文件对话框,然后导航到 projects/[email protected]。对于纹理文件,请导航到 projects/[email protected]。
该路径将显示为绝对文件路径,但不用担心 - TexturePacker 会存储所有相对于 .tps 文件(TexturePacker 的保存文件格式)的路径 - 因此,如果您移动项目,只需确保基本文件布局相同即可。
如果您现在按发布,您应该会看到一个由 .plist 和 .lua 文件组成的单个精灵表。
创建分辨率变体
要为较旧的设备添加缩小分辨率,请单击 AutoSD 旁边的齿轮。这将打开一个弹出窗口,如您在下一张屏幕截图中所见
从预设中选择 corona @2x,然后按应用。这会将主扩展名填充为“@2x.” - 这是主精灵表中文件名的一部分,用于创建其他分辨率。
它还在中心视图中添加了一个缩放变体 - 缩放系数为 0.5,扩展名为 “.”。这意味着主表按 0.5 的系数缩小,“@2x.” 被 “.” 替换 - 这将导致 projects/sheet.lua 和 projects/sheet.png。
确保选中强制相同布局 - Corona SDK 需要这样做,因为它只能加载 1 个包含坐标的 .lua 文件。它从此单个文件中派生出缩放变体的坐标,因此要求所有精灵表都具有相同的布局。
最后,按发布以创建精灵表及其低分辨率变体。
将精灵表添加到您的项目
首先,您需要设置 config.lua 以允许使用多个精灵表。我使用 iPhone 分辨率作为基本单位,并添加匹配的图像后缀和缩放系数。
接下来,您需要加载精灵表数据。这是在 main.lua 中使用以下行完成的
现在加载表的纹理并将表信息与其关联
TexturePacker 向 sheetInfo 添加了一些便利函数,允许您轻松地按名称检索精灵 - 例如,如果您想要背景信息,只需使用
结合添加背景图像,它只是
最后 2 行用于放置图像。
您也可以将精灵信息与 newSprite API 一起使用
结论
您现在已经了解了为什么精灵表对您的游戏很重要,因为它们
- 减少内存消耗
- 加快渲染过程
- 保持您的帧率较高
您还了解了如何使用 TexturePacker 轻松创建游戏的资源
- 拖放精灵
- 设置参数
- 按 “发布”
使用精灵表从未如此简单 - 今天就获取 TexturePacker。
Tom Bladko
发布于 18 日 11:50我使用 texture packer 大约一年了,这绝对是最好的 texture packer 🙂
MrB
发布于 18 日 14:56我同意
它是一个很棒的工具!
此外,PhysicsEditor 也非常好
继续努力,Andreas!
Mick
发布于 18 日 21:59希望也会出现一个如何与物理编辑器一起使用的教程。
将两者结合使用是关键…
请提供精灵表和物理形状教程 🙂
Sprite helper 具有很好的动画功能,很像 TP 整体
Mo
发布于 18 日 23:35很棒的教程。我买了这两个软件(纹理和物理),但不幸的是还没有机会使用它。我正在为我的下一个应用程序做准备,这很及时!希望得到一些关于将其用于精灵动画的信息:)
再次感谢!
Mo
Sid
发布于 25 日 17:30它们都是很棒的工具,而且 Level Director (www.retrofitproductions.com/level-director) 现在支持它们,这更棒了,所以我现在几乎无需任何编码就可以创建动画、关卡和场景,非常完美!
Yos
发布于 11 月 30 日 01:36如果有人正在使用 TexturePacker v3.2.1,如果您使用的是 “autosd”,则需要进行这些更改,否则会出现类似“autosd 变体的文件名必须包含占位符”的错误。
Corona SDK lua 文件:“Desktop/Sprite1/sheet{v}.lua”
纹理文件:“Desktop/Sprite1/sheet{v}.png”
Renato
发布于 3 月 8 日 02:50谢谢 Yo。我在这里遇到了这个问题。
Dumitru Vilceanu
发布于 6 月 19 日 05:02没错,当我想要发布使用 TexturePatcher 创建的新精灵集合时,我将:“Desktop/User/sprites{v}” 作为保存 plist 和 png 文件的位置
Vilceanu Doru
发布于 6 月 19 日 05:03没错。当您按发布时,您需要在文件名中使用 “{v}”。不知道为什么。
david
发布于 10 月 7 日 23:33谢谢!很有帮助。