Animate CC动态加载图片求助：从.NET生成的JSON文件获取图片源

阿华AIGC实验室

2026-5-26

在Animate CC中自动加载JSON里的图片（无需点击触发）

嗨，别担心！我会用最直白的步骤帮你搞定，完全不用怕复杂代码😉

第一步：选对文档类型

先打开Animate CC，新建一个HTML5 Canvas类型的文档——这个类型用简单的JavaScript，比ActionScript容易上手，还能兼容所有常见图片格式（JPG/PNG/GIF都没问题）。

第二步：给第一帧加代码（自动触发加载）

因为你不需要点击触发，我们直接把代码放在开场动画的第一帧上：

点击时间轴上的第一帧，按下F9打开「动作」面板
把下面的代码粘贴进去，我已经标好需要你修改的地方：

// 👇 这里替换成你的.NET生成的JSON文件路径，比如和导出文件放一起就写"images_list.json"
const jsonUrl = "你的JSON文件实际路径";

// 加载JSON文件
fetch(jsonUrl)
  .then(response => response.json())
  .then(data => {
    // 遍历JSON里的图片列表（假设JSON是{"images": ["图1路径", "图2路径"...]}的格式）
    data.images.forEach((imgSrc, index) => {
      // 创建图片对象
      const img = new Image();
      img.src = imgSrc;
      // 图片加载完成后，放到舞台上
      img.onload = () => {
        // 👇 这里可以改图片位置：比如第index张图，x坐标从50开始，每张间隔200，y固定100
        const bitmap = new createjs.Bitmap(img);
        bitmap.x = 50 + index * 200;
        bitmap.y = 100;
        // 把图片添加到舞台
        stage.addChild(bitmap);
        // 刷新舞台显示
        stage.update();
      };
    });
  })
  .catch(error => {
    console.error("加载出错啦：", error);
  });

你需要手动调整的3个地方：

jsonUrl：改成你的.NET生成的JSON文件的真实路径，比如JSON和Animate导出的HTML文件在同一个文件夹，直接写文件名就行（比如"image_data.json"）
JSON格式匹配：确保你的.NET生成的JSON是这种结构：
```
{
  "images": [
    "https://你的服务器地址/图1.jpg",
    "本地文件夹/图2.png",
    "图3.gif"
  ]
}
```
如果你的JSON直接是图片路径数组（比如["图1.jpg", "图2.png"]），把代码里的data.images.forEach改成data.forEach就行。
图片位置：如果不想用我写的“每张横向排列”，可以直接把bitmap.x = 50 + index * 200改成固定值，比如bitmap.x = 100，bitmap.y = 100，这样所有图片都放在同一个位置。