Share
In diesem Schnelltipp zeige ich Ihnen, wie Sie ein Shapshot-Tool erstellen, das einen Teil der Bühne kopiert und das Ergebnis als PNG-Bild speichert.
Dies ist das Endergebnis. Klicken Sie einfach auf die Bühne und ziehen Sie dann mit der Maus einen Schnappschuss.
Erstellen Sie einen neuen Ordner für dieses Projekt und vergeben Sie einen beliebigen Namen. Gehen Sie zu Github und laden Sie die neueste Version von herunter As3Corelib Klasse. Für diesen Quick Tip habe ich Version .93 verwendet. Entpacke die ZIP-Datei und gehe zu as3corelib-.93> src.
Kopiere das com Verzeichnis zu Ihrem neu erstellten Ordner. Dieses Paket ist sehr nützlich PNGEncoder Klasse, die wir zur Kodierung der verwenden werden
Schnappschuss in ein PNG-Bild.
Starten Sie Flash und erstellen Sie ein neues Flash-Dokument. Stellen Sie sicher, dass die Veröffentlichung auf Actionscript 3.0 und Flash Player 10 erfolgt. Sie können dies in den Eigenschaften überprüfen
Panel oder durch Auswahl Einstellungen veröffentlichen… und dann auf die Blitz Tab.
Wir benötigen etwas Inhalt in der Flash-Datei, um zu überprüfen, ob das Schnappschuss-Tool ordnungsgemäß funktioniert. Wir werden einige Kreise erstellen und sie zufällig auf der Bühne platzieren. Erstellen Sie eine neue Dokumentklasse mit dem Namen Circles.as und fügen Sie den folgenden Code hinzu. Denken Sie daran, die Klasse durch Schreiben mit der Flash-Datei zu verknüpfen Kreise in dem Klasse Feld in der Eigenschaften Panel.
package import flash.display.Shape; import flash.display.Sprite; public class Circles erweitert Sprite private var _circleCount: int = 20; öffentliche Funktion Circles () makeCircles (); private Funktion makeCircles (): void for (var i: int = 0; i < _circleCount; i++) var circle:Shape = new Shape(); circle.graphics.lineStyle(1, 0xCCCCCC, 1); circle.graphics.beginFill(0x333333, 0.5); circle.graphics.drawCircle(Math.random() * stage.stageWidth, Math.random() * stage.stageHeight, (Math.random() * 40) + 20); circle.graphics.endFill(); addChild(circle);
Unsere Snapshot-Funktion funktioniert jedoch mit jedem Bühneninhalt. Sie müssen sich also nicht auf einfache Formen beschränken!
Erstellen Sie eine neue Klassendatei, und geben Sie ihr einen Namen SnapShot.as. Dies ist die Klasse, die alle Methoden enthält, die zum Erstellen eines Snapshots verwendet werden. Fügen Sie der Klasse den folgenden Code hinzu.
package import flash.display.Stage; öffentliche Klasse SnapShot private var _stage: Stage; public function Snapshot () public function enable (Stufe: Stufe): void _stage = Stufe;
Fügen Sie dem Code die folgenden Codezeilen hinzu Kreise Klasse. Wir nehmen das aktivieren Sie() Methode, um einen Verweis auf die Bühne entlang an die zu übergeben Schnappschuss Klasse. Wir tun dies, um auf die Inhalte auf der Bühne zugreifen zu können.
package import flash.display.Shape; import flash.display.Sprite; public class Circles erweitert Sprite private var _circleCount: int = 20; private var _snapshot: SnapShot; öffentliche Funktion Circles () makeCircles (); _snapshot = new SnapShot (); _snapshot.activate (stage); private Funktion makeCircles (): void for (var i: int = 0; i < _circleCount; i++) var circle:Shape = new Shape(); circle.graphics.lineStyle(1, 0xCCCCCC, 1); circle.graphics.beginFill(0x333333, 0.5); circle.graphics.drawCircle(Math.random() * stage.stageWidth, Math.random() * stage.stageHeight, (Math.random() * 40) + 20); circle.graphics.endFill(); addChild(circle);
Erweitere die Schnappschuss Klasse, um die folgenden Methoden einzuschließen. Diese Methoden werden zum Zeichnen des Begrenzungsrahmens verwendet, sodass Benutzer auswählen können, welcher Teil der Bühne in den Snapshot kopiert werden soll.
package import flash.display.Shape; import flash.display.Stage; import flash.events.Event; import flash.events.MouseEvent; öffentliche Klasse SnapShot private var _stage: Stage; private var _boundary: Form; private var _originX: int; private var _originY: int; private var _mouseX: int; private var _mouseY: int; public function SnapShot () public function enable (Stufe: Stufe): void _stage = Stufe; addMouseListeners (); private Funktion addMouseListeners (): void _stage.addEventListener (MouseEvent.MOUSE_DOWN, onMouseDown); _stage.addEventListener (MouseEvent.MOUSE_UP, onMouseUp); private Funktion onMouseDown (e: MouseEvent): void _stage.addEventListener (MouseEvent.MOUSE_MOVE, drawBoundaries); // Diese Werte werden später als Ausgangspunkt für die Grenze verwendet. _originX = _stage.mouseX; _originY = _stage.mouseY; private Funktion drawBoundaries (e: MouseEvent): void if (_boundary == null) _boundary = new Shape (); clearBoundaries () // Dadurch wird der mouseY-Wert innerhalb der Bühnengrenzen gehalten. _mouseY = Math.max (Math.min (_stage.mouseY, _stage.stageHeight), 0); // Dies bewirkt, dass der mouseX-Wert innerhalb der Bühnengrenzen bleibt. _mouseX = Math.max (Math.min (_stage.mouseX, _stage.stageWidth), 0); _boundary.graphics.lineStyle (2, 0x0, 0.5); _boundary.graphics.drawRect (_originX, _originY, _mouseX - _originX, _mouseY - _originY); _boundary.graphics.lineStyle (4, 0x0, 0.2); // Dieser Code stellt sicher, dass wir immer von links oben nach rechts unten zeichnen. _boundary.graphics.drawRect (Math.min (_originX, _mouseX) - 3, Math.min (_originY, _mouseY) - 3, Math.abs (_mouseX - _originX) + 6, Math.abs (_mouseY - _originY) + 6) ; _stage.addChild (_boundary); private Funktion clearBoundaries (): void _boundary.graphics.clear (); private Funktion onMouseUp (e: Event): void _stage.removeEventListener (MouseEvent.MOUSE_MOVE, drawBoundaries); clearBoundaries ();
Wir prüfen zunächst, ob der Benutzer auf die Schaltfläche geklickt hat Bühne. Wenn er auf die Bühne klickt, starten wir die drawBoundaries () Methode, wenn die Maus bewegt wird. Diese Methode zeichnet die Grenzen; Alles, was in die dünne schwarze Linie fällt, ist Teil des Schnappschusses. Wenn der Benutzer die Maus loslässt, hören wir auf, nach Mausbewegungen zu suchen.
Importieren Sie die BitmapData und Matrix Klassen und fügen Sie das hinzu _Inhalt Eigenschaft zur Liste der privaten Immobilien.
package import flash.display.BitmapData; import flash.display.Shape; import flash.display.Stage; import flash.events.Event; import flash.events.MouseEvent; import flash.geom.Matrix; import flash.geom.Rectangle; öffentliche Klasse SnapShot private var _stage: Stage; private var _boundary: Form; private var _content: BitmapData; private var _originX: int; private var _originY: int; private var _mouseX: int; private var _mouseY: int;
Fügen Sie den folgenden Code am Ende der Klasse hinzu:
private Funktion onMouseUp (e: Event): void _stage.removeEventListener (MouseEvent.MOUSE_MOVE, drawBoundaries); clearBoundaries (); createBitmap (); private Funktion createBitmap (): void // Wir addieren die -2 zum Offset für die Grenzlinie. _content = new BitmapData (Math.abs (_mouseX - _originX) - 2, Math.abs (_mouseY - _originY) - 2); // Die -1 wird aus demselben Grund hinzugefügt, damit die Linie nicht im endgültigen Bild angezeigt wird. var bitmapMatrix: Matrix = neue Matrix (1, 0, 0, 1, -Math.min (_originX, _mouseX) - 1, -Math.min (_originY, _mouseY) - 1); _content.draw (_stage, bitmapMatrix);
Das createBitmap () Methode erstellt eine neue BitmapData Objekt mit der Breite und Höhe des Inhaltsbereichs innerhalb der Begrenzung. Das Matrix variable Übergänge (bewegt) das Bild, so dass, wenn die zeichnen() Diese Methode wird als Kopiervorgang von der oberen linken Ecke des Begrenzungsbereichs aus bezeichnet.
Um die Bitmap zu speichern, müssen wir mehrere Klassen importieren.
Accentsconagua
ByteArray Die Klasse wird zur Codierung des verwendet BitmapData Objekt.PNGEncoder Class wird verwendet, um die kodierten Daten in ein PNG-Bild zu konvertieren.Aktenzeichen Class wird verwendet, um das Image auf der Festplatte des Benutzers zu speichern.Wir haben auch ein hinzugefügt _imageCount Eigenschaft, mit der wir die Bildnamen erhöhen.
package import com.adobe.images.PNGEncoder; import flash.display.BitmapData; import flash.display.Shape; import flash.display.Stage; import flash.events.Event; import flash.events.MouseEvent; import flash.geom.Matrix; import flash.geom.Rectangle; import flash.net.FileReference; import flash.utils.ByteArray; öffentliche Klasse Snapshot private var _stage: Stage; private var _boundary: Form; private var _content: BitmapData; private var _originX: int; private var _originY: int; private var _mouseX: int; private var _mouseY: int; private var _imageCount: int = 1;
Fügen Sie den folgenden Code am Ende der SnapShot-Klasse hinzu:
private Funktion createBitmap (): void _content = new BitmapData (Math.abs (_mouseX - _originX) - 2, Math.abs (_mouseY - _originY) - 2); var bitmapMatrix: Matrix = neue Matrix (1, 0, 0, 1, -Math.min (_originX, _mouseX) - 1, -Math.min (_originY, _mouseY) - 1); _content.draw (_stage, bitmapMatrix); saveBitmap (); private Funktion saveBitmap (): void var encodedContent: ByteArray = PNGEncoder.encode (_content); var fileWindow: FileReference = new FileReference (); fileWindow.save (encodedContent, "Image_" + _imageCount + ".png"); _imageCount ++;
Das saveBitmap Methode ist ziemlich einfach zu verstehen. Wir verschlüsseln die BitmapData Objekt speichern und auf der Festplatte des Benutzers speichern.
Wir nehmen das _imageCount Diese Eigenschaft erleichtert dem Benutzer das Speichern mehrerer Bilder in einer Reihe.
Das Snapshot-Tool ist jetzt vollständig und kann mit nur drei Zeilen Code in jedes Projekt implementiert werden.
Stellen Sie sicher, dass Sie Flash Player 10 ausführen und dass das Paket as3corelib im richtigen Verzeichnis gespeichert ist.
Ich hoffe, Ihnen hat dieser Quick Tip gefallen, vielen Dank für das Lesen!
