Come salvare immagini in Flash CS3

Con Adobe Flash CS3 l’uso delle Bitmap è così migliorato che viene subito voglia di creare un piccolo Paint. Abbiamo già visto come realizzare un piccolo Paint (vedi Creare un’applicazione Paint in Flash CS3 Painter: semplice applicazione per disegno in Flash CS3 Pro) in grado di supportare un vero e proprio “cancellino” – funzione erase, grazie ad un uso particolare di layer Shape e Bitmap. Diciamo subito che Flash (a differenza di Flex) non permette ne encoding (tipo JPG o PNG) ne salvataggio automatico di immagini Bitmap. Tuttavia si può aggirare l’ostacolo sfruttando uno scripting lato server e la capacità di Flash di inviare dati in POST.

La teoria

L’artifizio che possiamo usare è il seguente: leggiamo i dati contenuti in una Bitmap pixel per pixel, li trasformiamo in valori esadecimali e li inviamo in POST ad una pagina PHP (in questo esempio sfruttiamo PHP e la GD Library per creare effettivamente l’immagine, ma altre soluzioni sono ugualmente efficaci).

Diciamo subito che l’unico neo di questa tecnica è l’estrema lentezza, almeno con Bitmap abbastanza grandi (io ho provato con una Bitmap 640 x 300)!

Inoltre, come vedrete nel codice Actionscript, non è possibile controllare il progress dell’invio, ma solo ottenere l’evento del completamento di tutto il lavoro; Actionscript + PHP.

LA PRATICA

Data una Bitmap l’algoritmo da usare può essere il seguente:

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
/**
 * @prototype : 0.0.1
 * @author    : =undo=
 * @email   : g.fazioli@undolog.com
 * @web     : http://www.undolog.com
 *
 * @params    :
 *
 * __bitmap   : puntatore alla nostra bitmap
 * __width    : larghezza in pixel
 * __height   : altezza in pixel
 *
 */


// copia per la lettura - questo potrebbe essere evitato
var sbmp:BitmapData = new BitmapData(__width, __height);
sbmp.draw ( __bitmap );
//
var pixels:Array = new Array();
for (var xx:uint = 0; xx < = __width; xx++) {
    for (var yy:uint = 0; yy <= __height; yy++) {
        pixels.push( sbmp.getPixel32(xx, yy).toString(16) );
    }
}
//
var urlreq:URLRequest   = new URLRequest( "http://miodominio.com/savebitmap.php" );
var urlpar:URLVariables = new URLVariables();
var urlldr:URLLoader    = new URLLoader();
//
urlldr.addEventListener( Event.COMPLETE,
    function (e:Event):void {
        trace( 'Completato' );
    }
);
//
urlpar.pixels = pixels.toString();
urlpar.height = __height;
urlpar.width  = __width;
urlreq.data   = urlpar;
urlreq.method = URLRequestMethod.POST;
urlldr.load( urlreq );

Come codice PHP possiamo usare:

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
/**
 * @prototype : 0.0.1
 * @author    : =undo=
 * @email   : g.fazioli@undolog.com
 * @web     : http://www.undolog.com
 *
 * @params    :
 *
 * __bitmap   : puntatore alla nostra bitmap
 * __width    : larghezza in pixel
 * __height   : altezza in pixel
 *
 */

// $pixels diventa un array con i valori dei singoli pixel
$pixels = explode(",", $_POST['pixels']);
$width  = $_POST['width'];
$height = $_POST['height'];
// creo l'immagine - @evitando di emettere errori
$image = @imagecreatetruecolor( $width ,$height );
// Scrivo i pixel per tutta la lunghezza e altezza
$index = 0;
for($x=0; $x< =$width; $x++){
    for($y=0; $y<=$height; $y++){
        $r = hexdec("0x".substr( $pixels[$index] , 2 , 2 ));
        $g = hexdec("0x".substr( $pixels[$index] , 4 , 2 ));
        $b = hexdec("0x".substr( $pixels[$index] , 6 , 2 ));
        $color = imagecolorallocate($image, $r, $g, $b);
        imagesetpixel ($image,$x,$y,$color);
        $index++;
    }
}
// scrivo immagine (in JPG - ma potete usare un diverso formato) sul disco/server
imagejpeg( $image, "immagine.jpg" );
imagedestroy( $image ); // libero tutto

Torneremo prossimamente sull’argomento proponendo anche altre soluzioni… ;)

Riferimenti e webgrafia:

  • werutzb

    Hi!

    I would like make better my SQL capabilities.
    I red really many SQL books and would like to
    read more about SQL for my occupation as mysql database manager.

    What would you recommend?

    Thanks,
    Werutz

  • Abramovicl

    Hi , i have some questions about you desing
    maybe you can give designer contacts?

  • Uday

    The above code is workiing perfectelly if we are exporting the SWF with and height less than 400 pixel. If we take the with and height more than 400 pixel then it’s not working.

    Can you please tell me, how can I save any bitmap more than 500×500 pixel from Flash?

  • http://www.undolog.com Giovambattista Fazioli

    @Uday: please check your php settings. Could be some timeout setting too low. To send bitmap pixel to the server in POST mode can take several minutes to process.