Java Updating Small Circles

Question

I need to display a large number (500+) of small circles on a form to simulate LEDs. However, these circles need to be quite small, around 8 or 9 pixels diameter.

So far, in my testing, I've put together some code that creates an Led class that uses a Shape (Ellipse2D.Double) and displays it directly on the JFrame from the JFrame's paint method.

This has led me to two observations/issues:

1) Firstly, unless there is an alternate method, Java appears to have trouble in drawing small circles. They appear to 'break' in the lower right corner with a pen width of default (or 1 pixel), which cuts this part off leaving a deformed circle. If there any way I can draw (lots of) small circles and have them look right?

2) My subclassed JFrame overrides the paint method to draw these 'leds', although calls the super.paint as well to ensure the JFrame gets drawn. However, I'm seeing that it rarely draws the led on the first appearance, or when the form is moved off-screen and back, or when an application it put in front and moved away again, and the only time the paint method is called is when I minimize/maximize the form. Shouldn't paint be called every time the form needs painting?

Answer 1

You shouldn't override paint(). Use paintComponent() instead. Also, JFrames are slightly strange things, I'd use JPanel as my BaseClass.

About your observation: Might this be caused by antialiasing? Did you try to turn antialiasing off via setRenderingHints()?

EDIT: After the comment below, I've written a small test program. Circles look nice with this:

import javax.swing.*;
import java.awt.Graphics2D;
import java.awt.Graphics;
import java.awt.Dimension;
import java.awt.RenderingHints;

class Test extends JFrame {

    public Test() {
        setContentPane(new JPanel() {
                public void paintComponent(Graphics g){
                    super.paintComponent(g);
                    Graphics2D g2d = (Graphics2D) g;
                    g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
                    for (int i = 0; i < 500; i++){
                        int x = (int) (Math.random() * getWidth());
                    int y = (int) (Math.random() * getHeight());
                    g.fillOval(x,y,8,8);
                    }
                }
        });
    }

    public static void main(String[] args){
        Test t = new Test();
        t.setSize(new Dimension(640, 480));
        t.setVisible(true);
    }
}

Answer 2

I've been banging my head against this issue for a while, with similar results to those described here, when I finally was tipped off to the fact that fillOval() does a much better job achieving roundness than either drawOval() or Ellipse2D. The following slightly hacky approach got me what I needed:

g2d.setColor(Color.black);                    
g2d.fillOval((int)x, (int)(y - w / 2), (int)w, (int)w);
g2d.setColor(Color.white);           
g2d.fillOval((int)x+1, (int)(y - w / 2)+1, (int)w-2, (int)w-2);

Answer 3

These LEDs should be Components like everything else on the form. I think you should use Icons, maybe ImageIcons, to represent your LEDs. That way, you can essentially have them rendered once and after that the same image will be displayed whenever needed. It's handy that you can use images, because then you can use an image that has exactly the shape you'd like to see.

Answer 4

As far as the 'break' goes, I would look at the bevel setting of your graphics object.

But, I would recommend reading a .png at program start and then displaying that instead of drawing it on your own.

---

RE: paint() not being called all the time.

Yep, thats how it works. If you need your component to be redrawn at a certain time, you need to force it. Call repaint() to force a redraw.

If you a going to call repaint() from another thread, (ie. a timer thread), be sure to wrap the call in SwingUtilities.invokeLater():

SwingUtilities.invokeLater( new Runnable()
{
    @Override
    public void run()
    {
        myForm.repaint();
    }
} );

---

Update: maybe you should post some code... I threw together a small test app and didn't see any problems with small circles.

public class MyPanel extends JPanel
{
    public void paint(Graphics _g)
    {
        Graphics2D g = (Graphics2D) _g;

        g.setStroke( new BasicStroke(1f, BasicStroke.CAP_ROUND, BasicStroke.JOIN_ROUND) );
        for(int x = 10, w = 1; w < 20; x += w*2, w++)
        {
            Ellipse2D.Double ed = new Ellipse2D.Double(x, 10, w, w);
            g.fill( ed );
        }

        for(int x = 10, w = 1; w < 20; x += w*2, w++)
        {
            Ellipse2D.Double ed = new Ellipse2D.Double(x, 80, w, w);
            g.draw( ed );
        }
    }

    public static void main(String[] args)
    {
        JFrame frame = new JFrame();
        frame.add( new MyPanel() );
        frame.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
        frame.setSize( 400, 400 );

        frame.setVisible( true );
    }
}

I tried varying the stroke params to see if I could cause a visual break, but was unsuccessful. What do you see?

---

Not to beat a dead horse, but when I zoom into the output of that program, my circles are pretty much symmetric, minus a little pixel turd on the left:

Is this similar to what you are getting?