I create a WriteableBitmap object, draw a line and try to set it as the source to an Image control. For some reason, the program stops responding and then closes 5 seconds later when I try to set the Source. Anyone have any idea what's wrong? (I am also using WriteableBitmapEx)
WriteableBitmap bit = new WriteableBitmap(400, 400, 96, 96, PixelFormats.Bgr32, null);
WriteableBitmapExtensions.DrawLine(bit, 10, 10, 300, 300, Core.PrimaryColor.ColorValue);
ImageCanvas.Source = bit; // Sets the image to our bitmap, but program crashes for some reason!
When I try your code, it throws an ArgumentException saying
The input WriteableBitmap needs to have the Pbgra32 pixel format. Use
the BitmapFactory.ConvertToPbgra32Format method to automatically
convert any input BitmapSource to the right format accepted by this
class.\r\nParametername: writeableBitmap
Hence this works:
var bitmap = new WriteableBitmap(400, 400, 96, 96, PixelFormats.Pbgra32, null);
WriteableBitmapExtensions.DrawLine(bitmap, 10, 10, 300, 300, Colors.Black);
image.Source = bitmap;
UPDATE: As noted by Anders, you should perhaps use the portable bitmap factory method provided by WriteableBitmapEx to create your bitmap:
var bitmap = BitmapFactory.New(400, 400);
WriteableBitmapExtensions.DrawLine(bitmap, 10, 10, 300, 300, Colors.Black);
image.Source = bitmap;
Related
I have a WPF app which saves out a thumbnail image as png. The code works well enough but when I open the image is very blurry. The image that it grabs comes from the canvas itself. The canvas changes its width and height depending on the image I'm loading. The desired thumbnail size will be 200 x 200 (pixels).
Here is my code
public void CreateThumbail(Canvas canvas, string filename)
{
RenderTargetBitmap rtb = new RenderTargetBitmap(
(int)canvas.ActualWidth,
(int)canvas.ActualHeight,
96, //dip X
96, //dpi Y
PixelFormats.Pbgra32);
rtb.Render(canvas);
PngBitmapEncoder pngImage = new PngBitmapEncoder();
pngImage.Frames.Add(CreateResizedImage(rtb, 200, 200, 0));
using (var filestream = System.IO.File.Create(filename))
{
pngImage.Save(filestream);
}
}
private static BitmapFrame CreateResizedImage(ImageSource source, int width, int height, int margin)
{
var rect = new Rect(margin, margin, width, height);
var group = new DrawingGroup();
RenderOptions.SetBitmapScalingMode(group, BitmapScalingMode.HighQuality);
group.Children.Add(new ImageDrawing(source, rect));
var drawingVisual = new DrawingVisual();
using (var drawingContext = drawingVisual.RenderOpen())
drawingContext.DrawDrawing(group);
var resizedImage = new RenderTargetBitmap(
(int)rect.Width, (int)rect.Height,// Resized dimensions
96, 96, // Default DPI values
PixelFormats.Pbgra32); // Default pixel format
resizedImage.Render(drawingVisual);
return BitmapFrame.Create(resizedImage);
}
I saved out the image before I resize it and it looks crisp and sharp. yet when I save out the thumbnail it's ugly and blurry. What am I doing wrong? Am I over-engineering this? Many thanks in advance.
Probably you need to respect the original dimensions of the image. For instance an image that is 400x400 will downscale to 200x200 quite nicely, but an image that is 235x235 will not.
This doesn't consider images that are not square to begin with.
You might try reducing the image height and width by a good factor (I would start by halving) repeatedly until the image is smaller than 200x200 and then padding it with white or transparent.
Image processing can be quite hard. It's not something I'm an expert in either so I'd probably try a 3rd party library like this one I just found on google: https://imageprocessor.org/
Alright , i am trying to merge two images(superimpose one image on top of another) using writeablebitmapex library's blit method. And after applying the blit all i am getting is a transparent image with no content.
I would like to superimpose the curtain image on top of the window image.
Source Code :
WriteableBitmap photoWriteableBitMap = await new WriteableBitmap(1,1).FromContent(new Uri("ms-appx:///Curtain1.jpg"));
WriteableBitmap frameWriteableBitMap = await new WriteableBitmap(1, 1).FromContent(new Uri("ms-appx:///Window1.jpg"));
var merge = new WriteableBitmap(750, 750);
merge.Blit(new Rect(0, 0, 100, 100), photoWriteableBitMap, new Rect(0, 0, photoWriteableBitMap.PixelWidth, photoWriteableBitMap.PixelHeight));
merge.Blit(new Rect(0, 0, 200, 200), frameWriteableBitMap, new Rect(0, 0, frameWriteableBitMap.PixelWidth, frameWriteableBitMap.PixelHeight));
// Assign the merged writeable bitmap to the image source.
imgMain.Source = merge;
Expected Image :
Actual Image :
Please let me know what i am doing wrong.
I have found an answer to my solution in case anyone stumbles upon here.
First thing , I was unnecessarily trying to include an extra bitmap(merge) for the desired output.
All I had to do was apply the blit on the window image and set the source and the destination rectangles appropriately.
Below is the final code which works for me ,
WriteableBitmap photoWriteableBitMap = await new WriteableBitmap(1, 1).FromContent(new Uri("ms-appx:///Curtain1.jpg"));
WriteableBitmap frameWriteableBitMap = await new WriteableBitmap(1, 1).FromContent(new Uri("ms-appx:///Window1.jpg"));
frameWriteableBitMap.Blit(new Rect(300, 100, 250, 200), photoWriteableBitMap, new Rect(0, 0, photoWriteableBitMap.PixelWidth , photoWriteableBitMap.PixelHeight));
This is how my final image looks :
I'm trying to write a simple program in WPF where the entire window is taken up by an image whose source is a WriteableBitmap that I draw. Here is the relevant code:
var image = m_Window.CustomImage;
image.Source = new WriteableBitmap(
(int) image.ActualWidth,
(int) image.ActualHeight,
300,
300,
PixelFormats.Bgra32,
null
);
but when I run this I get System.ArgumentException: Value does not fall within the expected range on the constructor. Frustratingly it does not say which value is incorrect. I have tried googling but there have been precious few examples of a WriteableBitmap constructor, and those that do exist are what generated the above code in the first place. Any advice?
The problem is that the ActualWidth and ActualHeight properties of image are 0, which will cause the ArgumentException.
Try setting the values of the values of the pixelWidth and pixelHeight properties to positive integers and see if the exception goes away.
image.Source = new WriteableBitmap(
300,
300,
300,
300,
PixelFormats.Bgra32,
null
);
I am currently converting a Silverlight application into WPF. In my silverlight application I have the code
WriteableBitmap sceneBitmap = new WriteableBitmap(scene, new TranslateTransform() { Y = 10 });
WriteableBitmap newone = TimelineMainHelper.CropImage(sceneBitmap, 0, 0, sceneBitmap.PixelWidth, sceneBitmap.PixelHeight - 25);
newone.Invalidate();
img.Source = newone;
Where scene is a control.
When putting this into WPF there are no overloads for the writeablebitmap class which take UIElement and Transform as the parameters. Firstly I was wondering why this is? and secondly I was wondering if there was a way getting a control to a writeablebitmap
Instead you will want to use RenderTargetBitmap and CroppedBitmap I believe:
RenderTargetBitmap rtb = new RenderTargetBitmap((int)scene.ActualWidth, (int)scene.ActualHeight, 96, 96, System.Windows.Media.PixelFormats.Pbgra32);
rtb.Render(this.sceneBitmap);
CroppedBitmap crop = new CroppedBitmap(sceneBitmap, new Int32Rect(0, 0, (int)sceneBitmap.ActualWidth, (int)sceneBitmap.ActualHeight));
Then you can do something like:
System.Windows.Controls.Image img = new Image();
img.Source = crop;
And go from there.
Disclaimer:
You may need to use different overloads and what not to do exactly what you wish. I just took a shot guessing what parameters to pass given your snippet.
I tried to blit two writeablebitmap.
However, the debugger prompted a error message stating the followings:
The input WriteableBitmap needs to have the Pbgra32 pixel format. Use the BitmapFactory.ConvertToPbgra32Format method to automatically convert any input BitmapSource ?to the right format accepted by this class.
Here is my code.
Rect cRect =new (320,240);
WriteableBitmap _bitmap = new WriteableBitmap(320, 240, 96, 96, PixelFormats.Bgr32, null);
_bitmap.WritePixels(new Int32Rect(0, 0, 320, 240), _image, 320*240, 0); //_image is a image stream
_bitmap.Blit(cRect, _imageFrame, cRect); //_imageFrame is another writeablebitmap
Actually _imageFrame is a WriteableBitmap from a canvas which will change its content at regular time. Is there a more effective way to blit a writeablebitmap and a canvas?
Can you change to this line:
WriteableBitmap _bitmap = new WriteableBitmap(320, 240, 96, 96, PixelFormats.Pbgra32, null);
and something similiar on the _imageFrame WriteableBitmap