5.3.2.1.1 Add a Graphical User Interface
To proceed with building our interface, we need to create a Java container within which we will place the other required GUI components. Generally, the most popular Java GUI containers include:
- JFrame Form (Java Frame Form window)
- JDialog Form (Java Dialog Box Form window)
- JPanel Form (Java Panel Form window)
In this project, we will create a container using the JFrame component. We will place the con-tainer in a new package, which will appear within the Source Packages node.
Perform the following operations to complete this GUI adding process:
1) In the Projects window, right-click on our new created project, JavaAppProject, and choose the New > JFrame Form menu item from the popup menu.
2) Enter JavaAppFrame into the Class Name box as the class name, as shown in Figure 5.7.
3) Enter JavaAppPackage into the Package box as the package name (Figure 5.7).
4) Click on the Finish button.
Your finished New JFrame Form wizard should match the one that is shown in Figure 5.7. The IDE creates the JavaAppFrame form and the JavaAppFrame class within the JavaAppProject application and opens the JavaAppFrame form in the GUI Builder. The JavaAppPackage package replaces the default package.
When we added the JFrame container, the IDE opened the newly created ContactEditorUI form in an Editor tab with a toolbar containing several buttons, as shown in Figure 5.8. The ContactEditor form opened in the GUI Builder’s Design view, and three additional windows appeared automatically along the IDE’s edges, enabling you to navigate, organize and edit GUI forms as you build them.
The GUI Builder’s various windows include:
- Design Area: The GUI Builder’s primary window for creating and editing Java GUI forms. The toolbar’s Source and Design toggle buttons enable you to view a class’s source code or a graphical view of its GUI components. The additional toolbar buttons provide convenient
FIGURE 5.7 The finished New JFrame Form wizard.
FIGURE 5.8 The opened ContactEditor form.
access to common commands, such as choosing between Selection and Connection modes,aligning components, setting component auto-resizing behavior and previewing forms.
• Navigator Window: Provides a representation of all the components, both visual and non-
visual, in your application as a tree hierarchy. The Navigator API is good for clients that want to show some structure or outline of their document in dedicated window, allowing fast end-user navigation and control over the document. The Navigator API also allows its clients to plug in their Swing-based views easily, which then will be automatically shown in a specialized Navigator UI.
• Palette Window: A customizable list of available components containing tabs for JFC/ Swing, AWT and JavaBeans components, as well as layout managers. In addition, you can create, remove and rearrange the categories displayed in the Palette using the customizer.
• Properties Window: Displays the properties of the component currently selected in the GUI Builder, Inspector window, Projects window or Files window.
Two more points to be emphasized are about the Palette and the Properties windows.
All Java GUI-related components are located in the Palette window and distributed in differ-ent packages or namespaces. This Palette window contains the following GUI-related components based on the different packages:
- Swing Containers: contains all Java container classes
- Swing Controls: contains all Swing-related GUI components
- Swing Menus: contains all Swing-related menu items
- Swing Windows: contains all Swing-related window classes
- AWT: contains all AWT-related GUI components
- Beans: contains all JavaBeans-related GUI components
- Java Persistence: contains all Java Persistence–related components
Relatively speaking, AWT-related GUI components are older compared to those components defined in the Swing package, in which all components are defined in a model-view-controller (MVC) style. The java.awt package contains all basic and fundamental graphic user interface com-ponents (AWT). However, the javax.swing package contains extensions of java.awt, which means that all components in the javax.swing package have been built into model-view-controller mode with more object-oriented properties (Swing).
The Properties window is used to set up and display all the properties of the GUI components you added into the container, such as appearances and physical descriptions. Let’s illustrate how to use this window to set up and show each property for added GUI-related components on this container in the next section.