I have a custom node where I'm trying to simply draw a 16 x 16 icon in a 16 x 16 ImageComponent, and it becomes fuzzy. Measure unit is pixels, and the DPI of the Image is set to the screen's DPI.

I assume this is due to a resizing being done by the IGraphics wrapper for Graphics. This is fine when it's necessary, for example if the user has zoomed in or out, then resizing is needed. But when there is no zoom and I know the image size and the bounding box size are the same then I can't understand that a resize is apparently being done anyway.

Anyway, to avoid this problem, is it possible to bypass the IGraphics wrapper and get directly to the Graphics object instead? Or do you have another suggestion?

Thanks.

Thanks for your answer.

> Better check if the coordinates you draw the image at are integer.

Yes, "that is where the dog is buried", as they say in Danish.

This is an ImageComponent nested several levels down inside StackPanels inside a CompositeNode. When I looked at base.Bounds in the ImageComponent, X is an integer but Y is 4.5.

So I created a new bounds Rectangle containing only integers and used that with the Graphics.DrawImage() method. The icon became less fuzzy, but was still not being rendered pixel-for-pixel.

I think maybe the Graphics object is itself anchored at a non-integer origin, although I can't see that - it says RenderingOrigin X = 20, Y = 20. But it also says ClipBounds X = -52.5, Y = -36.

In desperation I've tried setting

sysGraphics.InterpolationMode = InterpolationMode.NearestNeighbor;
sysGraphics.SmoothingMode = SmoothingMode.None;

This resulted in a non-fuzzy rendering, but for some crazy reason the left-most column of pixels is gone, i.e., the icon is now 15 x 16 instead of 16 x 16.

I'm thinking the various StackPanel components in the CompositeNode are not being layed out on pixel / integer boundries. Is there some way to force that to happen? And how can I see these bounds? In the debugger they always seem to be 0, 0.

I realize that if the user zooms in or out that all bets are off, and that's OK. But I would like to have the icons rendered 100% pixel-for-pixel when no zooming has been applied.

Hope you have another good suggestion. Thanks.

Thank you very much for your help. I finally got it to work.

I'd hate to admit how many hours I've used on this silly little problem. So I'd like to suggest a possible improvement for a future version: some kind of property for CompositeNode or StackPanel and ImageComponent that specifies

LayoutPixelOnly = true;

or

LayoutGranularity = 1.0;

or something similar, so you can use the default automatic layout (which is a good feature) but avoid the fuzzy graphics that occur when ImageComponents get placed on non-integer locations.

Thanks.

Edit:

Thinking about this, shouldn't this simply be the default way for component layout to work when measure unit = pixels? Then you don't need to add an option.

Edit 2:

The more I think about this, the more I think this should simply be considered to be a bug. An ImageComponent at a non-integer pixel location - what is that supposed to mean? It guarantees that the image will be blurry, and I can't think of what service it provides?