Schnelltipp Kommunikation zwischen Flash und JavaScript / Code

s und

, welche haben <em>Ich würde</em> Eigenschaften, damit wir über die SWF auf sie zugreifen können.</li> </ul> <p>Ihr HTML-Code sollte wie folgt aussehen:</p> <img src="//accentsconagua.com/img/images_27_3/quick-tip-how-to-communicate-between-flash-and-javascript_3.jpg"> <p>Wenn der Code ersetzt wurde, laden Sie die Datei auf Ihren Webserver hoch, damit wir mit dem ActionScript beginnen können.</p> <hr> <h2> Schritt 4: Einrichten einer Dokumentenklasse</h2> <p>Erstellen Sie eine Dokumentenklasse für Ihre Flash-Datei. nenne es Main.as. Wenn Sie mit Dokumentenklassen nicht vertraut sind, lesen Sie diesen Quick Tip.</p> <pre> package import flash.display.MovieClip; public class Main erweitert MovieClip öffentliche Funktion Main () </pre> <hr> <h2> Schritt 5: Aufrufen von JavaScript-Funktionen von Flash</h2> <p>Das erste, was wir mit dem ExternalInterface tun werden, ist eine JavaScript-Funktion, die die Hintergrundfarbe unserer Webseite ändert. Hängen Sie also einen Ereignis-Listener an unsere ColorPicker-Komponente an. Wenn sich die Farbe ändert, wird der Hexadezimalwert an eine Javascript-Funktion namens receiveColor () gesendet:</p> <pre> package import fl.events.ColorPickerEvent; import flash.display.MovieClip; import flash.external.ExternalInterface; public class Main erweitert MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange);  public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue); // ruft receiveColor (event.target.hexValue) im Javascript auf</pre> <p>Nun müssen wir diese receiveColor () - Funktion schreiben. Im Kopf unseres HTML-Dokuments starten wir das Javascript, indem Sie diese Funktion definieren. Es übernimmt einfach den von Flash gesendeten Wert und ändert die Hintergrundfarbe.</p> <pre> <script type="text/javascript"> function receiveColor(value)  document.bgColor = "#" + value;  </script></pre> <p>Setzen Sie das direkt nach <head> in Ihrer HTML-Datei. Wenn alles gut geht, wenn Sie die HTML-Seite in einem Browser ausführen und die Farbe im ColorPicker ändern, sollte sich die Hintergrundfarbe der Webseite ändern.</p> <hr> <h2> Schritt 6: ActionScript-Funktionen von JavaScript aus aufrufen</h2> <p>Das nächste Beispiel ist das Senden von Daten von JavaScript an Flash. Fügen Sie im HTML-Dokument den folgenden Code in das eine <script>Tag, den Sie im letzten Schritt hinzugefügt haben: </p> <pre> window.onload = function () var sender = document.getElementById ("sender"); // getElementById findet ein Element anhand seiner "id" -Eigenschaft sender.onclick = function () var ta = document.getElementById ("textArea"); document ['externalInterface']. receiveText (ta.value); ta.value = ""; ; ;</pre> <p>Dies geschieht folgendermaßen: Nachdem das Dokument geladen wurde, rufen wir die Schaltfläche "Sender" auf und fügen einen Ereignis-Listener hinzu. Wenn Sie auf die Schaltfläche "Sender" klicken, wird die Funktion receiveText () in Flash aufgerufen, die wir jetzt einrichten.</p> <p>Zurück in Flash weisen wir das ExternalInterface an, die ActionScript-Funktion zu registrieren, damit sie von JavaScript aus aufgerufen werden kann. Dann richten wir unsere Funktion receiveText () ein:</p> <pre> package import fl.events.ColorPickerEvent; import flash.display.MovieClip; import flash.external.ExternalInterface; public class Main erweitert MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); // erlaubt JavaScript den Zugriff auf die Funktion receiveText ().  public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  // Dies ist die neue Funktion receiveText. public function receiveText (value: String): void jsText.text = value; </pre> <p>(Neue Zeilen sind 5, 9 und 16-19.)</p> <hr> <h2> Schritt 7: Aufrufen von JavaScript-Warnungen, Bestätigungen und Eingabeaufforderungen aus ActionScript</h2> <p>Wir können Warnungen auch sehr einfach über ActionScript aufrufen. Hier weisen wir einfach das ExternalInterface an, eine 'Eingabeaufforderung' aufzurufen. Wir können das ExternalInterface auch verwenden, um Parameter an Funktionen zu übergeben. Hier weisen wir die 'Prompt'-Funktion an, den Benutzer nach seinem Namen zu fragen. Wenn unser Benutzer die Informationen eingibt, werden diese an das Textfeld 'promptText' zurückgegeben.</p> <pre> package import fl.events.ColorPickerEvent; import flash.display.MovieClip; import flash.external.ExternalInterface; public class Main erweitert MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); prompt.addEventListener (MouseEvent.CLICK, promptClick); // bewirkt, dass promptClick () ausgeführt wird, wenn auf die Schaltfläche der Eingabeaufforderung geklickt wird. public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  public function receiveText (value: String): void jsText.text = value;  // Funktion, die aufgerufen werden soll, wenn die Aufforderungsschaltfläche angeklickt wird. Fragt den Benutzernamen anhand einer JS-Eingabeaufforderung. public function promptClick (event: MouseEvent): void promptText.text = "Sie sagten, Ihr Name lautet:" + ExternalInterface.call ("prompt", "wie lautet Ihr Name?"); </pre> <p>(Neue Zeilen sind 10 und 21-24.)</p> <hr> <h2> Schritt 8: Anonyme JavaScript-Funktionen aufrufen</h2> <p>Wir können auch unsere eigenen JavaScript-Funktionen als Zeichenfolgen schreiben und sie dann vom ExternalInterface aus aufrufen. Hier erstellen wir eine JavaScript-Funktion, die einen Parameter empfängt. Wir nehmen diesen Parameter und weisen dessen Wert dem innerHTML-Attribut unseres 'textChange'-div im HTML-Dokument zu. Sie werden feststellen, dass keine externen JavaScript-Funktionen aufgerufen werden - dies ist alles im ActionScript enthalten.</p> <pre> package import fl.events.ColorPickerEvent; import flash.display.MovieClip; import flash.external.ExternalInterface; public class Main erweitert MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); prompt.addEventListener (MouseEvent.CLICK, promptClick); change.addEventListener (MouseEvent.CLICK, changeClick); // bewirkt, dass changeClick () ausgeführt wird, wenn auf die Schaltfläche "Ändern" geklickt wird public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  public function receiveText (value: String): void jsText.text = value;  public function promptClick (event: MouseEvent): void promptText.text = "Sie sagten, Ihr Name lautet:" + ExternalInterface.call ("prompt", "wie lautet Ihr Name?");  // ändert den Text im HTML-Text an das Textfeld in der öffentlichen Flash-Funktion changeClick (Ereignis: MouseEvent): void ExternalInterface.call ("function (param) document.getElementById ('textChange'). innerHTML = param;" , changeText.text); changeText.text = ""; </pre> <p>(Neue Zeilen sind 11 und 26-30.)</p> <hr> <h2> Schritt 9: Anonyme JavaScript- und ActionScript-Funktionen aufrufen</h2> <p>Schließlich können wir auf beiden Seiten anonyme Funktionen aufrufen. In der Funktion 'anonymous' registrieren wir eine anonyme ActionScript-Funktion mit dem ExternalInterface. Die Funktion füllt Text ein und startet einen Timer. Als Nächstes rufen wir eine anonyme JavaScript-Funktion auf. Diese Funktion teilt dem Fenster mit, dass bei einer Änderung der Größe die anonyme ActionScript-Funktion aufgerufen werden muss.</p> <pre> package import fl.events.ColorPickerEvent; import flash.display.MovieClip; import flash.external.ExternalInterface; public class Main erweitert MovieClip public function Main () cp.addEventListener (ColorPickerEvent.CHANGE, colorChange); ExternalInterface.addCallback ("receiveText", receiveText); prompt.addEventListener (MouseEvent.CLICK, promptClick); change.addEventListener (MouseEvent.CLICK, changeClick); // Erstellen Sie einen neuen Timer mit einem Tick von einer Sekunde und fügen Sie einen Ereignis-Listener hinzu. var timer: Timer = new Timer (1000); timer.addEventListener (TimerEvent.TIMER, onTimer); anonym(); // Einrichten der anonymen Funktionen public function colorChange (event: ColorPickerEvent): void ExternalInterface.call ("receiveColor", event.target.hexValue);  public function receiveText (value: String): void jsText.text = value;  public function promptClick (event: MouseEvent): void promptText.text = "Sie sagten, Ihr Name lautet:" + ExternalInterface.call ("prompt", "wie lautet Ihr Name?");  public function changeClick (Ereignis: MouseEvent): void ExternalInterface.call ("function (param) document.getElementById ('textChange'). innerHTML = param;", changeText.text); changeText.text = "";  // den Text löschen, nachdem eine Sekunde die öffentliche Funktion onTimer übergeben hat (event: TimerEvent): void resizeText.text = ""; Timer.stop ();  public function anonymous (): void // sehen wir, wie wir eine Funktion innerhalb einer anderen Funktion definieren? ExternalInterface.addCallback ("anon", function () resizeText.text = "Die Größe des Fensters wurde geändert."; Timer.start ();); // Dasselbe gilt hier. ExternalInterface.call ("function () window.onresize = function () document ['externalInterface']. anon ();;"); </pre> <p>(Neue Zeilen sind 13-17 und 37-52.)</p> <hr> <h2>Fazit</h2> <p>Das ExternalInterface ist eine extrem leistungsfähige und nützliche Klasse. Damit können Sie Werte und Ereignisse außerhalb der SWF empfangen. Viel Spaß damit und danke fürs Lesen!</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>

</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">Schneller Tipp So können Sie Schriftarten über mehrere Browser hinweg konsistent darstellen</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">Schnelltipp So codieren Sie einen einfachen Zeichennamengenerator</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="/">accentsconagua.com</a><div class="h-block-a"></div></div>
			<div class="footer-text">
				Interessante Informationen und nützliche Tipps zur Programmierung. Website-Entwicklung, Webdesign und Webentwicklung. Photoshop-Tutorials. Erstellung von Computerspielen und mobilen Anwendungen. Werden Sie von Grund auf professioneller Programmierer.
			</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>

Schnelltipp Kommunikation zwischen Flash und JavaScript

Schritt 1: Richten Sie das Flash-Dokument ein

Schritt 2: Richten Sie die Flash-Benutzeroberfläche ein

Schritt 3: Richten Sie die HTML-Benutzeroberfläche ein