How to avoid anti-aliasing in WPF?

Question

In a WPF application which currently being developed, user is able to draw lines on canvas and of course after saving it, he can see few different file formats (as output e.g. JPEG and a proprietary file format). This works fine but the JPEG version should be cropped and when this cropping happens, the top side of the object is copped with few extra pixels.

In the code we have used an anti-aliasing setting:

EdgeMode.Aliased;

Base on System.Windows.Media.EdgeMode

See it below. Now, when this is commented out things workout well so no problem with cropping however, the lines get rendered with sharper edges which it is not acceptable.

Has anybody been exposed to this issue? if so, what is the solution or workaround this issue?

#region Assembly PresentationCore.dll, v4.0.0.0
// C:\Program Files (x86)\Reference Assemblies\Microsoft\Framework\.NETFramework\v4.5\PresentationCore.dll
#endregion

using System;

namespace System.Windows.Media
{
    // Summary:
    //     Determines how the edges of non-text drawing primitives are rendered.
    public enum EdgeMode
    {
        // Summary:
        //     No edge mode is specified. Do not alter the current edge mode of non-text
        //     drawing primitives. This is the default value.
        Unspecified = 0,
        //
        // Summary:
        //     Render the edges of non-text drawing primitives as aliased edges.
        Aliased = 1,
    }
}

Thank you

enter image description here

I've been using WPF and image processing for some time, and I can highly recommend to use System.Drawing.Bitmap instead of the WPF images as a base. Just use the WPF images as a presentation layer, or convert it into a Drawing.Bitmap. It's just so much easier to work with. It doesn't answer your question, but you could perhaps consider rewriting it to avoid the problem. — AkselK, Nov 07 '13 at 17:53
@MikeStrobel please see the jpeg file I have added to my question — amit kohan, Nov 07 '13 at 18:07

score 2 · Answer 1 · edited May 23 '17 at 12:29

Try setting SnapsToDevicePixels to True on your images or rather root element may be on your window in case you want that property to be automatically inherited by all your UIElements.

From MSDN -

The WPF graphics system uses device-independent units to enable resolution and device independence. Each device independent pixel automatically scales with the system's dots per inch (dpi) setting. This provides WPF applications proper scaling for different dpi settings and makes the application automatically dpi-aware. However, this dpi independence can create irregular edge rendering due to anti-aliasing. These artifacts, commonly seen as blurry, or semi-transparent, edges can occur when the location of an edge falls in the middle of a device pixel rather than between device pixels. To address this issue, WPF provides a way for object edges in a visual tree to snap, or become fixed, to device pixels through pixel snapping, eliminating the semi-transparent edges produced by anti-aliasing.

Also you might to check out this link here at SO describing many more other options in detail like -

Set UseLayoutRendering to true on images.
Set RenderOptions.BitmapScalingMode to NearestNeighbor.

thank you for your comment. I'm not showing the JPEG file in XAML instead it will be viewed by other tools out of the applcation so can I still use SnapsToDevicePixcels? — amit kohan, Nov 07 '13 at 19:03
Yes, just set those properties on the Canvas or one of its ancestors. — Mike Strobel, Nov 07 '13 at 19:24
SnapsToDevicePixels="True" and RenderOptions.BitmapScalingMode="NearestNeighbor" were enough for me — Francesco B., Feb 21 '23 at 08:46

Mike Strobel · Answer 2 · 2013-11-07T17:54:31.037

In oversimplified terms, antialiasing works by blending nearby pixels to mitigate jagged edges. In the case of your lines, you can expect a couple of pixels around the edges of the lines to be partially blended with the edge. They probably have reduced opacity, but there is something there; they are not "extra" pixels in the sense that they do have content.

If you post the code used to save the visual to an image, I might be able to help you adjust the clipping to be more rigid. Note, however, that this will likely result in artifacts like jagged lines or vertices at the edges of the image.

How to avoid anti-aliasing in WPF?

2 Answers2