Tabbed Panels

 

Introduction.  While there are any number of other directions in which we could go next with GUIs, I am going to spend a webpage on JTabbedPanels.  Having tabbed panes can be very useful in order to get more in a GUI.  As you'd expect, each pane can have its own layout and tab identifier.

JTabbedPanes are configured to work with ChangeListener in order to respond to user actions.

But first we present the constructor.

 

Constructor Description
JTabbedPane( ) This constructor is used with no arguments

 

In order to work with tabbed panes there are a significant number of methods that the developer is likely to require at some point in time.

 

Method Description
insertTab(String title, Icon icon, Component component, String tip, int index) insert a tab with the specified values at location index
addTab(String title, Icon icon, Component component, String tip) add a tab with the specified characteristics
addTab(String title, Icon icon, Component component) add a tab with the specified characteristics
addTab(String title, Component component) add a tab with the specified characteristics
removeTabAt(int Index) remove a tab at the specified index
getSelectedIndex( ) returns the index of the selected tab
setSelectedIndex(int Index) sets the selected tab to the one with the specified index
getSelectedComponent( ) returns the selected component
getComponentAt(int Index) returns the component at a particular index
setComponentAt(int Index, Component component) sets the particular component at the specified index
indexOfTab(String title) gets the index of a tab based on the title
indexOfComponent(Component compnent) gets the index of a tab based on the component
getTabCount( ) gets the number of tabs

 

Each pane in a GUI can be quite different from another, or there can be similar patterns.  The example I've developed builds the GUI based on a particular pattern.  It also makes use of arrays of things like text fields and panels to do this.

An Example.  While the input error trapping and array developments are not as elegant as they probably should be, this example will demonstrate the issues of importance at present.  You should call the applet TabbedPanelArrayApplet.java.

 

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

public class TabbedPanelArrayApplet extends JApplet
{

String strNumberOfClients;
int numberOfClients;

JPanel[] panel = new JPanel[10];
JTabbedPane tabbedPane;

JTextField[] txtField = new JTextField[30];

public void init( )
{

strNumberOfClients = JOptionPane.showInputDialog("Please enter the number of client stations.\nThis number must be less than 11:");
numberOfClients = Integer.parseInt(strNumberOfClients);

JPanel topPanel = new JPanel( );
topPanel.setLayout(new BorderLayout( ));
getContentPane( ).add(topPanel);

tabbedPane = new JTabbedPane( );

for (int i=0; i < numberOfClients; i++)
{

// create the tab pages
panel[i] = createPage(i);

// create a tabbed pane
tabbedPane.addTab("Page " + i, panel[i]);

}

topPanel.add(tabbedPane, BorderLayout.CENTER);

} // ends init( )

public JPanel createPage(int j)
{

int numberTextField;
numberTextField = 3 * j;
panel[j] = new JPanel();

panel[j].setLayout( new GridLayout(3,2));
panel[j].add(new JLabel("Field 1: "));
txtField[numberTextField] = new JTextField(5);
panel[j].add(txtField[numberTextField]);
panel[j].add(new JLabel("Field 2: "));
txtField[numberTextField+1] = new JTextField(7);
panel[j].add(txtField[numberTextField+1]);
panel[j].add(new JLabel("Field 3: "));
txtField[numberTextField+2] = new JTextField(9);
panel[j].add(txtField[numberTextField+2]);

return panel[j];

} // ends createPage( )

} // ends TabbedPanelArrayApplet

 

I am also including the code for the HTML file which you should call TabbedPanelArrayApplet.html.

 

<html>
<applet code="TabbedPanelArrayApplet.class" width=300 height=200>
</applet>
</html>

 

When you initially run the program you should get a JOptionPane asking you for how many client stations you need.

 

 

The GUI should look like the following.

 

 

Notice how each panel is essentially the same to the user's perspective except for the tab that tells them which station they are working with.

There are other things about the code that we will discuss in class.