Keith Walker

Images and DPI in WPF

I've been working on a WPF application that manipulates and renders a load of images, and came across an interesting fact that I felt compelled to share!

By default WPF renders at 96dpi (I know this can be changed in the OS, but lets not get into that now!), so when supplying an image with a differing dpi WPF will scale the image back to 96dpi while maintaining the original size!

 

The Problem

Example:

ImageA.png @ 72dpi W=720px H=720px (10in x 10in)

When displayed in WPF...

ImageA.png @ 96dpi = 960px x 960px (10in x 10in)

and

ImageB.png @ 300dpi W=600px H=600px (2in x 2in)

When displayed in WPF...

ImageB.png @ 96dpi = 192px x 192px (2in x 2in)

 

So in essence an image with a dpi less than 96 will appear larger than the original pixel resolution, therefore dpi’s greater than 96 will appear smaller!

This was causing me real problems as the images I consume are of varying DPI's, and I wanted to maintain the original pixel resolution on screen.

(Ok, so this is not really a problem as such as WPF is doing exactly what it should do, this only becomes a problem if you want to maintaining the original pixel resolution of the image)

The Solution

Well, kind of....

There is a property which can help you in the WPF world to overcome this issue, and this is the Stretch property of the Image.

Set width and height to the PixelWidth and PixelHeight of the image and set the Stretch property to Uniform, the images will now appear in WPF at exactly the same pixel resolution as the original images!

The reason I say "Well, kind of...." is - I'm still investigating whether WPF scaling the images to 96dpi, then me Stretch(ing) it back to the original pixel resolution is a lossless process or not (esp when dealing with high dpi images) I'll post back if and when i get an answer to this!

Comments

No Comments