I am running into few issues with using blit function and wanted to check what is that I am doing incorrect. Basically, I am trying to overlay images. I am working on an app, where in photo frames can be applied over the user's pictures. Also in the UI, I provide
the users to pan/zoom and scale their image inside the frame, so that they can scale and position it as they need.
In order to do this:
1) First I am loading the frame image from the app resources and create a WritableBitmap (frameWB) and using the decoder/encoder, I scale it fit my frame size.
2) I create an empty WritabeBitmap, same size as the frame loaded in step1 and use the following code:
WriteableBitmap destWB = frameWB.Clone();
3) Load the user image, set the BitmapTransform to apply the correct scale and create a InMemoryRandomAccessStream (memStream) and from it, I create the WriteableBitmap and apply rotation as below:
WriteableBItmap wb = new WriteableBitmap(1, 1);
wb = await WriteableBitmapExtensions.FromStream(wb, memStream);
wb = WriteableBitmapExtensions.RotateFree(wb, ct.Rotation, false); // ct is my images CompositeTransform
4) I am using the Blit function to overlay my scaled image in the empty transparent bitmap (destWB) that I created in step 2 as below:
Rect sourceRect = new Rect(0, 0, wb.PixelWidth, wb.PixelHeight);
Point pt = new Point(0, 0);
pt.X = (destWB.PixelWidth - wb.PixelWidth) / 2.0 + ct.TranslateX;
pt.Y = (destWB.PixelHeight- wb.PixelHeight) / 2.0 + ct.TranslateY;
Rect destRect = new Rect(pt, new Size(wb.PixelWidth, wb.PixelHeight));
destWB.Blit(destRect, wb, sourceRect, WriteableBitmapExtensions.BlendMode.Alpha);
5) Now finally, I overlay the outer frame bitmap over the destWB as below:
Rect rect = new Rect(0, 0, destWB.PixelWidth, destWB.PixelHeight);
destWB.Blit(rect, frameWB, rect, WriteableBitmapExtensions.BlendMode.Alpha);
The final result is composite image of user image and frame. But this final image has some artifacts around the areas where the inside image and frame get overlaid. Also I notice some the flowers in the outside frame, which are pink in color change to blue.
I wish I could attach some image to show the exact problem. Is there anything I am doing wrong or any known issues around blitting transparent images?
Feb 9, 2013 at 12:06 AM
Edited Feb 9, 2013 at 4:08 AM
Updating the code to get the Pixel data and saving BGRA format also didn't fix it.