Ich habe Chrome-Schaltflächen für Videoplayer, die mit HTML / CSS entworfen wurden. Der Vollbild-Button muss Flash auf den Vollbildmodus hinweisen, aber Adobe verbietet diese Javascript-to-Actionscript-Interaktion. Was ist ein cleverer Hack, um das zu umgehen?
Ich mache einen Web-basierten Video-Player, der viele Plugins unterstützt - Flash, VLC, HTML5, iPhone's Quicktime usw. Ich möchte, dass all diese Spieler die gleichen Chrome-Buttons teilen - Abspielen, Pause, Stummschalten, Lautstärkeregler , Auflösungsauswahl und Vollbild. Diese Schaltflächen sind mit HTML / CSS ausgelegt.
%Vor%Alle Plugins, mit denen ich mich beschäftige, erlauben Javascript, das Plugin zu steuern. Hier sehen Sie ein Beispiel, wie Sie ein HTML-Element für die Verbindung mit einem HTML5-Video erhalten können. Der Code ist nahezu identisch mit den anderen Plugins. Die einzige Sache, die sich ändert, ist der tatsächliche Funktionsname, der aufgerufen wird.
%Vor%Es tritt ein Problem für den Vollbildmodus in Flash auf. In Actionscript 3.0 würden Sie dies tun, um einen Fullscreen-Callback für Javascript verfügbar zu machen:
%Vor% Wenn JavaScript $('flashPlayerId').fullScreen(); aufruft, passiert nichts, weil Adobe das Ereignis im Vollbildmodus durch einen Klick in der SWF-Datei auslösen muss. Auf diese Weise wird verhindert, dass Hacker bösartige Websites erstellen, die den Bildschirm des Benutzers kapern, ohne dass sie ihn initiieren.
Ich erstelle derzeit alle Chrome-Schaltflächen in Flash neu, um den Vollbildmodus zu unterstützen. Ich musste alle meine Grafiken in Flash importieren und das gesamte Javascript in Actionscript konvertieren.
%Vor%Das hat mir eine Menge Schmerz und Qualen verursacht. Immer wenn ich etwas ändern muss, aktualisiere ich HTML und JS. Diese Änderung spiegelt sich in den VLC-, HTML5- und anderen Playern wider. Da Flash jedoch nicht dieselben HTML-Chrom-Schaltflächen verwendet, muss ich die Änderungen in Flash / AS duplizieren. Also suche ich nach einer besseren Lösung, die die Menge an doppeltem Code reduziert. Es muss nicht stilistisch sauber sein. Ich will nur einfache Wartbarkeit.
Geben Sie Ihrem Flash-Film nur 0,1% Opazität (Sie müssen wmode verwenden) und positionieren Sie ihn direkt über die HTML-Tasten. Der Benutzer klickt auf den Flash, sieht aber den HTML-Code. Der ActionScript-Code teilt dem Player lediglich mit, dass er Vollbildmodus ausführen soll, und ruft dann mit ExternalInterface etwas Javascript auf. Bounty bitte!
Sie können NICHT Vollbild ohne Benutzerinteraktion auf eine Flash-Komponente IE auslösen: Mausklick auf eine Schaltfläche.
Obwohl Sie ein Klickereignis in JavaScript haben, funktioniert es nicht, da sich dieses Klickereignis nicht im Flash-Stack befindet.
[Bearbeiten]
Eine Arbeit, die Sie tun können, ist Ihre App in Flex zu bauen und CSS verwenden, um die Schaltflächen zu stylen
Eine andere Arbeit um. Erstellen Sie ein Layout-SWF in Flex mit CSS, um die Schaltflächen zu formatieren, und laden und positionieren Sie das andere SWF darin.
Die Arbeit rum wird ein wenig einrichten, aber wenn Sie die Tasten ändern möchten, müssen Sie nur die CSS ändern, wie z. B. Bildquelle oder Farben oder was auch immer Sie ändern.
Sie könnten haXe verwenden, um eine einzelne Codebasis zu erstellen, die sowohl in JavaScript als auch in ActionScript übersetzt werden kann.
Das bedeutet natürlich, dass Sie auch lernen müssen.
[BEARBEITEN]
Ein einfacherer Ansatz könnte darin bestehen, ein Sprite-Blatt aller Ihrer Bilder zu erstellen. Auf diese Weise müssen Sie nur Ihr Blatt in CSS importieren und die richtige Position des Ansichtsfensters des Blattes festlegen. Und dann könnten Sie das Sprite-Blatt auch dynamisch in den Flash laden.
Das Einzige, um das Sie sich dann kümmern müssen, ist die korrekte Positionierung der Bilder in Ihrem Sprite-Blatt.
Prost
Tags und Links javascript flash actionscript-3