码迷，mamicode.com
首页 > Web开发 > 详细

cocos2d-js 显示帧序列图中的一帧

时间：2016-02-19 21:51:27      阅读：848      评论：0      收藏：0      [点我收藏+]

标签：

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

 

cocos2d-js 显示帧序列图中的一帧

标签：

原文地址：http://www.cnblogs.com/kingBook/p/5202102.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！