Consejo rápido Cómo comunicarse entre Flash y JavaScript / Código

s y

, cual tiene <em>carné de identidad</em> Propiedades para que podamos acceder a ellas desde el SWF..</li> </ul> <p>Su HTML debe aparecer como se muestra a continuación:</p> <img src="//accentsconagua.com/img/images_27_3/quick-tip-how-to-communicate-between-flash-and-javascript_3.jpg"> <p>Cuando se haya reemplazado el código, cargue el archivo en su servidor web para que podamos comenzar con ActionScript..</p> <hr> <h2> Paso 4: configurar una clase de documento</h2> <p>Cree una clase de documento para su archivo Flash; llámalo Main.as. Si no está familiarizado con las clases de documentos, lea este Consejo rápido.</p> <pre> paquete import flash.display.MovieClip; clase pública principal extiende MovieClip función pública principal () </pre> <hr> <h2> Paso 5: Llamar a funciones de JavaScript desde Flash</h2> <p>Lo primero que haremos con ExternalInterface es llamar a una función de JavaScript que cambiará el color de fondo de nuestra página web. Entonces, adjunte un detector de eventos a nuestro componente ColorPicker. Cuando el color cambie, enviará el valor hexadecimal a una función javascript llamada receiveColor ():</p> <pre> package import fl.events.ColorPickerEvent; importar flash.display.MovieClip; importar flash.external.ExternalInterface; public class Main extiende MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange);  public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue); // llama a receiveColor (event.target.hexValue) en el javascript</pre> <p>Ahora tenemos que escribir esta función receiveColor (). En la cabecera de nuestro documento HTML, iniciamos el javascript definiendo esta función. Simplemente toma el valor enviado desde Flash y cambia el color de fondo.</p> <pre> <script type="text/javascript"> function receiveColor(value)  document.bgColor = "#" + value;  </script></pre> <p>Pon eso justo después <head> en su archivo HTML. Si todo está bien, cuando ejecute la página HTML en un navegador y cambie el color en el ColorPicker, debería cambiar el color de fondo de la página web..</p> <hr> <h2> Paso 6: Llamar a funciones de ActionScript desde JavaScript</h2> <p>El siguiente ejemplo será enviar datos desde JavaScript a Flash. En el documento HTML, pegue el siguiente código dentro de lae <script>etiqueta que agregó en el último paso: </p> <pre> window.onload = function () var sender = document.getElementById ("sender"); // getElementById encuentra un elemento de acuerdo con su propiedad "id" sender.onclick = function () var ta = document.getElementById ("textArea"); documento ['externalInterface']. receiveText (ta.value); ta.value = ""; ; ;</pre> <p>Esto es lo que hace: después de que se carga el documento, obtenemos el botón "remitente" y le adjuntamos un detector de eventos. Cuando se haga clic en el botón 'remitente', llamará a la función receiveText () en Flash que configuraremos ahora.</p> <p>De vuelta en Flash, le pedimos a ExternalInterface que registre la función ActionScript para que pueda llamarse desde JavaScript. Luego configuramos nuestra función receiveText ():</p> <pre> package import fl.events.ColorPickerEvent; importar flash.display.MovieClip; importar flash.external.ExternalInterface; public class Main extiende MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); // permite que JavaScript acceda a la función receiveText ().  public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  // esta es la nueva función receiveText public function receiveText (value: String): void jsText.text = value; </pre> <p>(Las nuevas líneas son 5, 9 y 16-19.)</p> <hr> <h2> Paso 7: Llamar a alertas, confirmaciones y solicitudes de JavaScript desde ActionScript</h2> <p>También podemos llamar alertas muy fácilmente desde ActionScript. Aquí simplemente le pedimos al ExternalInterface que llame a un 'indicador'. También podemos usar la interfaz externa para pasar parámetros a las funciones. Aquí le decimos a la función 'preguntar' que le pregunte al usuario su nombre. Cuando nuestro usuario ingresa la información, se pasa de nuevo al campo de texto 'promptText'.</p> <pre> package import fl.events.ColorPickerEvent; importar flash.display.MovieClip; importar flash.external.ExternalInterface; public class Main extiende MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); prompt.addEventListener (MouseEvent.CLICK, promptClick); // hace que se ejecute promptClick () cuando se hace clic en el botón de solicitud función pública colorChange (evento: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  public function receiveText (value: String): void jsText.text = value;  // función a llamar cuando se hace clic en el botón de solicitud. Preguntará por el nombre del usuario usando un indicador de JS. función pública promptClick (evento: MouseEvent): void promptText.text = "Usted dijo que su nombre es:" + ExternalInterface.call ("prompt", "¿Cuál es su nombre?"); </pre> <p>(Las nuevas líneas son 10 y 21-24.)</p> <hr> <h2> Paso 8: Llamar a funciones anónimas de JavaScript</h2> <p>Otra cosa que podemos hacer es escribir nuestras propias funciones de JavaScript como cadenas y luego llamarlas desde la interfaz externa. Aquí creamos una función de JavaScript que recibe un parámetro. Tomamos ese parámetro y asignamos su valor al atributo innerHTML de nuestro div 'textChange' en el documento HTML. Notará que no hay funciones de JavaScript externas que estén siendo llamadas, todo está contenido dentro del ActionScript..</p> <pre> package import fl.events.ColorPickerEvent; importar flash.display.MovieClip; importar flash.external.ExternalInterface; public class Main extiende MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); prompt.addEventListener (MouseEvent.CLICK, promptClick); change.addEventListener (MouseEvent.CLICK, changeClick); // hace que se ejecute changeClick () cuando se hace clic en el botón de cambio función pública colorChange (evento: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  public function receiveText (value: String): void jsText.text = value;  public function promptClick (evento: MouseEvent): void promptText.text = "Usted dijo que su nombre es:" + ExternalInterface.call ("prompt", "¿Cuál es su nombre?");  // cambia el texto dentro del HTML para que coincida con el campo de texto dentro de la función pública Flash changeClick (evento: MouseEvent): void ExternalInterface.call ("function (param) document.getElementById ('textChange'). innerHTML = param;" , changeText.text); changeText.text = ""; </pre> <p>(Las nuevas líneas son 11 y 26-30.)</p> <hr> <h2> Paso 9: Llamar a funciones anónimas de JavaScript y ActionScript</h2> <p>Por último, podemos llamar a funciones anónimas en ambos lados. En la función 'anónima', registramos una función anónima de ActionScript con ExternalInterface. La función completa un texto y luego inicia un temporizador. A continuación, llamamos a una función anónima de JavaScript. Esta función le dice a la ventana, cuando se ha cambiado el tamaño, debe volver a llamar a nuestra función anónima de ActionScript..</p> <pre> package import fl.events.ColorPickerEvent; importar flash.display.MovieClip; importar flash.external.ExternalInterface; public class Main extiende MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); prompt.addEventListener (MouseEvent.CLICK, promptClick); change.addEventListener (MouseEvent.CLICK, changeClick); // crear un nuevo temporizador con una marca de un segundo, y agregar un detector de eventos var timer: Timer = new Timer (1000); timer.addEventListener (TimerEvent.TIMER, onTimer); anónimo(); // configura las funciones anónimas función pública colorChange (evento: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  public function receiveText (value: String): void jsText.text = value;  public function promptClick (evento: MouseEvent): void promptText.text = "Usted dijo que su nombre es:" + ExternalInterface.call ("prompt", "¿Cuál es su nombre?");  función pública changeClick (evento: MouseEvent): void ExternalInterface.call ("function (param) document.getElementById ('textChange'). innerHTML = param;", changeText.text); changeText.text = "";  // borra el texto después de que un segundo haya pasado la función pública onTimer (evento: TimerEvent): void resizeText.text = ""; timer.stop ();  public function anonymous (): void // ¿ve cómo estamos definiendo una función dentro de otra función? ExternalInterface.addCallback ("anon", function () resizeText.text = "La ventana ha cambiado de tamaño."; Timer.start ();); // lo mismo se aplica aquí ExternalInterface.call ("function () window.onresize = function () document ['externalInterface']. anon ();;"); </pre> <p>(Las nuevas líneas son 13-17 y 37-52.)</p> <hr> <h2>Conclusión</h2> <p>El ExternalInterface es una clase extremadamente poderosa y útil. Con él, puede recibir valores y eventos, todos fuera del SWF. Diviértete y gracias por leer.!</p>

<div class="rek-block">
	<center>	
			<ins class="adsbygoogle"
			style="display:inline-block;width:580px;height:400px"
			data-ad-client="ca-pub-3810161443300697"
			data-ad-slot="9434875811"></ins>
	   <script>
	   (adsbygoogle = window.adsbygoogle || []).push({});
	   </script>
	</center>
</div>

<div class="h-alltags">
<a href="articles/code">Código</a>
</div>

</div>

</div>
</div>

</div>

<div class="next_posts clearfix">
	<div class="n_post">
        
		<div class="next_posts-h1 left_nh1"><a href="/articles/webdesign/quick-tip-how-to-consistently-render-typefaces-cross-browser.html">Sugerencia rápida Cómo generar tipos de letra de forma coherente en todos los navegadores</a></div>
			
			<div class="next_posts-img" style="background-image: url('//accentsconagua.com/img/images_4/quick-tip-how-to-consistently-render-typefaces-cross-browser.png');"></div>	
			
        				
	</div>		
	<div class="n_post">
        
		<div class="next_posts-h1 right_nh1"><a href="/articles/gamedevelopment/quick-tip-how-to-code-a-simple-character-name-generator.html">Consejo rápido cómo codificar un generador de nombres de caracteres simples</a></div>
			
			<div class="next_posts-img" style="background-image: url('//accentsconagua.com/img/images_15/quick-tip-how-to-code-a-simple-character-name-generator.png');"></div>
					
        
	</div>
</div>

<footer>
	<div class="container">
			<div class="footer-langs">
					<ul class="site-langs-list">
							<li><a href="https://www.accentsconagua.com"><i class="flag flag-DE"></i>Deutsch</a></li>					
							<li><a href="https://fr.accentsconagua.com"><i class="flag flag-FR"></i>Français</a></li>
							<li><a href="https://nl.accentsconagua.com"><i class="flag flag-NL"></i>Nederlands</a></li>
							<li><a href="https://no.accentsconagua.com"><i class="flag flag-NO"></i>Norsk</a></li>
							<li><a href="https://sv.accentsconagua.com"><i class="flag flag-SE"></i>Svenska</a></li>
							<li><a href="https://it.accentsconagua.com"><i class="flag flag-IT"></i>Italiano</a></li>
							<li><a href="https://es.accentsconagua.com"><i class="flag flag-ES"></i>Español</a></li>
							<li><a href="https://ro.accentsconagua.com"><i class="flag flag-RO"></i>Românesc</a></li>
					</ul>
				</div>
				
			<div class="h-block"><a href="/">es.accentsconagua.com</a><div class="h-block-a"></div></div>
			<div class="footer-text">
				Información interesante y consejos útiles sobre programación. Desarrollo de sitios web, diseño web y desarrollo web. Tutoriales de Photoshop. Creación de juegos de ordenador y aplicaciones móviles. Conviértete en un programador profesional desde cero.
			</div>
	</div>
</footer>

</div>
</div>

function toggleModal() {
						modal.classList.toggle("show-modal");
			}

function windowOnClick(event) {
						if (event.target === modal) {
										toggleModal();
						}
			}

trigger.addEventListener("click", toggleModal);
			closeButton.addEventListener("click", toggleModal);
			window.addEventListener("click", windowOnClick);
</script>

</body>
</html>

Consejo rápido Cómo comunicarse entre Flash y JavaScript

Paso 1: Configurar el documento de Flash

Paso 2: configurar la interfaz de usuario Flash

Paso 3: configurar la interfaz de usuario HTML