如何使用XML文件在HaxeFlixel中创建动画？现有实现遇阻求助

我在HaxeFlixel中添加动画后无法正常运行，希望借助配套XML文件获取动画的宽、高及名称信息。目前不确定loadGraphic方法的最后两个参数是帧尺寸还是整张图像的尺寸，以下是我的纹理图集XML文件和代码，请求技术帮助。

XML文件 #

<?xml version="1.0" encoding="utf-8"?>
<TextureAtlas imagePath="bob.png">
    <!-- Created with Adobe Animate version 21.0.1.37179 -->
    <!-- http://www.adobe.com/products/animate.html -->
    <SubTexture name="Idle0000" x="0" y="0" width="228" height="588"/>
    <SubTexture name="Idle0001" x="228" y="0" width="228" height="588"/>
    <SubTexture name="Idle0002" x="456" y="0" width="228" height="588"/>
    <SubTexture name="Idle0003" x="684" y="0" width="228" height="588"/>
    <SubTexture name="Idle0004" x="912" y="0" width="228" height="588"/>
    <SubTexture name="Idle0005" x="1140" y="0" width="228" height="588"/>
    <SubTexture name="Idle0006" x="1368" y="0" width="228" height="588"/>
    <SubTexture name="Idle0007" x="1596" y="0" width="228" height="588"/>
    <SubTexture name="Idle0008" x="1824" y="0" width="228" height="588"/>
    <SubTexture name="Idle0009" x="2052" y="0" width="228" height="588"/>
    <SubTexture name="Idle0010" x="2280" y="0" width="228" height="588"/>
    <SubTexture name="Idle0011" x="2508" y="0" width="228" height="588"/>
    <SubTexture name="Idle0012" x="2736" y="0" width="228" height="588"/>
    <SubTexture name="Idle0013" x="2964" y="0" width="228" height="588"/>
    <SubTexture name="Idle0014" x="3192" y="0" width="228" height="588"/>
    <SubTexture name="Idle0015" x="3420" y="0" width="228" height="588"/>
    <SubTexture name="Idle0016" x="3648" y="0" width="228" height="588"/>
    <SubTexture name="Idle0017" x="0" y="588" width="228" height="588"/>
    <SubTexture name="Idle0018" x="228" y="588" width="228" height="588"/>
    <SubTexture name="Idle0019" x="0" y="0" width="228" height="588"/>
    <SubTexture name="Walk0000" x="456" y="588" width="250" height="600"/>
    <SubTexture name="Walk0001" x="706" y="588" width="250" height="600"/>
    <SubTexture name="Walk0002" x="956" y="588" width="250" height="600"/>
    <SubTexture name="Walk0003" x="1206" y="588" width="250" height="600"/>
    <SubTexture name="Walk0004" x="1456" y="588" width="250" height="600"/>
    <SubTexture name="Walk0005" x="1706" y="588" width="250" height="600"/>
    <SubTexture name="Walk0006" x="1956" y="588" width="250" height="600"/>
    <SubTexture name="Walk0007" x="2206" y="588" width="250" height="600"/>
    <SubTexture name="Walk0008" x="456" y="588" width="250" height="600"/>
</TextureAtlas>

当前代码 #

loadGraphic(sprite.graphic, true, 228, 588); // 不确定最后两个参数是帧尺寸还是整张图像尺寸

addAnimation("idle", [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18], true);
addAnimation("walk", [0, 1, 2, 3, 4, 5, 6, 7], true);

animation.play("idle");

问题分析与修复方案 #

1. loadGraphic参数说明 #

loadGraphic的最后两个参数是单帧的宽和高，你填的228、588是Idle帧的尺寸，这部分没问题，但你的Walk帧尺寸是250×600，和Idle不一致，直接用固定帧尺寸分割图集会导致帧位置匹配错误。

2. 正确做法：直接解析XML加载纹理图集 #

HaxeFlixel支持直接读取XML纹理图集，无需手动指定帧尺寸，能自动获取所有帧的位置、尺寸和名称。修改后的代码如下：

// 加载XML纹理图集（请替换为你的资源实际路径）
var atlas = FlxAtlas.fromXML("assets/images/bob.png", "assets/images/bob.xml");
loadGraphic(atlas, true);

// 根据XML中的帧名称前缀添加动画
// Idle动画：自动获取所有以Idle开头的帧，设置15帧每秒的播放速度
addAnimation("idle", FlxAtlas.getFrameNames(atlas, "Idle"), true, 1/15);
// Walk动画：自动获取所有以Walk开头的帧，设置12帧每秒的播放速度
addAnimation("walk", FlxAtlas.getFrameNames(atlas, "Walk"), true, 1/12);

animation.play("idle");

3. 原代码的核心问题 #

• 原addAnimation中的帧索引是按固定尺寸分割后的顺序，但你的图集里Idle和Walk帧的位置并非连续的固定尺寸，导致索引对应不上，动画显示错乱。
• 使用XML加载后，通过FlxAtlas.getFrameNames可以直接匹配对应前缀的帧，无需手动编写索引，准确性更高。

内容的提问来源于stack exchange，提问作者funfoxrr