Developing Swing applications - IntelliJ IDEA in Action - page 351

Although a tab pane appears visually complex, creating one with the GUI
Designer is surprisingly simple. Unlike the other container components, which
are designed to hold components, the JT abbedPane is designed to hold other con-
tainers, which in turn hold the components that make up each pane. To create a
JT abbedPane, add it to your workspace. It begins life with no tabs and no content.
To begin adding components, first create a new JP anel, and then drag and drop it
into your JT abbedPane. Doing so adds the JP anel to the JT abbedPane and creates
a new tab at the top of the pane (called the tab region ). You can rename the tab by
double-clicking it and entering a new name. Now you're free to add components
to the newly created tab and set the layout as required. To create additional tabs,
create new JP anels and drag them into the tab region of the JT abbedPane. To
remove a tab, activate its JP anel on the tree view, and delete it.

Previewing your design
You can click the Preview button to build and run your form as a standalone dia-
log. In this dialog, you can see how your components look as well as how they
handle resizing, text entry, and so forth.

10.3 Designing an ACME GUI

Let's create a GUI for the currency converter. Assuming you distribute the appli-
cation as a standalone desktop application, you'd like to provide more than just a
command-line interface. The GUI can be simplistic: a single form that a user fills
out to provide the data for the conversion. This data includes the starting cur-
rency, the ending currency, and the amount of currency to be exchanged. You'll
also need a control component to execute the conversion and a view component
to show the results. In addition, most simple GUI s like this have a Close or Finish
control component to shut down or leave the GUI .

10.3.1 Creating a new GUI form in IDEA

Navigate in the Project tool window to the com.acme.conversion.currency.client
package. With that node selected, right-click, and choose New | GUI Form from
the context menu. When prompted for the form name, enter ACMEGUI and click
OK . A new GUI Designer tab opens in IDEA , ready for you to begin.

10.3.2 Manually creating the basic layout

The first step is to manually lay out the interface with all the components
required. Let's use a JT extField for textual input (for simplicity), JC omboBoxes