[phaser] particles

[phaser] particles updated_at: 2023-12-05 12:06

particles

참조 문서

phaser 3.7x

3.7버젼대에 사용하는 방식이다.
x, y position을 지정하게 되는데 만약 config에서 x, y가 있으면 인자값 x, y로 부터 아래에 지정된 것 만 큼 이동된다.

  • createEmitter removed
this.add.particles(x, y, 'flares', {config});
this.add.particles(100, 100, 'flares', {
  frame: ['red', 'green', 'blue'],
  x: 400,
  y: 100,
  speed: 300,
  gravityY: 400,
  lifespan: 4000,
  scale: 0.4,
  blendMode: 'ADD',
  // deathZone: { type: 'onEnter', source: rectangles }
});
const particles = this.add.particles(0, 0, 'particle', {
  // particle speed - particles do not move
  speed: 0,
  // particle scale: from 1 to zero
  scale: {
    start: 1,
    end: 0
  },
  // particle alpha: from opaque to transparent
  alpha: {
    start: 1,
    end: 0
  },
  // particle frequency: one particle every 100 milliseconds
  frequency: 10,
  // particle lifespan: 1 second
  lifespan: 2000
});

particles.createEmitter();

stop, explode

 const emitter = this.add.particles(200, 100, 'spark1', {
  speed: {
    min: -800,
    max: 800
  },
  angle: {
    min: 0,
    max: 360
  },
  scale: {
    start: 0.3,
    end: 0
  },
  blendMode: 'SCREEN',
  //active: false,
  lifespan: 300,
  gravityY: 800
});

emitter.stop(); // 정의된 emitter를 멈춘다.
this.input.on('pointerdown', (pointer: any) => {
      emitter.setPosition(pointer.x, pointer.y); // 인자값  x, y와 동일
      emitter.explode(50); // 50개의 particle 을 만든다.
      // this.emitter.explode(); 기본만 실행
      // emitter.explode(50, pointer.x, pointer.y); 뒤의 포인트는 config의 x, y 와 동일 기능 
    });

startFollow

emitter가 마우스를 따라 움직이는 프로그램

public create() {
  const player = this.add.sprite(100, 100, "player");

  this.input.on('pointermove', (e: any) => {
    player.x = e.x;
    player.y = e.y;
  });

  // creating a particle system uising 'particle' image
  const emitter = this.add.particles(0, 0, 'particle', {
    // particle speed - particles do not move
    speed: 0,
    // particle scale: from 1 to zero
    scale: {
      start: 1,
      end: 0
    },
    // particle alpha: from opaque to transparent
    alpha: {
      start: 1,
      end: 0
    },
    // particle frequency: one particle every 100 milliseconds
    frequency: 10,
    // particle lifespan: 1 second
    lifespan: 2000
  });
  emitter.startFollow(player);
}

기타 관련 attribute

this.emitter.active = true; // now the emitter is active

// set a emit zone
this.emitter.setEmitZone({
  // zone source is a rectangle with the same size as the platform
  source: new Phaser.Geom.Rectangle(0, 0, platformBounds.width, platformBounds.height),
  // place particles at random positions
  type: 'random',
  // how many particles? 50
  quantity: 50
});


phaser 3.5x

const particles = this.add.particles('particle');
// trail emitter configuration
this.emitter = particles.createEmitter({
  // particle speed - particles do not move
  speed: 0,
  // particle scale: from 1 to zero
  scale: {
    start: 1,
    end: 0
  },
  // particle alpha: from opaque to transparent
  alpha: {
    start: 1,
    end: 0
  },
  // particle frequency: one particle every 100 milliseconds
  frequency: 10,
  // particle lifespan: 1 second
  lifespan: 2000
});

// making the emitter follow the player
this.emitter.startFollow(this.player);
this.particles = this.add.particles('flood');

for (let i = 0; i < this.frames.length; i++) {
  this.createEmitter(this.frames[i]);
}

this.emitters[color] = this.particles.createEmitter({
  frame: color,
  lifespan: 1000,
  speed: {
    min: 300,
    max: 400
  },
  alpha: {
    start: 1,
    end: 0
  },
  scale: {
    start: 0.5,
    end: 0
  },
  rotate: {
    start: 0,
    end: 360,
    ease: 'Power2'
  },
  blendMode: 'ADD',
  on: false
});
평점을 남겨주세요
평점 : 5.0
총 투표수 : 1

질문 및 답글