Customizing the Look and Feel of Java Applications in NetBeans 7 Using Nimbus and Metal

Purpose

This tutorial shows you how to use the look and feel options for Nimbus and Metal in Swing applications using NetBeans 7.

Time to Complete

Approximately 20 minutes.

Overview

Nimbus provides cross-platform look and feel, introduced in the Java SE 6 Update 10 (6u10) release. It uses Java 2D vector graphics to draw the user interface. The APIs are migrated from com.sun.java.swing to javax.swing package in Java SE 7. Nimbus is highly customizable. For backwards compatibility, Metal is still the default Swing look and feel, but you can enable Nimbus look and feel.

Software and Hardware Requirements

The following is a list of software requirements:

Prerequisites

Before starting this tutorial, you should have the software installed as listed under Software Requirements.

Creating the GUI

First you must create a GUI. Perform the following steps.

.

Create a New Project.

 

.

Select Java from the Categories column and Java Application from the Projects column and then click Next.


.

Perform the following steps

a. Name the class CelsiusConverter.
b. Uncheck the Create Main class check box.
c. Click Finish.

 

.

Right-click CelsiusConverter Project and select New > JFrame Form to add a JFrame.

JFrame acts as a top-level container to the application.

 

.

Name the GUI class CelsiusConverter, package name demo, and then click Finish.

The JFrame opens in the Design area. The Design area is where you visually construct the GUI. It has two views: the Source view and the Design view. The Design view is the default. You can toggle between views by clicking the respective tabs.

The Palette contains all components offered by the Swing API. The Palette is displayed automatically in the Design view.

 

.

Set the title of the frame.

a. Right-click JFrame and choose Properties.
b. In the Property Editor, enter the value for the title property as “CelsuisConverter”.
c. Close the editor.

 

.

To add a JLabel, drag a JLabel from the Palette to the upper left corner of the Design area.

 

.

Add a JTextField from the Palette and place it to the right of the JLabel.

 

.

Add a JButton and position it underneath the JLabel.

 

.

Add another JTextField and position it below JTextField1.

 

.

Set the Component Text.

a. Right-click JLabel and choose Edit Text.
b. Name the JLabel Celsius.
c. Rename JButton to Convert.
d. Remove the sample text from JTextField1 and JTextField2.

 

.

Change the Default Variable Names of Components.

a. Right click the Convert button and choose Change Variable Name from the menu, set as CelsiusButton, and then click OK.
b. Similarly set the variable name for Celsius label as Celsius.
c. Set the variable name for JTextField1 as TempCelsius.
d. Set the variable name for JTextField2 as TempFahr.

 

.

Set the component size.

a. Press and hold the Shift key and click JTextFields,Jlabel, and JButton.
b. Right-click and choose Same Size > Same Width. The components are now the same width.

The completed GUI will look similar to the screenshot below.

 

 

.

Register the Event Listener.

Right click the Convert button and choose Events > Action > actionPerformed.

This will generate the required event-handling code with an empty method body to add your own functionality.

 

.

Add the following Temperature Conversion code to the ConvertButtonActionPerformed method.

int tempFahr = (int)((Double.parseDouble(TempCelsius.getText()))
* 1.8 + 32);
TempFahr.setText(tempFahr+" "+"F");

 

.

To see the look and feel code, expand the editor fold Look and Feel Setting Code(optional) in the main method and review the IDE generated look and feel.

 

In NetBeans 7 the default look and feel is automatically set to Nimbus look and feel.The first line of code retrieves the list of all installed look and feel implementations for the platform and then iterates through the list to determine if Nimbus is available. If Nimbus is available, then it is set as the look and feel. If Nimbus is not available, the default look and feel is set.

 

.

Alternatively, you can set Nimbus in a Java application by following the steps below.

a. Import the package - javax.swing.UIManager.
b. Copy the following code in the main method:

try {

UIManager.setLookAndFeel( "com.sun.java.swing.plaf.nimbus.NimbusLookAndFeel");
}
catch (ClassNotFoundException ex) {
java.util.logging.Logger.getLogger(CelsiusConverter.class.getName()).log(java.util.logging.Level.SEVERE, null, ex);
}catch (InstantiationException ex) {
java.util.logging.Logger.getLogger(CelsiusConverter.class.getName()).log(java.util.logging.Level.SEVERE, null, ex);

} catch (IllegalAccessException ex) {
java.util.logging.Logger.getLogger(CelsiusConverter.class.getName()).log(java.util.logging.Level.SEVERE, null, ex);
} catch (javax.swing.UnsupportedLookAndFeelException ex) {
java.util.logging.Logger.getLogger(CelsiusConverter.class.getName()).log(java.util.logging.Level.SEVERE, null, ex);
}

This is a direct way to set Nimbus look and feel. However, note that this code does not switch back to the default look and feel if Nimbus is not available. Use this code only if Nimbus is available.

 

.

In the Projects pane, right-click CelsiusConverter.java and choose Run File

Output with Nimbus look and feel will be as in the below screenshot. 

 

You can test the application by entering a Celsius temperature in the TempCelsius field and then clicking Convert.

.

To set the default Metal look and feel, perform the following steps.

a. Delete the code in the main method that sets the Nimbus look and feel.
b. Save the project.

 

.

Run the file. 

Output with the default Metal look and feel will be as shown in the below screenshot.

Notice some differences in output between the Nimbus look and feel and the Metal look and feel:

  • The buttons in the Nimbus look and feel have rounded edges.
  • The background color in the Nimbus look and feel is much darker when compared with the Metal look and Feel.

 

Laffy - Swing Look and Feel Demo Project

Laffy is a Swing demo application which was designed to support all look and feel choices and demonstrate the complete range of Swing features and options.

1.

Download Laffy from this link.


A JNLP file opens and runs the Laffy application.

 

2.

To see a different look and feel, click the Look & Feel > Metal menu item. The Laffy output will be as below.

Likewise you can choose different look and feel choices to see their styling.

 

Summary

The Nimbus look and feel allows you to create cross platform desktop applications that have a polished appearance.

In this tutorial, you have learned how to customize the look and feel for Swing applications in NetBeans 7.

Resources


Credits

Hardware and Software Engineered to Work Together Copyright 2011, Oracle and/or its affiliates. All rights reserved