Sign in to follow this  
aphillips

new Clear Background plugin (was infer transparency)

Recommended Posts

Please find attached a beta version of my new "Clear Background" plugin. This was discussed in the "infer transparency" thread in this forum but I thought this name was better. It tries to recreate a transparent background for an antialiased image which has been rendered onto a plain (single colour) background. Please try it and tell me what you think.

This plugin addresses the problem where the alpha channel of an image has been lost and needs to be recovered. I was creating some icons for my hex editor (see http://www.hexedit.com) and I had many icons with antialiased edges that had been rendered on a white background. This plugin does not always give perfect results but it can make a 20 minute job into a 2 minute one, which can save a lot of time if you have hundreds of images to fix. Note that the plugin makes it easy to extract images (such as toolbar icons) from commercial software, but please do not use it to infringe copyrights.

I have called the plugin "Clear Background" as the whole point of it is to make a transparent background. I have placed it on the "Color" sub-menu as it is related to the "Color to Alpha Advanced" plugin there.

Here are a few tips on its use.

First, the pixels that are made completely transparent must all exactly match the chosen color. (I may add a tolerance in the future.) You should use a flood fill first if you have a slightly shaded background.

Also, nicely designed icons usually have antialiased edges at angles but do not use transparency at all for straight (horizontal and vertical) edges. In this case you can "deselect" these areas to make sure they are not made transparent. In fact it is usually a good idea to select just the areas you want to be changed. The magic wand, with an appropriate tolerance, is great for this. You may still have to do a little bit of manual adjustment to get all of the edges that have been obviously antialiased.

Some icons have holes in the image where the background shows through. This is the purpose of the "check for holes" option. However, there can also be parts of the "foreground" image that use the background color. Again, it is a good idea to use the selection to tell the plugin which parts are holes and which parts should not be touched.

Finally, don't forget to try the "By distance" option. I thought that the "By Color" option would give better results but testing revealed otherwise.

There are some obvious places for improvement. First, the dialog could do with a color selection control (as in other plugins) to select the background color, but I have not worked out how to add one. The "edge width" would also be better as a slider rather than having to enter a floating point number.

I have also found that it would be useful to be able to preview the result with various background colors before clicking OK. This would make it much easier to find the right value for "edge width".

There may also be room to improve the algorithm I use to set the color and transparency of the "edge" pixels. Anyone is welcome to the source code if they want to try and improve it.

--------------------

Here is an example. I did a screen capture and extracted the Paint.Net zoom toolbar button image. As this had a slightly shaded background I filled the background using a background pixel near the middle (RGB=249,249,249). Then I ran the effect with an edge width of 1.2 using both the By Distance and By Color options.

Before.png

Image before effect applied.

ByColor.png

Clear Background effect using By Color option

ByDistance.png

Clear Background effect using By Distance option

ClearBackgroundPlugin.zip

Share this post


Link to post
Share on other sites

You might want to include a screenshot and examples in your first post so that people will know if they want to download it.

Share this post


Link to post
Share on other sites

Why in the world aren't you using IndirectUI :?: :?: (derive from PropertyBasedEffect, instead of Effect)

It can handle radio buttons, checkboxes, and your floating point value just fine. No need to write a custom token or dialog.

Also, the performance is veeeeerrrrrrrryyyyyyyyyy slow. Core 2 Quad 2.4GHz. Takes about 5 seconds before the dialog even shows up on a 1920x1200 image. Are you doing all your rendering in OnSetRenderInfo()? From the description of your algorithm, you can probably do your work in OnRender() just fine.

Share this post


Link to post
Share on other sites

On a more positive note, Paint.NET v3.5 handles this plugin much better since the UI thread does not block on things like OnSetRenderInfo(). Dialog popped up instantly.

Share this post


Link to post
Share on other sites
Why in the world aren't you using IndirectUI :?: ...

Thanks for the feedback. I have seen mention of IndirectUI but couldn't find any info on how to use it. I searched a few times in these forums and on Google. Actually, I couldn't really find much info about writing plugins at all, but found a template and just enough info to be dangerous.

Also, the performance is veeeeerrrrrrrryyyyyyyyyy slow. ... Are you doing all your rendering in OnSetRenderInfo()?

OnSetRenderInfo does do a bit of "global" work trying to find the edge of shape(s), but I believe I defer as much as I can to the Render calls. I didn't notice a speed problem, but I only tested on small images (biggest was 16 x 300). I haven't optimized for speed yet but I don't believe it is doing anything too inefficiently.

Share this post


Link to post
Share on other sites
Thanks for the feedback. I have seen mention of IndirectUI but couldn't find any info on how to use it. I searched a few times in these forums and on Google. Actually, I couldn't really find much info about writing plugins at all, but found a template and just enough info to be dangerous.

Do you have Reflector? http://www.red-gate.com/products/reflector/

Point it at PaintDotNet.Effects.dll and check out the code for the built-in effects. You can define properties, specify which control template to use (e.g. a "double" property can have a slider or an "angle" control), localization, and even rules/constraints as a primitive form of data binding ("if property X is true/false, then make property Y enabled/disabled").

Share this post


Link to post
Share on other sites

Rick,

Thanks for noticing the performance problem. I just got home and did some tests and immediately found that OnSetRenderInfo is being called 5 times when the dialog starts up. (Some of the control init is firing events that are causing FinishTokenUpdate() to be called.)

I'll fix that and perhaps add some other performance tweaks.

Share this post


Link to post
Share on other sites

oh, this is cool, i was using color to alpha advanced or isolate lineart(then recolor it)

i just wish it would work on other colors then just white and black ;P

im not sure y but i always need to do it so thx xD

Share this post


Link to post
Share on other sites

oh, this is cool, i was using color to alpha advanced or isolate lineart(then recolor it)

i just wish it would work on other colors then just white and black ;P

im not sure y but i always need to do it so thx xD

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this