Läs den här artikeln om du vill veta mer om kodfragment för anpassade komponenter

Du kan lägga till kodfragment till dina anpassade komponenter för att förenkla interaktionen med komponenten. Vi kan ta en titt på två exempel i Animate CC. De nya kodfragmenten läggs till i avsnittet HTML5 Canvas- > Komponenter.

  1. Kodfragment som kopplar en klickhanterare till en knapp

    // Disable multiple handlers, as these may be used in frame scripts
    if(!this.instance_name_here_click_cbk) {
    	function instance_name_here_click(evt) {
    		// Start your custom code
    		console.log("Button clicked");
    		// End your custom code
    	}
    
    	// Attach an event handler on the parent with the filter as the 
    	// Component instance’s id
    $("#dom_overlay_container").on("click", "#instance_name_here", instance_name_here_click.bind(this));
    	this.instance_name_here_click_cbk = true;
    }
    

    Tänk på att hanteraren är kopplad till den överordnade instansen (dom_overlay_container) med filtret angett för komponentinstansen. Detta är viktigt eftersom komponentinstansen kanske inte finns när du försöker koppla hanteraren. Det ser till att händelsehanterare utlöses korrekt.

    Du kan ange händelsehanterare för anpassade komponenter på liknande sätt.

  2. Kodfragment som hämtar värden från indatakontroller

    console.log($("#instance_name_here").val());
  3. Kodfragment som körs när komponentinstansen kopplas till DOM

    // Listen to the attached event, fired by component runtime
    
    $("#dom_overlay_container").on("attached", function(evt, param) {           
    // Check the id of the instance 
    if(param && param.id == 'movieClip_1') {                           
    
    $("#movieClip_1").text("My Button");                          
    }
    });
    

Denna produkt är licensierad enligt en Creative Commons Erkännande-Ickekommersiell-Dela Lika 3.0 Unported-licens  Twitter™- och Facebook-inlägg omfattas inte av villkoren i Creative Commons-licensen.

Juridiska meddelanden   |   Onlinesekretesspolicy