TexturePackerGUI结合CoronaSDK生成ImageSheet示例

在OPENGL中加载图片的大小最好是2的N次方,否则就会造成内存的浪费。比如10X10的图片实际上占用了16X16的空间,所以最好的方法是把图片尽可能拼到一起,成为一个符合2的N次方的大图。在移动设备上大图大小不能超过2048X2048。

使用Corona SDK进行开发的时候,我们可以使用一个很棒的工具TexturePackerGUI来完成拼大图的体力活,下面举个例子:

随便涂鸦了上述5个大小不一的图片,我们拖进TexturePackerGUI看一下:

把数据格式选成corona sdk,我们可以看到工具自动以MaxRects算法拼成了一张256X512的图片,按Publish就可以生成这样png图片,以及一段ImageSheet.lua的代码,如下:

local SheetInfo = {}

SheetInfo.sheet =
{
    frames = {
    
        {
            -- img1
            x=136,
            y=86,
            width=28,
            height=28,

            sourceX = 2,
            sourceY = 0,
            sourceWidth = 30,
            sourceHeight = 30
        },
        {
            -- img2
            x=2,
            y=220,
            width=96,
            height=72,

            sourceX = 0,
            sourceY = 8,
            sourceWidth = 100,
            sourceHeight = 100
        },
        {
            -- img3
            x=170,
            y=2,
            width=60,
            height=288,

            sourceX = 0,
            sourceY = 2,
            sourceWidth = 60,
            sourceHeight = 300
        },
        {
            -- img4
            x=2,
            y=2,
            width=166,
            height=82,

            sourceX = 16,
            sourceY = 8,
            sourceWidth = 200,
            sourceHeight = 100
        },
        {
            -- img5
            x=2,
            y=86,
            width=132,
            height=132,

            sourceX = 8,
            sourceY = 10,
            sourceWidth = 150,
            sourceHeight = 150
        },
    },
    
    sheetContentWidth = 256,
    sheetContentHeight = 512
}

SheetInfo.frameIndex =
{

    ["img1"] = 1,
    ["img2"] = 2,
    ["img3"] = 3,
    ["img4"] = 4,
    ["img5"] = 5,
}

function SheetInfo:getSheet()
    return self.sheet;
end

function SheetInfo:getFrameIndex(name)
    return self.frameIndex[name];
end

return SheetInfo

我们使用上述代码是,只需require之后,以如下方式取得小图片即可:

local sheetInfo = require("myExportedImageSheet") -- lua file that Texture packer published

local myImageSheet = graphics.newImageSheet( "ImageSheet.png", sheetInfo:getSheet() ) -- ImageSheet.png is the image Texture packer published

local myImage1 = display.newImage( myImageSheet , sheetInfo:getFrameIndex("image_name1"))
local myImage2 = display.newImage( myImageSheet , sheetInfo:getFrameIndex("image_name2"))

 

posted @ 2015-01-19 14:46  弯弓射月  阅读(1564)  评论(3编辑  收藏  举报