Comunidad de diseño web y desarrollo en internet online

Cambiar color de fondo de una imagen creada con JPGEncode.as

Citar            
MensajeEscrito el 31 Oct 2010 06:08 am
Buenas,

Estoy usando la class JPGEncoder, mediante la cual intento crear una imagen de un area de 600x400, pero los gráficos en sí solo cubren 500x200 de ese área, por lo q sobran unas partes que el JPGEncoder me rellena de color negro y me gustaría cambiarlas a blanco.

¿Se os ocurre algo?

Gracias de antemano.

Por deskarrada

18 de clabLevel



 

chrome
Citar            
MensajeEscrito el 31 Oct 2010 06:27 am
Emmm.... La clase JPGEncoder no es una clase natal de Flash... ¿Podrías darnos más info al respecto?

Saludos, Hernán . -

Por Hernán

BOFH

6148 de clabLevel

19 tutoriales
23 articulos

Genero:Masculino   REC Desarrollador de GAIA

Marketing & IT

firefox
Citar            
MensajeEscrito el 31 Oct 2010 07:46 am
Aquí tenéis el link al proyecto de la class:
http://code.google.com/p/as3corelib/source/browse/trunk/src/com/adobe/images/JPGEncoder.as

Por lo q entiendo, la class en sí no define el color de fondo del q hablo, sino q al crear el bitmapData q luego pasas a la class, es ahí donde defines el color, pero no lo consigo.

He estado buscando mucho en internet y al ver q era una class tirando a conocidilla, he pensado q tal vez aquí sabríais orientarme.

Un saludo.

Por deskarrada

18 de clabLevel



 

chrome
Citar            
MensajeEscrito el 31 Oct 2010 08:40 am
Pues leí la clase por encima. Lo que yo haría es parsear con la clase que tengo al tamaño previsto, y luego unir el resultado a un canvas blanco.

Saludos, Hernán . -

Por Hernán

BOFH

6148 de clabLevel

19 tutoriales
23 articulos

Genero:Masculino   REC Desarrollador de GAIA

Marketing & IT

firefox
Citar            
MensajeEscrito el 31 Oct 2010 08:43 am
BuenAS:

Efectivamente, el color debes especificarlo cuando generes el BitmapData. En los parámetros que le pasas, los dos primeros son el tamaño (anchoxalto), el tercero siquieres que lleve canal alpha (fondo transparente) y EL CUARTO el color de fondo en el caso de que NO quieras fondo transparente. Algo así, en función de cómo llames a tus simbolos:

Código :

var bmpd:BitmapData = new BitmapData(500, 200, false, 0xFFFFFF);

var encoder:JPGEncoder = new JPGEncoder();

var ba:ByteArray = encoder.encode(bmpd);


He escrito directamente aquí el código por lo que seguro que lleva erratas.

Por cierto, Mike Chambers ha cambiado el alojamiento del proyecto a github :

AS3Corelibs

Un saludo.

Por Lukánicos

Claber

468 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 31 Oct 2010 09:17 pm
Perdona por la tardanza y gracias por tu respuesta.

El caso es q ya había probado lo q mencionas, de hecho es te es mi código:

Código ActionScript :

var canvasBitmap:BitmapData = new BitmapData(drawWidth, drawHeight, false, 0xFFFFFF); 
         var m:Matrix = new Matrix(1,0,0,1, 0, 0); 
         var rect:Rectangle = new Rectangle(0, 0, drawWidth, drawHeight); 
          
         var canvasColorTransform:ColorTransform = new ColorTransform(); 
         canvasColorTransform.color = 0xFFFFFF; 
          
         canvasBitmap.draw(canvas, m, canvasColorTransform, null, rect);  
       
         var xpos = 455 - (thumbBoundaryWidth/2); 
         var ypos = 305 - (thumbBoundaryHeight/2); 
         outputArea = new Rectangle(xpos, ypos, thumbBoundaryWidth, thumbBoundaryHeight); 
         var imageOutput:BitmapData = new BitmapData (thumbBoundaryWidth, thumbBoundaryHeight, false, 0xFFFFFF); 
         imageOutput.copyPixels(canvasBitmap, outputArea, new Point());          
          
         // Encode the jpg for output 
         var encoder:JPGEncoder = new JPGEncoder(imageQuality); 
         var jpgData:ByteArray = encoder.encode(imageOutput); 


... y como ves le meto 0xFFFFFF a todo y nada de nada, sigue creándolo en negro. No se q hago mal.

Gracias.

Por deskarrada

18 de clabLevel



 

chrome
Citar            
MensajeEscrito el 31 Oct 2010 11:11 pm
BuenAS:

Lo he estado probando y funciona; lo que no me queda claro es si realmente copias lo que te interesa copiar. Olvida por un momento lo de codificar el BitmapData y añadelo al escenario:

Código ActionScript :

addChild(new Bitmap(imageOutput, PixelSnapping.AUTO, true));


Porque veo cosas que me despistan. Aplicas una matriz unitaria cuando dibujas sobre el BitmapData y le aplicas una transformación de color a blanco, con lo que no vas a modificar el tamaño, posición de lo copiado, y lo vas a teñir de blanco TODO:

canvasBitmap.draw(canvas, m, canvasColorTransform, null, rect);

si lo que quieres es copiar canvas en este bitmap, bastaría hacer:

canvasBitmap.draw(canva);

Más abajo, hacer otra nueva copia con un recorte, en el BitmapData "imageOutput".

Resumiendo, sería interesante, como decía, que añadas el BitmapData al escenario, y te asegures que estás dibujando primero, y recortando y copiando píxeles después, exactamente lo que te interesa. Porque el problema que comentabas, del fondo blanco al copiar, ese sí funciona perfectamente en ambas copias (draw, y copyPixels).

Un saludo.

Por Lukánicos

Claber

468 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 01 Nov 2010 12:38 am
He probado lo q has dicho, pero no hay cambios.

El caso es q el código q estoy intentando modificar es de un editor XML q compré, yo no soy un experto en as3, se bastantes cosas, pero llegados a ciertos niveles me pierdo un poco, la verdad. Esta aplicación contiene muchas classes, por lo q se hace un poco difícil saber q hace q exactamente.

Voy a intentar darte más detalles por si te pudiesen servir. Se supone q este código pertenece al editor de imágenes, el cual tiene un marco que delimita el área del que será el JPG final. Ese marco es el boundry del código q posteé ayer. El editor permite escalar la imagen y al reducirla, es inferior al área del marco, por lo que ese espacio que sobra entre la imagen reducida y los límites del marco, es el que transforma a negro. El fondo real del editor de imágenes, no es ni siquiera negro, sino a cuadros grises y blancos cómo el fondo transparente del Photoshop. Al clicar en el botón "Guardar cambios", es cuando crea el bitmapData y lo pasa al JPGEncoder.as

No se si he aportado algo nuevo o simplemente era lo q ya sabías... :)

Un saludo.

Por deskarrada

18 de clabLevel



 

chrome
Citar            
MensajeEscrito el 01 Nov 2010 08:57 am
BuenAS:

Posiblemente sea que ya "canvas" viene con el fondo en negro. Si para dibujar el canvas (las operaciones de escalar que comentas) la persona que lo programó en su momento puso el fondo opaco y negro (el 3º parámentro de BitmapData como false, y el 4º 0x00000000) a tí el canvas te llega con dicho fondo negro, y da igual si ahora, en las nuevas copias/recortes que estas haciendo pones el fondo (nuevo) en blanco, ya que el canvas que estás copiando YA LLEVA ese color de fondo. No sé si me explico :)

Intenta "explorar" dónde dibuja el contenido del canvas el código y asegúrate de que no hace lo que comento; o sea, que NO crea el canvas así:

Código ActionScript :

var canvas:BitmapData = new BitmapData(ancho, alto, false, 0x00000000);


Un saludo.

Por Lukánicos

Claber

468 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 01 Nov 2010 02:37 pm
Muy buena idea, voy a ver si encuentro dónde crea el canvas por primera vez.

Muchas gracias.

Por deskarrada

18 de clabLevel



 

chrome
Citar            
MensajeEscrito el 01 Nov 2010 05:06 pm
Q FUERTEEEEEEEEEE!!!! Los siento muchísimo... Estaba todo bien desde el principio, osea el código q posteé al principio funciona sin problemas. El q me estaba liando era yo q confundí las carpetas. Como trabajo con las del cliente y las mias de prueba, estaba modificando en unas y visualizando donde no tocaba del servidor...

Siento mucho haberos hecho perder el tiempo..., lo cierto es q llevo muchas horas extra curradas de noche y, buebno, aunq nunca me había pasado algo así, supongo q estas cosas pasan. Hay q descansar más y currar más despejado...

Lo dicho, gracias por la ayuda y perdonar mi descuido.

Un saludo

Por deskarrada

18 de clabLevel



 

chrome
Citar            
MensajeEscrito el 01 Nov 2010 05:18 pm
BuenAS:

He estado probando el código que has puesto y nada, no me sale borde negro por ningún sitio. Las referencias a otras clases que faltan me las he suplido yo por lo que imagino que si es alguna de ellas la que mete este fondo negro da igual lo que haga.

Imagino que utilizas Flash Pro. Crea un punto de ruptura en el método "loadComplete" y compila en modo debug (Ctrl + May. + Intro) y sigue el rastro a "canvas" (Alt + F5; Alt + F6 para entrar a un método). Por lo que puedo intuir, me da que debe de ser el código que hace el rescalado de la imagen que comentabas el que puede estar añadiendo el fondo negro; porque imagino que drawThumbBoundary crea instancias de "DashedBox" que son los thumbnails (imágenes pequeñas para el menú de selección, imagino) y este no debe de ser.

Un saludo.

Por Lukánicos

Claber

468 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 01 Nov 2010 05:19 pm
...pues nada, olvida este último post, lo he escrito mientras escribías el tuyo :).

Por Lukánicos

Claber

468 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 01 Nov 2010 06:45 pm
Perdona q te haya hecho currar..., me sabe fatal.

Muchas gracias.

Por deskarrada

18 de clabLevel



 

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.