Bilddateien aus MovieClips erzeugen
von Tobias Menzel
am 08.05.07 um 09:22 (413 Hits)
Standardmäßig gibt es in Flash keine Methode, einen Screenshot des Bühneninhalts zu erstellen und an den Server zu schicken. Nützlich kann eine solche Funktion allerdings sein, um z.B. bei Onlineeditoren eine Preview zu erzeugen und dauerhaft zu speichern.
Mit den Methoden der BitmapData-Klasse kann ein Schnappschuss eines MovieClips allerdings pixelweise ausgelesen und an den Server übertragen werden. Dort kann mit PHP eine Bilddatei aus den Daten erstellt werden.
Das folgende Beispiel analysiert einen MovieClip und erzeugt aus den Daten auf dem Server eine JPEG-Grafik:Code actionscript:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 import flash.display.BitmapData; function parseImg(src, _cb, maxamt) { var imgObj = new Object(); imgObj._w = src._width; imgObj._h = src._height; imgObj.pixels = new Array(); var bmp = new BitmapData(src._width, src._height, true, null); bmp.draw(src); function peek(px, py) { return bmp.getPixel(px, py); } var count = 0; var x = 0; var y = 0; var amt = src._width * src._height; src.onEnterFrame = function() { src._alpha = (src._alpha == 100)? 50 : 100; for (var i=0; i<maxamt; i++) { if (count >= amt) break; imgObj.pixels[count] = peek(x, y); count ++; x ++; if (x >= src._width) { x = 0; y ++; } } if (count >= amt) { delete this.onEnterFrame; src._alpha = 100; _cb(imgObj); } } } function paintImg(dest, obj, maxamt) { var bmp = new BitmapData(obj._w, obj._h, false, 0xFFFFFF); dest.attachBitmap(bmp, 1); var x = 0; var y = 0; var count = 0; dest.onEnterFrame = function() { for (var i=0; i<maxamt; i++) { if (count >= obj.pixels.length) break; bmp.setPixel(x, y, obj.pixels[count]); count ++; x ++; if (x >= obj._w) { x = 0; y ++; } } if (count >= obj.pixels.length) { delete this.onEnterFrame; } } } function onReady(obj) { var lv = new LoadVars(); lv.w = obj._w; lv.h = obj._h; lv.p = obj.pixels.join(";"); lv.onLoad = function() { paintImg(ausgabeMC, obj, 5000); } lv.sendAndLoad("getpixels.php", lv, "POST"); } parseImg(quellMC, onReady, 5000);
- Der Funktion "parseImg" werden folgende Parameter übergeben:
- src - eine Referenz auf den Quell-MC
- _cb - eine Callbackfunktion, die aufgerufen wird, wenn das Bild analysiert wurde
- maxamt - die maximale Anzahl Proben pro Frameaufruf (je nach Bildgröße kann die Analyse einige Sekunden dauern - durch gelegentliches Zwischenschalten eines Frameintervalls wird der Filmablauf nicht unterbrochen.
- Sobald das Bild analysiert wurde, wird die Callbackfunktion ("onReady") mit dem erstellten Bilddatenobjekt aufgerufen. Diese Methode erzeugt ein LoadVars-Objekt, serialisiert die ausgelesenen Farbwerte und schickt die Daten an den Server.
- Sobald eine Antwort vom Server vorliegt (das dortige Script erstellt eine Bilddatei oder legt die Rohdaten in einer Datenbank ab), wird in diesem Beispiel die Funktion "paintImg" aufgerufen, die das Bild in einem leeren MovieClip nachzeichnet.
- Der Methode "paintImg" werden folgende Parameter übergeben:
- dest - Referenz auf den Ziel-MC (dort wird das Bild gezeichnet)
- obj - Objekt mit den ausgelesenen Farbwerten
- maxamt - auch hier die Anzahl Durchläufe pro Frame
Das dazugehörige PHP-Script kann so aussehen:Viel Spaß und GrußPHP-Code:$w = $_POST["w"];
$h = $_POST["h"];
$pixels = split(";", $_POST["p"]);
$img = imagecreatetruecolor($w, $h);
$count = 0;
for ($y=0; $y<$h; $y ++) {
for ($x=0; $x<$w; $x++) {
imagesetpixel($img, $x, $y, $pixels[$count]);
$count ++;
}
}
imagejpeg($img, "getpixels.jpg", 100);
.






