Java Graphics not displaying on successive function calls, why?

Question

Hi,

I'm making a visualization for a BST implementation (I posted another question about it the other day). I've created a GUI which displays the viewing area and buttons. I've added code to the BST implementation to recursively traverse the tree, the function takes in coordinates along with the Graphics object which are initially passed in by the main GUI class. My idea was that I'd just have this function re-draw the tree after every update (add, delete, etc...), drawing a rectangle over everything first to "refresh" the viewing area. This also means I could alter the BST implementation (i.e by adding a balance operation) and it wouldn't affect the visualization.

The issue I'm having is that the draw function only works the first time it is called, after that it doesn't display anything. I guess I don't fully understand how the Graphics object works since it doesn't behave the way I'd expect it to when getting passed/called from different functions. I know the getGraphics function has something to do with it.

Relevant code:

    private void draw(){
    Graphics g = vPanel.getGraphics();      
    tree.drawTree(g,ORIGIN,ORIGIN);
}

vPanel is what I'm drawing on

private void drawTree(Graphics g, BinaryNode<AnyType> n, int x, int y){
    if( n != null ){
        drawTree(g, n.left, x-10,y+10 );
            if(n.selected){
                g.setColor(Color.blue);
            }
            else{
                g.setColor(Color.gray);
            }        
            g.fillOval(x,y,20,20);
            g.setColor(Color.black);
            g.drawString(n.element.toString(),x,y);
        drawTree(g,n.right, x+10,y+10);
    }
}

It is passed the root node when it is called by the public function. Do I have to have:

Graphics g = vPanel.getGraphics();

...within the drawTree function? This doesn't make sense!!

Thanks for your help.

Answer 1

This is not the right way of doing it. If you want a component that displays the tree, you should make your own JComponent and override the paintComponent-method.

Whenever the model (the tree / current node etc) changes, you invoke redraw() which will trigger paintComponent.

I actually don't think you are allowed to fetch the Graphics object from anywhere else than the argument of the paintComponent method.

Try out the following program

import java.awt.Graphics;

public class FrameTest {

    public static void main(String[] args) {
        final JFrame f = new JFrame("Frame Test");
        f.setContentPane(new MyTreeComponent());
        f.setSize(400, 400);
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.setVisible(true);

        new Thread() {
            public void run() {
                for (int i = 0; i < 10; i++) {
                    try {
                        sleep(1000);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                    f.repaint();
                }
            }
        }.start();
    }
}

class MyTreeComponent extends JComponent {
    public void paintComponent(Graphics g) {
        // Draw your tree. (Using random here to visualize the updates.)
        g.drawLine(30, 30, 50, 30 + new Random().nextInt(20));
        g.drawLine(30, 30, 50, 30 - new Random().nextInt(20));
    }
}

The best starting point is probably http://java.sun.com/docs/books/tutorial/uiswing/painting/index.html

Answer 2

@aioobe's approach is sound and the example is compelling. In addition to the cited tutorial, Performing Custom Painting, I would add that drawing should take place on the Event Dispatch Thread (EDT). In the variation below, note how the GUI is built using EventQueue.invokeLater. Similarly, the actionPerformed() method of javax.swing.Timer invokes repaint() on the EDT to display recently added nodes. A more elaborate example may be found here.

import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import javax.swing.*;

public class StarPanel extends JPanel implements ActionListener {

    private static final Random rnd = new Random();
    private final Timer t = new Timer(100, this);
    private final List<Node> nodes = new ArrayList<Node>();

    private static class Node {
        private Point p;
        private Color c;

        public Node(Point p, Color c) {
            this.p = p;
            this.c = c;
        }
    }

    public static void main(String[] args) {
        EventQueue.invokeLater(new Runnable() {

            @Override
            public void run() {
                JFrame f = new JFrame("Star Topology");
                f.add(new StarPanel());
                f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                f.pack();
                f.setVisible(true);
            }
        });
    }

    public StarPanel() {
        this.setPreferredSize(new Dimension(400, 400));
        t.start();
    }

    @Override // Respond to the Timer
    public void actionPerformed(ActionEvent e) {
        int w = this.getWidth();
        int h = this.getHeight();
        nodes.add(new Node(
            new Point(rnd.nextInt(w), rnd.nextInt(h)),
            new Color(rnd.nextInt())));
        this.repaint();
    }

    @Override
    public void paintComponent(Graphics g) {
        int w2 = this.getWidth() / 2;
        int h2 = this.getHeight() / 2;
        for (Node n : nodes) {
            g.setColor(n.c);
            int x = n.p.x;
            int y = n.p.y;
            g.drawLine(w2, h2, x, y);
            g.drawLine(w2, h2, x, y);
            g.drawRect(x - 2, y - 2, 4, 4);
        }
    }
}