Guardar imágenes con BitmapData y PHP
La idea es sencilla: Hacer un dibujo en Flash, y guardarlo como jpg ( o guardar el contenido de un clip, o hacer un pantallazo).
El proceso es el siguiente:
- «Calcar» el objeto que queremos guardar en un objeto BitmapData
- Recorrer ese objeto para almacenar el color de cada pixel en un String.
- Mandar ese String a un PHP para que nos «pinte» la imagen y la guarde.
El código Actionscript es este:
|
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 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 |
import flash.display.BitmapData; urlo = ""; ////////////////////////////////////////////////////////////////////////////////////////// //Esta es la función que se encarga de crear el objeto, "guardar los pixels" y mandarlos function Capturar(mc:MovieClip) { //Muestro mi capa de progreso Progreso_mc._visible = true; Progreso_mc.Cerrar_bt._visible = false; //Creo el objeto bit map, del ancho y el alto del objeto que quiero guardar y dibujo este dentro mcBitmap = new BitmapData(mc._width, mc._height, true, 0xFFFFFF); mcBitmap.draw(mc); //Actualizo el estado de progreso Progreso_mc.Texto_txt.text = "Guardando imagen..."; //Guardo en una matriz el valor de todos los pixels var cadena = new String(); for (var i = 1; i<=mc._height; i++) { for (var j = 1; j<=mc._width; j++) { cadena += ","+mcBitmap.getPixel(j, i).toString(16); } } //Creo las variables para enviar y recibir del PHP enviarImagen = new LoadVars(); respuesta = new LoadVars(); //Al recibir los datos del PHP generador respuesta.onLoad = function(exito) { //Si todo ha ido bien if (exito) { //Actualizo el progreso y cargo en una nueva ventana la imagen generada Progreso_mc.Texto_txt.text = "Imagen recibida"; Progreso_mc.Cerrar_bt._visible = true; getURL(urlo+unescape(this.archivo), "_blank"); //Si algo ha fallado } else { //Mensaje de error Progreso_mc.Texto_txt.text = "Error al generar la imagen."; Progreso_mc.Cerrar_bt._visible = true; } }; //Almaceno en la variable a enviar los valores de los pixels, y el ancho y alto de la imagen enviarImagen.imagen = cadena; enviarImagen.ancho = mc._width; enviarImagen.alto = mc._height; //Actualizo el progreso Progreso_mc.Texto_txt.text = "Generando jpg..."; //Envio los datos de la imagen enviarImagen.sendAndLoad(urlo+"salvar.php",respuesta,"post"); } ////////////////////////////////////////////////////////////////////////////////////////// //Código del botón guardar Guardar_bt.onRelease = function() { //Al pulsar guardar, invoco a la funcion Capturar pasando como parametro el clip que quiero "guardar" Capturar(Escena_mc); }; ////////////////////////////////////////////////////////////////////////////////////////// //Este es el código para hacer la "Pizarra". Muy sencilla, pero para el ejemplo vale. Escena_mc.onMouseDown = function() { Escena_mc.Tiza_mc.lineStyle(3,"0x000000"); Escena_mc.Tiza_mc.moveTo(_xmouse,_ymouse); Pintar = true; }; Escena_mc.onMouseUp = function() { Pintar = false; }; Escena_mc.onEnterFrame = function() { if (Pintar) { Escena_mc.Tiza_mc.lineTo(_xmouse,_ymouse); } }; ////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////// Progreso_mc._visible = false; stop(); |
Y el php (sacado de google):
|
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 |
<?php //recibo las variables $ancho=$_POST["ancho"]; $alto=$_POST["alto"]; $pixels=explode(",",$_POST["imagen"]); //$bg=$_POST["bg"]; //creamos la imagen $img = imagecreatetruecolor($ancho, $alto); //creamos el color de fondo $bghex = 0xffffff; while(strlen($bghex) < 6){ $bghex = "0" . $bghex; } $r = hexdec(substr($bghex, 0, 2)); $g = hexdec(substr($bghex, 2, 2)); $b = hexdec(substr($bghex, 4, 2)); $color = imagecolorallocate($img, $r, $g, $b); //rellenamos la imagen con el color de fondo imagefill($img, 0, 0, $color); //pintamos cada uno de los pixeles: $x=0; $y=0; foreach($pixels as $key => $value) { if($value!="") { $hex = $value; while(strlen($hex) < 6){ $hex = "0" . $hex; } $r = hexdec(substr($hex, 0, 2)); $g = hexdec(substr($hex, 2, 2)); $b = hexdec(substr($hex, 4, 2)); $test = imagecolorallocate($img, $r, $g, $b); imagesetpixel($img, $x, $y, $test); } $x++; if($x>=$ancho) { $x=0; $y++; } } //asignamos un numero unico para el nombre del archivo $string=md5(implode("",$pixels)); //el nombre del archivo a guardar $filename="images/$string.jpg"; //si el archivo no existe if(!file_exists($filename)) { //lo guardamos imagepng($img, "$filename"); } //devolvemos a flash la ruta del archivo echo "archivo=$filename&"; ?> |