[phaser] particles
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
});