Gradient GIF Resolution Loss

GoDiagram (6 and previous)
1

I am building a tool that allows users to import their own .gif’s to be used in their GoDiagram. I’ve noticed a minor problem that occurs when a gif that has a gradient effect is imported in GoDiagram. The problem being, the resolution of the gif seems to drop which causes the gradient of the gif to become pixelated (i.e. the gradient loses it’s gradual-change effect).

To be clear here, the original gif that has a gradient looks fine - it’s only when it’s imported into GoDiagram does the gradient become distorted.

Is there a setting somewhere in GoDiagram (or elsewhere) that I need to set? Or, is this normal and “unfixable” behavior?

Here is an example of the original .gif and the .gif after it is imported into GoDiagram:

Original Version:


GoDiagram Version:

2

Here’s what I see, with the default settings for GoView.InterpolationMode and other similar graphics quality hints:

That looks fine to me. (This screenshot is a PNG file.)
So I don’t know what’s different about your configuration.

3

Thanks for the feedback. You helped me narrow down my problem.

For the forum’s sake:

My problem is due to the way I am importing the gif. Here’s the basics of the code that I have:

{
//Get the image from the user
Image image = Image.FromFile(this.openFileDialog.FileName);
…
…
…
//Set the MultiPortNode.ActiveImage
iNode.ActiveImage = image;
}

To troubleshoot the problem I’m having, I added the line:

Console.WriteLine("Pixel format size is " + Image.GetPixelFormatSize(image.PixelFormat));

The return value of GetPixelFormatSize(image.PixelFormat) is “8”. Which, seems to me, is the root of my gif banding problem.

Unfortunately, the Image class doesn’t have support for setting the Pixel Format Size (in C# .NET). If anyone has info on how I can set the imported image to a ColorDepth=32px, I’m all ears.

Thanks.

4

Just for the record: I have no idea what I’m talking about :\

More troubleshooting shows that a PixelFormat of 8 is “good enough” for the gradient support that I’m looking for.

5

If you create a new WinForms project containing a GoView, and on load do the following:
GoImage img = new GoImage();
img.Name = @“AirCooledHeatExchanger.gif”;
goView1.Document.Add(img);
Which visual result do you get?

6

I did as you asked and the .gif turns out perfect - no banding at all.

So, I’m confident that this is a deve’r error and not an issue w/ Go.

However, I’m getting more confused with my app’s banding problem the more troubleshooting I do.

For example: The head scratcher that I’m dealing with as of now is, if I set my GoView’s background image with the same .gif as the one that is having a banding problem (via Document.Add()), the background gif has no banding problems.

Here’s a screenshot from my app:


Note the upper image was added to the BackgroundImage of the GoView object and the lower image was added to the Document of the GoView object. Also, it may be worth noting that the image that was added to both the Background and the Document is the same Image object.

Any thoughts come to mind, Walter? I’m pretty much in the guess mode and outta ideas.

7

I assume you already tried different values for GoView.InterpolationMode.
I have also added two more graphics quality painting properties to GoView: CompositingMode and PixelOffsetMode. Even when I set all five of those properties to their slowest or worst quality, I still can’t get the behavior you see. Maybe it’s somehow hardware or driver dependent.

8

Yes, I’ve tried all values of InterpolationMode - to no avail.

I’ll check out CompositingMode and PixelOffsetMode (by the way, do you have documentation on what these properties do?)

I’m not sure if I was clear in my last posting on how the two images were derived - I will try again:

The white area of the screenshot is a GoView object. I then imported the .gif from a Windows directory, added the gif to a GoNode, and then added the GoNode to the GoView. This procedure created the image that has the banding issue. Next, I used the FindNode() method to find the node that I just added, grabbed the image from the node, and then set the GoView.BackgroundImage to the image that was grabbed. This procedure generated the image that does NOT have a banding issue. The head scratcher is the fact that the gif that does NOT have a banding issue was derived from a gif that DOES have a banding issue.

9

If you want to play with those Graphics properties, you’ll need to override GoObject.Paint to set those properties. You are supposed to set the properties temporarily, but for your application you could just set it and ignore the fact that you’ll be changing how other objects are painted.
public override void Paint(Graphics g, GoView v) {
g.CompositingMode = …;
g.PixelOffsetMode = …;
base.Paint(g, v);
}
Or you could override GoView.PaintObjects to do the same thing.
In looking at the definition of GoView.PaintView, I see one possible explanation. Here’s the code:

<FONT face="Courier New, Courier, mono"><FONT face=Verdana color=#000000 size=2> protected virtual void PaintView(Graphics g, RectangleF clipRect) {<BR> // draw the document paper color<BR> // (or the Control background color if document paper color is Empty)<BR> PaintPaperColor(g, clipRect);<BR> <BR> // paint any user-defined background<BR> PaintBackgroundDecoration(g, clipRect);</FONT></FONT> <FONT face="Courier New, Courier, mono"><FONT face=Verdana color=#000000 size=2> g.SmoothingMode = this.SmoothingMode;<BR> g.TextRenderingHint = this.TextRenderingHint;<BR> g.InterpolationMode = this.InterpolationMode;<BR> g.CompositingQuality = this.CompositingQuality; // new in 2.5<BR> g.PixelOffsetMode = this.PixelOffsetMode; // new in 2.5</FONT></FONT> <FONT face="Courier New, Courier, mono"><FONT face=Verdana color=#000000 size=2> // paint all the objects, both document and view<BR> PaintObjects(true, true, g, clipRect);<BR> }</FONT></FONT>
PaintBackgroundDecoration is responsible for painting the BackgroundImage. PaintObjects is responsible for painting GoObjects. Those graphics quality properties are potentially changed between the times your background image and your GoImage are painted. So that’s the only explanation that makes sense to me now.
However, TextRenderingHint doesn’t apply to images, and I thought SmoothingMode doesn’t apply to images either. You haven’t been changing the CompositingQuality and the PixelOffsetMode. And you say you have tried all the InterpolationMode values (except Invalid, I hope). So this explanation doesn’t make sense after all – something is inconsistent.

10

Could the banding problem of the gif be related to the fact that the gif is the Image of a GoIconicNode?

11

Well, this is a bit embarrassing but I thought I’d post the solution to my gif banding problem.

I didn’t mention in earlier posts, but I was adding the .gif to a GoNode wrapper class (named IONode) that I wrote - IONode derives from GoNode.

In the IONode I have an ImageList that acts as a storage location for all the images that can be used in my IONode object. I am creating the ImageList programatically and in doing so I forgot to define the ColorDepth. Once I set the ColorDepth to 16bit, the banding in the .gif went away. All is fine now. Ouch!

Thanks Walter for all your replies. Your input was very helpful.