Simple Java applet example on how to use panels.
	RoadDust's Java JPanel Creation Tutorial Tutorial: Use panels on your Java Applet.
Create a layout for your Java Applet using JPanels.

Welcome to RoadDust's Java Applet JPanel creation tutorial. Panels can be used to create a layout for your controls. For example, if you wanted to setup a menu for an application, you may want to use panels to separate the different parts of your menu.

Java Applet JPanels made simple.

Example of a simple panel layout.

The following is a very simple example of a basic panel layout.

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

public class JavaAppletExample extends JApplet{
			
    private javax.swing.JPanel panel1;
    private javax.swing.JPanel panel2;
    private javax.swing.JPanel panel3;
    private javax.swing.JTextField textPanel1;
    private javax.swing.JTextField textPanel2;
    private javax.swing.JTextField textPanel3;
	
    private Container container;
	
    public void init () {	
        initComponents();     
        setSize(90, 90);        
    }

    private void initComponents() {
    	 
        container = getContentPane();
        container.setLayout( new BorderLayout() );
        
        textPanel1 = new javax.swing.JTextField("text panel 1");
        textPanel2 = new javax.swing.JTextField("text panel 2");
        textPanel3 = new javax.swing.JTextField("text panel 3");
        panel1 = new javax.swing.JPanel();
        panel2 = new javax.swing.JPanel();
        panel3 = new javax.swing.JPanel();
        
        panel1.add(textPanel1);
        panel2.add(textPanel2);
        panel3.add(textPanel3);       
        container.add(panel1, BorderLayout.NORTH);
        container.add(panel2, BorderLayout.CENTER);
        container.add(panel3, BorderLayout.SOUTH);
    } 
}

The code above is a simple example of a panel layout. It includes text fields, panels and a container. You can see the result of the above displayed on the left of this text. The three text fields in the gray box on the left hand side is not a picture, it is the java applet that results from this code.

In the java applet panel layout example above, the first step is to declare the panels, the text fields and the container.

    private javax.swing.JPanel panel1;
    private javax.swing.JPanel panel2;
    private javax.swing.JPanel panel3;
    private javax.swing.JTextField textPanel1;
    private javax.swing.JTextField textPanel2;
    private javax.swing.JTextField textPanel3;

Once this is done, the "init()" method will call the "initComponents()" method which will first initialize the container. In this example I called my container "container" in order to keep things simple but it could have been called anything. Once initialized the layout of the container is set. There are different types of layouts but for this example the border layout was used.

        container = getContentPane();
        container.setLayout( new BorderLayout() );

After the initialization of the container, you have the initialization of the text fields and the panels. You will see them being initialized in the textbox below. The order in which you decide to initialize these elements is irrelevant but all of the initializations must be done before adding the text fields to the panels and the panels to the container.

        textPanel1 = new javax.swing.JTextField("text panel 1");
        textPanel2 = new javax.swing.JTextField("text panel 2");
        textPanel3 = new javax.swing.JTextField("text panel 3");
        panel1 = new javax.swing.JPanel();
        panel2 = new javax.swing.JPanel();
        panel3 = new javax.swing.JPanel();

Now this is where things get interesting... as you will see below, the text fields are first added to the panels which are then added to the container in the specified locations. Keep in mind that this example uses the border layout for the container and that different layouts may be used. Also it is important to know that several elements can be added to the panels. For example a panel could have contained a text box and a button.

        panel1.add(textPanel1);
        panel2.add(textPanel2);
        panel3.add(textPanel3);       
        container.add(panel1, BorderLayout.NORTH);
        container.add(panel2, BorderLayout.CENTER);
        container.add(panel3, BorderLayout.SOUTH);

With the above java applet code you should be able to grasp the basic concept of panel creation and display. I will now give you a second code example that illustrates the same concept but with a few extra elements added. After the code you will see the resulting applet. In order to keep the code simple the applet will have no functionality.

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

public class JavaAppletExampleB extends JApplet{
			
    private javax.swing.JPanel panel1;
    private javax.swing.JPanel panel2;
    private javax.swing.JPanel panel3;
    private javax.swing.JTextField textPanel1;
    private javax.swing.JTextField textPanel2A;
    private javax.swing.JTextField textPanel2B;
    private javax.swing.JTextField textPanel2C;
    private javax.swing.JTextField textPanel3;

    private javax.swing.JButton buttonPanel1;
    private javax.swing.JButton buttonPanel2A;
    private javax.swing.JButton buttonPanel2B;
    private javax.swing.JButton buttonPanel2C;
    private javax.swing.JButton buttonPanel3;
	
    private Container container;
	
    public void init () {	
        initComponents();     
        setSize(300, 300);      
    }

    private void initComponents() {
    	 
        container = getContentPane();
        container.setLayout( new BorderLayout() );
        
        textPanel1 = new javax.swing.JTextField("text panel 1");
        textPanel2A = new javax.swing.JTextField("text panel 2A");
        textPanel2B = new javax.swing.JTextField("text panel 2B");
        textPanel2C = new javax.swing.JTextField("text panel 2C");
        textPanel3 = new javax.swing.JTextField("text panel 3");
        
        buttonPanel1 = new javax.swing.JButton("[1]");
        buttonPanel2A = new javax.swing.JButton("[2A]");
        buttonPanel2B = new javax.swing.JButton("[2B]");
        buttonPanel2C = new javax.swing.JButton("[2C]");
        buttonPanel3 = new javax.swing.JButton("[3]");
        
        panel1 = new javax.swing.JPanel(new GridLayout(1, 2));
        panel2 = new javax.swing.JPanel(new GridLayout(3, 2));
        panel3 = new javax.swing.JPanel(new GridLayout(1, 2));
        
        panel1.add(buttonPanel1);
        panel1.add(textPanel1);
        
        panel2.add(buttonPanel2A);
        panel2.add(textPanel2A);
        panel2.add(buttonPanel2B);
        panel2.add(textPanel2B);
        panel2.add(buttonPanel2C);
        panel2.add(textPanel2C);
        
        panel3.add(buttonPanel3);
        panel3.add(textPanel3);
            
        container.add(panel1, BorderLayout.NORTH);
        container.add(panel2, BorderLayout.CENTER);
        container.add(panel3, BorderLayout.SOUTH);
    } 
}

RESULT:

As you can see in the java applet code example above, the panel layouts can be set in the same manner as the container's layout. You will notice that "Panel B" takes considerably more space than the other panels, this is because the center area of the border layout is the largest as it will normally be used to display the main area of the java applet. Event though the above examples are not very nice to look at, they are very simple.

Thank you for visiting RoadDust's Java JPanel tutorial. I hope the examples above help you understand how panels and containers are used.