Guide d'utilisation Annuler

Fragments de code des composants personnalisés

Consultez cet article afin de comprendre les fragments de code pour les composants personnalisés.

Vous pouvez ajouter des fragments de code à vos composants personnalisés afin de faciliter l’interaction avec ces derniers. Penchons-nous sur deux exemples présents dans Animate. Les nouveaux fragments de code sont ajoutés sous HTML5 Canvas > Composants.

  1. Fragment de code pour joindre un gestionnaire de clic à un bouton

    // Désactiver plusieurs gestionnaires, car ils peuvent être utilisés dans des scripts d’image
    if(!this.instance_name_here_click_cbk) {
    function instance_name_here_click(evt) {
    // Début du code personnalisé
    console.log("Button clicked");
    // Fin du code personnalisé
    }
    // Associer un gestionnaire d’événements sur le parent avec le filtre
    // comme ID de l'instance de composant
    $("#dom_overlay_container").on("click", "#instance_name_here", instance_name_here_click.bind(this));
    this.instance_name_here_click_cbk = true;
    }
    // Désactiver plusieurs gestionnaires, car ils peuvent être utilisés dans des scripts d’image if(!this.instance_name_here_click_cbk) { function instance_name_here_click(evt) { // Début du code personnalisé console.log("Button clicked"); // Fin du code personnalisé } // Associer un gestionnaire d’événements sur le parent avec le filtre // comme ID de l'instance de composant $("#dom_overlay_container").on("click", "#instance_name_here", instance_name_here_click.bind(this)); this.instance_name_here_click_cbk = true; }
    // Désactiver plusieurs gestionnaires, car ils peuvent être utilisés dans des scripts d’image
    if(!this.instance_name_here_click_cbk) {
     function instance_name_here_click(evt) {
      // Début du code personnalisé
      console.log("Button clicked");
      // Fin du code personnalisé
     }
    
     // Associer un gestionnaire d’événements sur le parent avec le filtre 
     // comme ID de l'instance de composant
    $("#dom_overlay_container").on("click", "#instance_name_here", instance_name_here_click.bind(this));
     this.instance_name_here_click_cbk = true;
    }
    

    Remarque : Le gestionnaire est associé au parent (dom_overlay_container) avec le filtre défini pour l’occurrence du composant. Ceci est important, car l’occurrence du composant peut ne pas être présente lorsque vous tentez d’associer le gestionnaire. Cela garantit le déclenchement correct des gestionnaires d’événements.

    Vous pouvez également fournir des gestionnaires d’événements pour vos composants personnalisés.

  2. Fragment de code permettant d’obtenir la valeur d’un contrôle de saisie

    console.log($("#instance_name_here").val());
    console.log($("#instance_name_here").val());
    console.log($("#instance_name_here").val());
  3. Fragment de code à utiliser lorsque l’occurrence du composant est associée au DOM

    // Écouter l’événement associé, déclenché par l’exécution du composant
    $("#dom_overlay_container").on("attached", function(evt, param) {
    // Vérifier l’ID de l’instance
    if(param && param.id == 'movieClip_1') {
    $("#movieClip_1").text("My Button");
    }
    });
    // Écouter l’événement associé, déclenché par l’exécution du composant $("#dom_overlay_container").on("attached", function(evt, param) { // Vérifier l’ID de l’instance if(param && param.id == 'movieClip_1') { $("#movieClip_1").text("My Button"); } });
    // Écouter l’événement associé, déclenché par l’exécution du composant
    
    $("#dom_overlay_container").on("attached", function(evt, param) {           
    // Vérifier l’ID de l’instance 
    if(param && param.id == 'movieClip_1') {                           
    
    $("#movieClip_1").text("My Button");                          
    }
    });
    

Recevez de l’aide plus rapidement et plus facilement

Nouvel utilisateur ?