Events
Pixie emits various events when specific things happen inside the editor. You can use on
method either on specific object to listen only for events for that object or on the canvas to listen for all events.
Canvas Event List
const pixie = new Pixie({
onLoad: () => {
// listen for all events
pixie.on('object:added', e => {
console.log(e.target);
});
}
});
General
- after:render — fired continuously after each frame is rendered
- before:render — fired before each frame is rendered
- canvas:cleared — fired after a call to canvas.clear()
- mouse:over
- mouse:out
- mouse:down — fired when mousedown event occurred on canvas
- mouse:up — fired when mouseup event occurred on canvas
- mouse:move — fired when the mouse is moving over the canvas
- mouse:wheel - fired when using the scroll wheel
- object:added — fired after object has been added
- object:modified — fired after object is modified (moved, scaled, rotated)
- object:moving — fired continuously during object movement
- object:over — fired when mouse is over object (see example below)
- object:out — fired when mouse is moved away from object (see example below)
- object:removed — fired when object has been removed
- object:rotating — fired continuously during object rotating
- object:scaling — fired continuously during object scaling
- object:selected — fired when object is selected
- path:created — fired when (free-drawn) path is created
- before:selection:cleared — fired before object is deselected
- selection:cleared — fired after object is deselected
- selection:created — fired after object is selected
Text related
- text:editing:entered
- text:editing:exited
- text:selection:changed
- text:changed
Object Event List
var pixie = new Pixie({
onLoad: () => {
const objects = pixie.tools.objects.getAll();
objects[0].on('selected', e => {
console.log('object has been selected');
});
}
});
General
- mousedown
- mouseup
- mouseover
- mouseout
- modified
- rotating
- scaling
- moving
- skewing
Text related
- editing:entered
- editing:exited
- selection:changed — cursor selection in iText has changed
- changed
- dblclick
- tripleclick