骑乘平台 Phaser3-解网

问：

在我的 2D 游戏中，我有 1 个角色和一个使用补间左右移动的平台。我在 tiledmapeditor 中创建了这个平台作为对象，它通过提供纹理来生成。当我的角色出现在这个平台上时，我希望它随着平台移动。我该怎么做。

这是我的 MovementPlatform.ts ;

    import {
  ActorProps,
  ICollectable,
  IDieable,
  IMoveable,
} from "@games/common/interfaces";
import { Actor } from "@games/common/objects";

export default class MovementPlatform
  extends Actor
  implements IMoveable, IDieable, ICollectable {
  declare body: Phaser.Physics.Arcade.Body;
  declare startX;
  constructor(props: ActorProps) {
    super(props);
    this.scene.physics.add.existing(this);
    this.body.setAllowGravity(false);
    this.body.immovable = true;
    this.startX = this.x;

    this.move();
  }

  update(...args: any[]): void { }

  die(): void { }

  move(): void {
    this.scene.tweens.add({
      targets: this,
      x: this.startX + 200,
      duration: 1000,
      yoyo: true,
      repeat: -1,
    });
  }

  collect(...props: any[]): void { }
}

这是从 tiledmapeditör 生成 movementPlatform 的地方（这已经正常工作了）

    private spawnMovementPlatform() {
  const movementPlatformTiles = getObjectsByType(
    "movementPlatform",
    this.map
  );

  movementPlatformTiles.forEach((el: Phaser.Tilemaps.Tile, i: number) => {
    const movementplatform = new MovementPlatform({
      key: `movementPlatform-${this.movements.length}`,
      scene: this,
      texture: "movementPlatform",
      x: el.x,
      y: el.y + 200,
    }).setDepth(3);

    this.movements.push(movementplatform);
  });
}

我不知道我是否需要检查我的对撞机并在这里以这种方式进行，或者我是否需要在 movementPaltform.ts 中进行处理。我尝试了很多方法，但没有成功。

this.physics.add.collider(this.player, this.movements, () => {});

javascript typescript 游戏-物理 phaser-framework

document.body.style = 'margin:0;';

var config = {
    type: Phaser.AUTO,
    width: 536,
    height: 183,
    physics: {
        default: 'arcade',
        arcade: {            
            gravity:{ y: 100 },
            debug: true
        }
    },
    scene: {
        create,
        update,
    },
    banner: false
}; 

function create () {
    this.add.text(10,10, 'Left move position, Right using physics')
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});

    let p1 = this.physics.add.existing(this.add.rectangle(200, 20, 10, 10, 0xff0000));
    
     let p2 = this.physics.add.existing(this.add.rectangle(400, 20, 10, 10, 0xff0000));
     let floor1StartX = 200;
     let floor1 = this.physics.add.existing(this.add.rectangle(floor1StartX, 80, 100, 10, 0x0000ff));
     floor1.body.setAllowGravity(false);
     floor1.body.setImmovable(true);     

     let floor2 = this.physics.add.existing(this.add.rectangle(400, 80, 100, 10, 0x0000ff))
     floor2.body.setAllowGravity(false);
     floor2.body.setImmovable(true);
     
     this.floor2 = floor2;

     this.physics.add.collider(p1, floor1);
     this.physics.add.collider(p2, floor2);
     
     this.tweens.add({
      targets: floor1,
      x: floor1StartX + 50,
      duration: 1000,
      yoyo: true,
      repeat: -1,
    });
}

function update(){
    if (this.floor2.x >= 400)
    {
        this.floor2.body.setVelocityX(-50);
    }
    else if (this.floor2.x <= 350)
    {
        this.floor2.body.setVelocityX(50);
    }
}

new Phaser.Game(config);
console.clear();

<script src="//cdn.jsdelivr.net/npm/phaser/dist/phaser.min.js"></script>

骑乘平台 Phaser3

Riding platform Phaser3

评论

评论