EaselJS (0.8.2.min 及以上)- 当角色移动时移动 JSON 生成的 Sprite 贴图 XY

Posted 2023-03-25

【中文标题】EaselJS (0.8.2.min 及以上)- 当角色移动时移动 JSON 生成的 Sprite 贴图 XY

【英文标题】：EaselJS (0.8.2.min and up)- Moving JSON generated Sprite map XY when character moves

【发布时间】：2017-03-18 23:03:21

【问题描述】：

easeljs-0.8.2.min 使用了 Tiled JSON 导出的 Tile-map。

我已经使用 Sprite 类生成了瓦片图（现在不推荐使用位图类，这需要一段时间才能弄清楚）。所以它是标准的 32x32 正方形生成正交。

我有一个角色 SpriteSheet，它通过键盘监听事件移动。当我向右移动角色时，我希望生成的地图在角色移动时平移和移动，因此看起来角色正在旅行，您可以看到地图的其余部分不在画布上。

  spriteContainer = new createjs.Container();

  for ( var y = 0; y < layerData.height; y++) 
    for ( var x = 0; x < layerData.width; x++) 
      // create a new Bitmap for each cell
      currentMap = new createjs.Sprite(tilesetSheet);

      // layer data has single dimension array
      var idx = x + y * layerData.width;
      // tilemap data uses 1 as first value, EaselJS uses 0 (sub 1 to load correct tile)
      tileLoad = layerData.data[idx] - 1;
      currentMap.gotoAndStop(tileLoad);

    // orthogonal tile positioning based on X Y order from Tiled
      if(moveX == undefined || moveX == 0)
        moveX= 0;
       else 
      if(moveY == undefined || moveY == 0)
        moveY= 0;
       else 

      currentMap.x = (x * tilewidth - x) + moveX;
      currentMap.y = (y * tileheight) + moveY;

      // Pan X & Y
      // X Minus Pans Right
      // Y Minus Pans Down
      // currentMap.x = currentMap.x + 1;
      // currentMap.y = currentMap.y - 2;

      mapX = currentMap.x;
      mapY = currentMap.y;

      currentMap.setBounds(mapX, mapY, tilewidth, tileheight);

      spriteContainer.addChild(currentMap);

      // Add bitmap to stage
      stage.addChild(currentMap);

    
  

所以我在 EaselJS 中发现了一个名为 SpriteContainer 的类，我想这是我可能需要让它工作的解决方案。所以地图被生成并在右箭头键监听器上按下我现在尝试：

// 设置地图 spriteContainer.x = spriteContainer.x += charWalkSpeed;

当我按下右箭头键时，我的调试器显示 X 坐标确实上升了，但是，地图没有移动并且保持静止。已经坚持了一个月了，我完全被卡住了。到目前为止，我有一个工作示例，但我认为提供的源代码可能就足够了

【问题讨论】：

SpriteContainer 是一个替代 Container，它使用 WebGL 方法来更快地渲染。我会坚持使用雪碧。

你是如何移动精灵的？您是否在按键上增加 x 位置？换台后要更新吗？你能发布那个代码吗？

嗯，是的，Sprite 类在每个正方形中一遍又一遍地迭代。角色添加如下：code HeroXCoordinates = HeroPlay0.x += charWalkSpeed; /code 是的，在新闻稿中执行 gotoAndPlay 的按键上，该角色使用 SpriteSheet 类，因为它具有特定于它所做的动画。我对容器的想法是保持所有这些正方形然后移动 x 或是的。在之前发布的代码中，该位置由：code currentMap.x = currentMap.x + 1; // currentMap.y = currentMap.y - 2; /code

理论上，在按键上，如果我这样做了： currentMap.x = currentMap.x += charWalkSpeed;地图应该移动，但只有一个方格会移动

【参考方案1】：

呵呵，想通了。两个该死的月，终于！

currentMap.parent.x ！所以事情正在平移，我什至喜欢它也移动碰撞对象的事实！遗憾的是，它移动了标题栏，因此创建了一个新函数来告诉标题栏它需要保持静态。还不错。

我的下一个任务是让瓷砖地图在到达瓷砖地图的末端时不平移。所以你看不到画布背景。我的标题是静态的，所以我如何进行平移可能会提示我如何防止平移出血。