請使用本文,了解自訂組件的程式碼片段。

您可以在自訂組件中增加程式碼片段,使您與組件的互動加/減速。讓我們在 Animate CC 中看看兩個範例。新的程式碼片段會增加到「HTML5 Canvas -> 組件」區段之下。

  1. 將按下處理常式附加到按鈕的程式碼片段

    // 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;
    }
    

    請注意,處理常式會附加到具有針對組件實體而設定之濾鏡的父輩 (dom_overlay_container)。這之所以重要,是因為當您嘗試附加處理常式時,組件實體可能不是父輩。這可確保事件處理常式正確地啟動。

    同樣地,您可以為您的自訂組件提供事件處理常式。

  2. 從任何輸入控制項取得值的程式碼片段

    console.log($("#instance_name_here").val());
  3. 組件實體附加到 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");                          
    }
    });
    

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策