1. 程式人生 > >自定義TexturePacker外掛匯出自己的plist檔案

自定義TexturePacker外掛匯出自己的plist檔案

cocos2dx引擎使用plist檔案, 一種特殊的xml格式作為其atlas紋理的描述檔案. plist遵循蘋果的xml中key-value的設計風格.對於OC來說是合適的, 但xml本身效能低下, 垃圾內容過多, 也讓plist對於高效能遊戲引擎不再適合. 因此, 研究TexturePacker的匯出外掛技術

TexturePacker的自定義外掛目錄位於其安裝目錄的bin\exporters\下, 但有一些外掛屬於內建支援, 例如cocos2dx的plist格式, 因此無法找到對應外掛

本人蔘考shiva3d外掛, 對應匯出介面的DataFormat中的Shiva3D, 快速學會了如何匯出

外掛的基本格式及原理是:

bin\exporters\下的某一目錄下存在的一個名為exporter.xml檔案作為外掛的描述,例如:

<exporter version="1.0">
    <!-- identifier of the exporter -->
    <name>shiva3d</name>
    <!-- display name of the exporter for the combo box -->
    <displayName>Shiva3D</displayName>
    <!-- description of the exporter -->
    <description>Exporter for Shiva3D.</description>
    <!-- exporter version -->
    <version>1.0</version>
    <!-- currently only one file allowed - more to come with update -->
    <files>
        <file>
            <!-- name of this file variable -->
            <name>xml</name>
            <!-- human readable name (for GUI) -->
            <displayName>XML</displayName>
            <!-- file extension for the file -->
            <fileExtension>xml</fileExtension>
            <!-- name of the template file -->
            <template>shiva.xml</template>
        </file>
    </files>
    <!-- target framework supports trimming -->
    <supportsTrimming>false</supportsTrimming>
    <!-- target framework supports rotated sprites -->
    <supportsRotation>true</supportsRotation>
    <!-- rotated sprites direction (cw/ccw) -->
    <rotationDirection>cw</rotationDirection>
    <!-- supports npot sizes -->
    <supportsNPOT>true</supportsNPOT>
    <!-- supports file name stripping (remove .png etc) -->
    <supportsTrimSpriteNames>yes</supportsTrimSpriteNames>
    <!-- supports texure subpath -->
    <supportsTextureSubPath>yes</supportsTextureSubPath>
</exporter>

在Template欄位中, 描述同目錄的匯出檔案格式模板. TexturePacker使用一種叫Grantlee的模板引擎,類似於Python使用的Django模板引擎, 文件參見:Grantlee Documentation. 簡單的文字格式可以參考shiva.xml快速學會

這裡我們使用protobuf的文字格式(極為類似json)匯出plist, 下面是匯出模板

{% for sprite in allSprites %}
Sprite {
    Name: "{{sprite.trimmedName}}"
    FrameX: {{sprite.frameRect.x}}
    FrameY: {{sprite.frameRect.y}}
    FrameWidth: {{sprite.frameRectWithoutRotation.width}}
    FrameHeight: {{sprite.frameRectWithoutRotation.height}}
    OffsetX: {{sprite.cornerOffset.x}}
    OffsetY: {{sprite.cornerOffset.y}}
    OriginalWidth: {{sprite.untrimmedSize.width}}
    OriginalHeight: {{sprite.untrimmedSize.height}}
    {% if sprite.rotated %}Rotated: true {% endif %}
}
{% endfor %}

匯出的結果類似於:

Sprite {
    Name: "car01"
    FrameX: 100
    FrameY: 129
    FrameWidth: 76
    FrameHeight: 47
    OffsetX: 0
    OffsetY: 0
    OriginalWidth: 76
    OriginalHeight: 47
    Rotated: true 
}
Sprite {
    Name: "car02"
    FrameX: 100
    FrameY: 51
    FrameWidth: 76
    FrameHeight: 47
    OffsetX: 0
    OffsetY: 0
    OriginalWidth: 76
    OriginalHeight: 47
    Rotated: true 
}

...

匯出外掛還支援js擴充套件, 具體內容請繼續參考官方文件, 但對於簡單的文字格式, 這種方式已經足夠了

對比plist後, 發現plist中的垃圾資訊極為多, 而且作為spriteframe的name居然帶有副檔名...  因此脫離plist,編寫自己的匯出外掛才是王道!