zoukankan      html  css  js  c++  java
  • cocos2d-js 显示帧序列图中的一帧

    1.flashCC中打开库,在一个元件中右键->Generate Sprite Sheet...设置如下:

    2.点Export后得到playerWalk.png和playerWalk.plist,复制到当前项目目录的res文件夹下。如图:

    3.修改resource.js

    var res = {
        playerWalk_plist:"res/playerWalk.plist",
        playerWalk_png:"res/playerWalk.png"
    };
    
    var g_resources = [];
    for (var i in res) {
        g_resources.push(res[i]);
    }

    4.修改app.js

    var HelloWorldLayer = cc.Layer.extend({
        sprite:null,
        ctor:function () {
            this._super();
    
            var size = cc.winSize;
            
            cc.spriteFrameCache.addSpriteFrames(res.playerWalk_plist,res.playerWalk_png);
    
            var sp=cc.Sprite.create("#playerWalk0000");//前面加'#'号,再加plist中的帧key名
            sp.setPosition(cc.p(size.width*0.5,size.height*0.5));
            this.addChild(sp);
    
            return true;
        }
    });
    
    var HelloWorldScene = cc.Scene.extend({
        onEnter:function () {
            this._super();
            var layer = new HelloWorldLayer();
            this.addChild(layer);
        }
    });

     5.playerWalk.plist

    <?xml version="1.0" encoding="utf-8"?>
    <!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
    <plist version="1.0">
        <dict>
            <key>frames</key>
            <dict>
                <key>playerWalk0000</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0001</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{46,0},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0002</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{92,0},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0003</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{138,0},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0004</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{184,0},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0005</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{0,67},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0006</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{46,67},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0007</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{92,67},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0008</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{138,67},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0009</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{184,67},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0010</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{0,134},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0011</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{46,134},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0012</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{92,134},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0013</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{138,134},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0014</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{184,134},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
                <key>playerWalk0015</key>
                <dict>
                    <key>aliases</key>
                    <array/>
                    <key>sourceColorRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>spriteOffset</key>
                    <string>{0,0}</string>
                    <key>spriteSize</key>
                    <string>{46,67}</string>
                    <key>spriteSourceSize</key>
                    <string>{46,67}</string>
                    <key>spriteTrimmed</key>
                    <false/>
                    <key>textureRect</key>
                    <string>{{0,0},{46,67}}</string>
                    <key>textureRotated</key>
                    <false/>
                </dict>
            </dict>
            <key>metadata</key>
            <dict>
                <key>format</key>
                <integer>3</integer>
                <key>size</key>
                <string>{256,256}</string>
                <key>target</key>
                <dict>
                    <key>name</key>
                    <string>playerWalk.png</string>
                    <key>textureFileName</key>
                    <string>playerWalk</string>
                    <key>textureFileExtension</key>
                    <string>png</string>
                    <key>premultipliedAlpha</key>
                    <true/>
                </dict>
            </dict>
        </dict>
    </plist>
    View Code
  • 相关阅读:
    Flask 5 模板1
    Flask 4 拓展
    Python学习札记(二十四) 函数式编程5 返回函数
    Python学习札记(二十三) 函数式编程4 sorted
    Docker:Err http://archive.ubuntu.com trusty InRelease & E: Unable to locate package [name] 问题
    解决 docker: Error response from daemon: ... : net/http: TLS handshake timeout.
    Ubuntu 安装Docker
    Flask 3 程序的基本结构2
    Flask 2 程序的基本结构1
    Flask 1 Introductory Chapter
  • 原文地址:https://www.cnblogs.com/kingBook/p/5202102.html
Copyright © 2011-2022 走看看