-
Notifications
You must be signed in to change notification settings - Fork 765
Expand file tree
/
Copy pathdraw on texture.js
More file actions
90 lines (66 loc) · 2.01 KB
/
draw on texture.js
File metadata and controls
90 lines (66 loc) · 2.01 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
class Example extends Phaser.Scene
{
preload ()
{
this.load.image('brush', 'assets/sprites/brush3.png');
}
create ()
{
const rt = this.add.renderTexture(64, 64, 128, 128).setInteractive().setDepth(1001);
this.add.graphics().fillStyle(0x000000).lineStyle(1, 0xffffff).fillRect(0, 0, 128, 128).strokeRect(0, 0, 128, 128).setDepth(1000);
this.add.text(136, 8, '<- draw in here\n press SPACE to clear');
const hsv = Phaser.Display.Color.HSVColorWheel();
let i = 0;
this.input.keyboard.on('keydown-SPACE', () =>
{
rt.clear();
});
rt.on('pointerdown', function (pointer)
{
this.draw('brush', pointer.x - 8, pointer.y - 8, 1, hsv[i].color);
});
rt.on('pointermove', function (pointer)
{
if (pointer.isDown)
{
this.draw('brush', pointer.x - 8, pointer.y - 8, 1, hsv[i].color);
i = Phaser.Math.Wrap(i + 1, 0, 360);
}
});
const tt = rt.saveTexture('doodle');
const blocks = this.add.group({ key: 'doodle', repeat: 48, setScale: { x: 0.2, y: 0.1 } });
Phaser.Actions.GridAlign(blocks.getChildren(), {
width: 8,
height: 6,
cellWidth: 128,
cellHeight: 128
});
blocks.children.iterate(function (child)
{
this.tweens.add({
targets: child,
scaleX: 1,
scaleY: 1,
ease: 'Sine.easeInOut',
duration: 400,
delay: i * 50,
repeat: -1,
yoyo: true
});
i++;
if (i % 14 === 0)
{
i = 0;
}
}, this);
}
}
const config = {
type: Phaser.WEBGL,
parent: 'phaser-example',
width: 1024,
height: 768,
backgroundColor: '#2d2d88',
scene: Example
};
const game = new Phaser.Game(config);