Javascript Phaser.io atlas动画 我从顶视图在blender中创建了一个汽车动画。并将动画渲染为图片序列

Javascript Phaser.io atlas动画 我从顶视图在blender中创建了一个汽车动画。并将动画渲染为图片序列,javascript,html5-canvas,phaser-framework,pixi.js,Javascript,Html5 Canvas,Phaser Framework,Pixi.js,然后使用鞋盒创建图集,trim alpha选项设置为True,以减小尺寸(cars.png,cars.js) 现在,我在Phaser中播放动画,汽车将固定在一个位置,而不是从一端移动到另一端 如何播放动画,以便Phaser在播放动画时读取sourcesize。 从blender渲染的图片与phaser画布窗口相同。但是,当我在鞋盒中修剪它以移除alpha时,我无法正确地固定汽车 谁能指出我可能遗漏了什么 只要正确加载,相位计将尊重并使用atlas中的微调/源尺寸值。您通常应该为数据文件使用扩

然后使用鞋盒创建图集,trim alpha选项设置为True,以减小尺寸(cars.png,cars.js)

  • 现在,我在Phaser中播放动画,汽车将固定在一个位置,而不是从一端移动到另一端

  • 如何播放动画,以便Phaser在播放动画时读取sourcesize。 从blender渲染的图片与phaser画布窗口相同。但是,当我在鞋盒中修剪它以移除alpha时,我无法正确地固定汽车
  • 谁能指出我可能遗漏了什么

  • 只要正确加载,相位计将尊重并使用atlas中的微调/源尺寸值。您通常应该为数据文件使用扩展名“json”,而不是“js”。另外,您确定它肯定是哈希格式的吗?如果删除该参数,Phaser将在检查源文件时自动为您找出它


    另外,在代码中创建了一个名为“car”的动画,但正在播放一个名为“bus”的动画。不确定是否只是选择性地复制粘贴的代码,但动画关键点需要匹配。

    Phaser将尊重并使用atlas中的trim/sourceSize值,只要已正确加载。您通常应该为数据文件使用扩展名“json”,而不是“js”。另外,您确定它肯定是哈希格式的吗?如果删除该参数,Phaser将在检查源文件时自动为您找出它


    另外,在代码中创建了一个名为“car”的动画,但正在播放一个名为“bus”的动画。不确定您是否只是选择性地复制粘贴的代码,但动画关键点需要匹配。

    非常感谢您为car/bus指出了这个错误,我在堆栈溢出中复制了错误的行。关于js和json,shoe box默认导出了.js,我没有修改它。但如果你说这是必要的,那么我会纠正这一点。散列:是的,因为主体以{frames:{开始,而不是{frames:[.但是@photonstorm,那么我如何在没有路径动画的情况下从一个方向将汽车设置为另一个方向的动画,因为我的下一个场景是等距场景,我需要显示汽车转向。请提出建议。谢谢我需要将渲染的图片序列作为atlas动画播放,所以我是否从鞋盒将trim alpha设置为false??加载时间为Well IncreaseThank,json中缺失的部分被删掉了:'true',显然这不是鞋盒明确提出的。现在它工作得很好。感谢你指出了car/bus的错误,我在堆栈溢出中复制了错误的行。关于js和json,鞋盒默认导出了.js,我没有费心修改它。但是如果你Hash:是的,因为主体以{frames:{开头,而不是{frames:[.但是@photonstorm,那么我如何在没有路径动画的情况下从一个方向将汽车设置为另一个方向的动画,因为我的下一个场景是等距场景,我需要显示汽车转向。请提出建议。谢谢我需要将渲染的图片序列作为atlas动画播放,所以我是否从鞋盒将trim alpha设置为false??加载时间为Well IncreaseThank,json中缺失的部分被删掉了:“true”,显然这不是鞋盒明确提出的。现在它工作得很好
    preload: function () {
    
    this.load.atlas('carImg', 'images/cars.png', 'images/cars.js', Phaser.Loader.TEXTURE_ATLAS_JSON_HASH);
    
    }
    
    create: function () {
    
    this.carSprite = this.add.sprite(300, 300, 'carImg');
    this.carSprite.animations.add('car',Phaser.Animation.generateFrameNames('Car', 0, 200, '.png', 4), 18, true);
    this.carSprite.animations.play('car',18,true);
    }