Solved

How to make edges on a transparent image smooth

Posted on 2013-06-28
3
498 Views
Last Modified: 2013-06-29
I have looked 'round the Internet and can't find an answer.  I have created a simple VS2012 project for illustration.

I have a circular bmp with white around the circle.

It looks like this after rendering; instructing the white to be transparent:

Windows 7 Start orb
Here is the code:

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles Me.Load

        Dim bmp As Bitmap = New Bitmap(My.Resources.Windows_7_Start_Orb)
        bmp.MakeTransparent(Color.White)
        PictureBox1.Image = bmp

        Dim g As Graphics = Graphics.FromImage(PictureBox1.Image)
        g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality
    End Sub

Open in new window


How do I make the edges of the graphic smooth, and discard any unwanted white bits.  I've also tried this with PNG.

Thanks!
-Geoff
0
Comment
Question by:GeoffHarper
  • 2
3 Comments
 
LVL 82

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 39286109
Basically you can't.  The problem you are seeing is that the light colored bits around the edge are technically not 'white' but usually a color in between the original white background and the color inside the image at that point.  I downloaded your image and those light colors are light blues and grays so they will not be converted to transparent by your code.

Images like that start out usually as much larger images with much higher resolution.  When they are saved in a reduced format, image software does 'anti-aliasing' which combines the background colors with the foreground colors in an attempt to make it look like it is higher resolution than it actually is.

Artifacts like those are why it is important when you creating images to take the background you want into consideration because once you reduce it and save it, you can't really take those artifacts out.

Now if you put that image on a white background in your project, those artifacts will work they way they did originally and effectively disappear.
0
 
LVL 4

Author Closing Comment

by:GeoffHarper
ID: 39286551
I appreciate very much this concise explanation you have given as I was unable to find such a thing on the Internet.

Actually, I had figured all that out (I thought) but was hoping there was some sort of "magic" possible with the Graphics class.  ;)   It confirms what I thought.

Now I just have to figure out how to make my graphic with single-color smooth edges.

Thanks!

-Geoff
0
 
LVL 82

Expert Comment

by:Dave Baldwin
ID: 39286953
You're welcome, glad to help, and thanks for the points.  Even in a good graphics editor, fixing that would be a manual process.  When you create your own graphics, you can avoid that by never combining the foreground with the back ground.  More common if you are going to use JPGs which have no transparency is to select the background to exactly match the back ground of the page that it is displayed.  For example, white background on a white page disappears.
0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Problem to setup 18 80
copyEvens challenge 6 63
copyEndy  challenge 15 58
tvirtualstringtree freeze when load too manny images 10 30
Purpose To explain how to place a textual stamp on a PDF document.  This is commonly referred to as an annotation, or possibly a watermark, but a watermark is generally different in that it is somewhat translucent.  Watermark’s may be text or graph…
Displaying an arrayList in a listView using the default adapter is rarely the best solution. To get full control of your display data, and to be able to refresh it after editing, requires the use of a custom adapter.
An introduction to basic programming syntax in Java by creating a simple program. Viewers can follow the tutorial as they create their first class in Java. Definitions and explanations about each element are given to help prepare viewers for future …
Viewers will learn how to properly install Eclipse with the necessary JDK, and will take a look at an introductory Java program. Download Eclipse installation zip file: Extract files from zip file: Download and install JDK 8: Open Eclipse and …

746 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now