using the getPixel() and SetPixel32() methods, I managed to handle the
transparency but this solution isn't pretty at all. The initial image is still
supposed to be transparent.
Here is the bit of code that "sets" the transparent pixels.
(It's in the onFrameReceptionComplete function)
Bitmap(frameImage.source).bitmapData.lock();
for (cptX = 0 ; cptX < maxX ; cptX ++)
{
for (cptY = 0 ; cptY < maxY ; cptY ++)
{
if (Bitmap(frameImage.source).bitmapData.getPixel(cptX , cptY)
== 0xF5FBFB)
{ Bitmap(frameImage.source).bitmapData.setPixel32(cptX,cptY,
0x00000000) }
}
}
Bitmap(frameImage.source).bitmapData.unlock();
For the sake of the holy deadline integrity, I applied this hack in order to
keep going but I'm sure there is a better way to answer this problem.
Any suggestion would be greatly appreciated.
cheers
--- In [email protected], "ouaqa" <abenef...@...> wrote:
>
> good morning fellow flexers.
>
> I've been struggling for the last 3 days with a very frustrating problem.
>
> In a photo manipulation project, I use a canvas where I handle images.
> So, an image is displayed in a canvas and I want to add a new image on top of
> it, let's say a cool wood-looking frame. The first image is a jpg embedded
> but the second image, the frame, is a transparent 32bits png file loaded on
> demand.
> The png file is transparent, as far as I can tell in photoshop. Yet, when I
> load it, all the transparent bits appear white.
>
> This problem is making me crazy and I don't know how to handle it. Any help
> would be appreciated.
>
> Bellow are parts of my code :
>
> In the canvas handling the images :
>
>
> ->loading the image
> public function setImageFrame (AnImageSource : String) : void
> {
>
> var request:URLRequest = new URLRequest(AnImageSource);
> frameImage = new Image() ;
> frameImage.addEventListener(Event.COMPLETE, onFrameReceptionComplete) ;
>
> frameImage.load(AnImageSource);
>
> }
>
> -> Adding the loaded image to the canvas
> private function onFrameReceptionComplete (event : Event) : void
> {
> var bounds : Rectangle = new Rectangle(0,0,this.width,this.height);
>
>
>
> var rawFrame : Bitmap = Bitmap(frameImage.content );
> var rawBitmapDataFrame : BitmapData = new BitmapData (rawFrame.width ,
> rawFrame.height , true,0x00000000) ;
> rawBitmapDataFrame.draw(rawFrame) ;
>
> //display true
> trace (rawBitmapDataFrame.transparent);
> rawFrame = new Bitmap(rawBitmapDataFrame) ;
>
>
> frameImage.source = LCUtilTools.cropAndResizeImage(rawFrame , bounds);
>
> //display true
> trace (Bitmap(frameImage.source).bitmapData.transparent);
>
> frameImage.smoothBitmapContent = true;
>
> this.addChild(frameImage);
> }
>
>
> the cropAndResize function (used to resize the image to the correct ratio.
>
> public static function cropAndResizeImage (AnImage : Bitmap , ABounds :
> Rectangle) : Bitmap
> {
>
> var celluleRawBitmap : BitmapData = AnImage.bitmapData
>
> var originalWidth:Number = celluleRawBitmap.width;
> var originalHeight:Number = celluleRawBitmap.height;
> var newWidth:Number = originalWidth;
> var newHeight:Number = originalHeight;
>
>
> var scale : Number ;
> var m:Matrix = new Matrix();
>
> var scaleX:Number = 1;
> var scaleY:Number = 1;
> if (originalWidth > ABounds.width || originalHeight > ABounds.height)
> {
> scaleX = ABounds.width / celluleRawBitmap.width;
> scaleY = ABounds.height / celluleRawBitmap.height;
> scale = Math.max(scaleX, scaleY);
> newWidth = originalWidth * scale;
> newHeight = originalHeight * scale;
> }
>
> m.scale(scale,scale);
>
> var zoomArea : Rectangle ;
> zoomArea = celluleRawBitmap.rect ;
> zoomArea.inflate(ABounds.width , ABounds.height);
> var editedBitmapData : BitmapData = new BitmapData (ABounds.width ,
> ABounds.height , true ,0x00FFFFFF);
> editedBitmapData.draw(AnImage.bitmapData,m);
>
> return ( new Bitmap(editedBitmapData));
> }
>
> Any help would be really appreciated, I really don't know what to do or where
> to begin in order to solve this issue.
>