Herong's Tutorial Notes on Swing
Dr. Herong Yang, Version 3.05, 2006

Swing JFrame

Part:   1  2  3  

(Continued from previous part...)

Drawing Graphics in Frames

Problem: I want to draw some graphics in a frame.

Solution 1: You can do this very easily by extending JFrame class to create your own frame class so that you can override the paint() method. The paint() method provides you a Graphics object, which will give you utility methods to draw various types of graphics. The following sample code, JFramePaint1.java, shows you how to do this.

/**
 * JFramePaint1.java
 * Copyright (c) 2002 by Dr. Herong Yang
 */
import java.awt.*;
import javax.swing.*;
public class JFramePaint1 {
   public static void main(String[] a) {
      MyJFrame f = new MyJFrame();
      f.setTitle("Drawing Graphics in Frames");
      f.setBounds(100,50,500,300);
      f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      f.setVisible(true);
   }
   static class MyJFrame extends JFrame {
      public void paint(Graphics g) {
         g.drawRect(20,10,100,60);
      }
   }
}

Note 1: The paint() method is inherited by JFrame class from the Component class. It will be called whenever this component should be painted.

Note 2: If you look at the rectangle displayed on the frame, you will see that the origin of the drawing coordinates is located at the top left corner of the entire frame, including the title bar.

Solution 2: Obviously, solution 1 is not so ideal, because we are drawing on the UI element of the frame itself. To draw graphics only in the content area of the frame, we can create a new component with its own paint() method and add it to the content pane of the frame. The following sample code, JFramePaint2.java, shows you how to do this.

/**
 * JFramePaint2.java
 * Copyright (c) 2002 by Dr. Herong Yang
 */
import java.awt.*;
import javax.swing.*;
public class JFramePaint2 {
   public static void main(String[] a) {
      JFrame f = new JFrame();
      f.setTitle("Drawing Graphics in a Frame"
         +" by Adding a Component");
      f.setBounds(100,50,500,300);
      f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      f.getContentPane().add(new MyComponent());
      f.setVisible(true);
   }
   static class MyComponent extends JComponent {
      public void paint(Graphics g) {
         g.drawRect(20,10,100,60);
      }
   }
}

Note 1: Since no size and location is given to the new added component, it takes the entire area of the content pane, which is the entire area of the frame without the title bar area.

Note 2: Now the origin of the drawing coordinates is at the top left corner of the content pane, much better than solution 1.

Solution 2: Solution 2 is still not so perfect. Why do we need to add another component for the drawing? Can we draw graphics directly on the content pane? The answer is yes, we can draw directly on the content pane. The following sample code, JFramePaint3.java, shows you how to do this.

/**
 * JFramePaint3.java
 * Copyright (c) 2002 by Dr. Herong Yang
 */
import java.awt.*;
import javax.swing.*;
public class JFramePaint3 {
   public static void main(String[] a) {
      JFrame f = new JFrame();
      f.setTitle("Drawing Graphics in a Frame"
         +" by Replacing the Content Pane");
      f.setBounds(100,50,500,300);
      f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      f.setContentPane(new MyComponent());
      f.setVisible(true);
   }
   static class MyComponent extends JComponent {
      public void paint(Graphics g) {
         g.drawRect(20,10,100,60);
      }
   }
}

Note: The content pane is replaced by a new component object we created with our own the paint() method.

Drawing Chinese Characters in Frames

Problem: I want to draw some Chinese characters in a frame.

Solution: You can do in the same way as described in the solution of the previous question. In the paint() method, first change the font of the Graphics object to a Unicode font that supports Chinese characters. Then use drawString() utility method to draw the string with Chinese characters. The following sample code, JFramePaintChinese.java, shows you how to do this.

/**
 * JFramePaintChinese.java
 * Copyright (c) 2002 by Dr. Herong Yang
 */
import java.awt.*;
import javax.swing.*;
public class JFramePaintChinese {
   public static void main(String[] a) {
      JFrame f = new JFrame();
      f.setTitle("Drawing Graphics in Frames");
      f.setBounds(100,50,500,300);
      f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      f.setContentPane(new MyComponent());
      f.setVisible(true);
   }
   static class MyComponent extends JComponent {
      public void paint(Graphics g) {
         g.setFont(new Font("SimSun",Font.PLAIN, 12));
         g.drawString("Hello world! - \u7535\u8111\u4F60\u597D\uFF01",
            100,50);
      }
   }
}

Note 1: You don't need JDK 1.4.2 to draw Chinese characters in a component. JDK 1.3.1 is enough to run this sample code.

Note 2: You need to have SimSun installed on your system. To verify this, search for \winnt\fonts\simsun.ttc if you are using Windows system.

Part:   1  2  3  

Dr. Herong Yang, updated in 2006
Herong's Tutorial Notes on Swing - Swing JFrame