Reduce Image resolution in WPF image control

Question

I have a image control in WPF. I need to reduce the image size control width and height. But when i Do that , the image is not looking good. The data loss is more.

So i thought to reduce the image resolution instead of just changing the image control width and height.

can any one help me how to change the image resolution of the binded image in WPF image control

[I mean image is already binded to image control now I have to the change the resolution only]

Answer 1

In .NET 4 they changed the default image scaling to a low quality one...so you can use BitmapScalingMode to switch back to the higher quality one:

<Image RenderOptions.BitmapScalingMode="HighQuality"
       Source="myimage.png"
       Width="100"
       Height="100" />

• http://10rem.net/blog/2010/05/01/crappy-image-resizing-in-wpf-try-renderoptionsbitmapscalingmode

You can also combine the above with other options like the Decode options if your source image is a huge image (this just reduces memory usage in your application).

• http://www.shujaat.net/2010/08/wpf-saving-application-memory-by.html

other options to prevent "blurryness" is to put UseLayoutRounding="True" on your root element (i.e. Window)....it's recommended to use this in .NET 4 rather than SnapToDevicePixels:

• When should I use SnapsToDevicePixels in WPF 4.0?

• http://blogs.msdn.com/b/text/archive/2009/08/27/layout-rounding.aspx

Answer 2

You can use the DecodePixelWidth property like this:

<Image Stretch="Fill">
    <Image.Source>
        <BitmapImage CacheOption="OnLoad" DecodePixelWidth="2500" UriSource="Images/image.jpg"/>
    </Image.Source>
</Image>