Recherche…


Syntaxe

  1. on (eventName, handler) - Attache un écouteur d'événement avec un rappel à l'objet.

  2. off (eventName, handler) - Supprime l'écouteur d'événement de l'objet. L'appel de cette fonction sans aucun argument supprimera tous les écouteurs d'événement sur l'objet.

  3. trigger (eventName, optionsopt) : déclenche l'objet événement et les options optionnelles.

Paramètres

Paramètre La description
eventName Le nom de l'événement que vous souhaitez vous abonner, tel que "objet: déplacer"
eventHandler La fonction que vous souhaitez exécuter lorsque cet événement est déclenché
optionsopt Objet Options

Remarques

Fabric prend en charge un certain nombre d'événements pour permettre l'interactivité et l'extensibilité. Pour vous abonner à des événements pour une toile utilisez la on la méthode la manière utilisée dans son jQuery. Et vous souhaitez déclencher manuellement un événement en utilisant la méthode de trigger . Tous les événements sont dans la portée d'une instance de canevas particulière. Visitez le lien pour plus d'informations sur les événements

Tissu js événements sur toile Demo

<canvas id="c" width="400" height="400"></canvas>
var canvas = new fabric.Canvas("c");

canvas.on('mouse:up', function () {
  console.log('Event mouse:up Triggered');
});

canvas.on('mouse:down', function () {
  console.log('Event mouse:down Triggered');
});

canvas.on('after:render', function () {
  console.log('Event after:render Triggered');
});

canvas.on('object:moving', function () {
  console.log('Event object:moving Triggered');
});

canvas.on('object:modified', function () {
  console.log('Event object:modified Triggered');
});

var text = new fabric.Textbox('Hello world', {
  width:250,
  cursorColor :"blue"
});
canvas.add(text);

Le code ci-dessus affiche le fonctionnement de l'API d'événement dans Fabric.js. En appelant on sur l'instance de toile, ou même sur les Fabric.js autres objets, tels que Rect exemple, vous pouvez écouter leurs événements et quand les auditeurs sont déclenchées, le rappel que vous avez passé leur sera déclenché aussi bien.



Modified text is an extract of the original Stack Overflow Documentation
Sous licence CC BY-SA 3.0
Non affilié à Stack Overflow