To complete this tutorial, you need the following software and resources.
|Software or Resource||Version Required|
|NetBeans IDE||Version 7.0 or later|
|Java Development Kit (JDK)||Version 6 or 7|
Handling images in an application is a common problem for many beginning Java
programmers. The standard way to access images in a Java application is
by using the
This tutorial shows you how to
use the IDE's GUI Builder to generate the code to include images (and other resources)
in your application. In addition, you will learn how
to customize the way the IDE generates image handling code.
The application that results from this tutorial will be a simple JFrame that contains one JLabel that displays a single image.
In this section, you create the JFrame form and add a JLabel to the form.
To create the JFrame form:
To add the JLabel:
For now, the form should look something like the following image:
When you use images or other resources in an application, typically you create a separate Java package for the resources. On your local filesystem, a package corresponds with a folder.
To create a package for the image:
org.me.myimageappnode and choose New > Java Package.
resourcesso that the new package is called
In the Projects window, you should see a new package appear within the
Source Packages folder.
In this application, the image will be embedded within a JLabel component.
To add the image to the label:
newpackagefolder and click Finish.
After you click OK, the IDE does the following things:
At this point, you can do some simple things to improve the appearance of the form, such as:
textproperty and delete
jLabel1. That value was generated by the GUI Builder as display text for the label. However, you are using the label to display an image rather than text, so that text is not needed.
To view the generated code:
The key line is the following:
jLabel1.setIcon(new javax.swing.ImageIcon(getClass().getResource("/org/me/myimageapp/newpackage/image.png"))); // NOI18N
Since you have used the property editor for
the IDE has generated the
setIcon method. The parameter of that method
contains a call to the
method on an anonymous inner class of
Notice that the generated path for the image corresponds with its location in
the application's package structure.
getResourcemethod is also useful for accessing other types of resources, such as text files that contain data that your application might need to use.
To register event handlers for mouse events on the Jlabel:
In the Design View, right-click the JLabel and choose Events > Mouse > mouseClicked/mousePressed/mouseReleased from the popup menu.
An event handler is generated for the corresponding event.
Note: You can get the mouse coordinates (for example, the location of a mouse
click) in the event handler using the
event.getY() methods. See Class MouseEvent for details.
There is no direct support for a background image of JFrame in the GUI Builder, since there is no direct support for a background image of JFrame in Swing.
Anyway, there are various indirect ways to achieve such a goal. In this application, the JLabel with the image will be embedded within a JFrame component, while a transparent JPanel will be placed over the JLabel and used as the parent of all the components.
To add a transparent JPanel to the JFrame with the image:
org.me.mybackgroundappnode and choose New > Java Package.
newpackageresources folder and click Finish.
Weight X, and
Weight Yproperties to
textproperty and delete
The background is done. Now you can drag, a jLabel and a jTextField to the jPanel from the Palette, for example. Both of them will display over the background image.
Note: The advantage of the described solution is that the background image is shown at both design-time and runtime.
Now that you have generated the code for accessing and displaying the image, you can build and run the application to ensure that the image is accessed.
First you need to set the project's main class. When you set the main
class, the IDE knows which class to run when you run the project.
In addition, this ensures that the
Main-Class element in the application's
JAR file is generated when you build the application.
To set the project's main class:
To build the project:
You can view the build products of the application in the Files
build folder contains the compiled class.
dist folder contains a
runnable JAR file that contains the compiled class and the image.
To run the project:
In many applications, the image that is displayed is not determined statically like it is in this example. For example, the image to display might be determined by something that the user clicks.
If you need to be able to choose the image to display programmatically, you can write your own custom code to access and display resources. The IDE prevents you from writing code directly in the Source view's "guarded blocks" that contain code generated by the GUI Builder. However, you can insert code in the guarded blocks through property editors that you can access through the Properties window. Using the property editors in this manner ensures that your custom code is not lost when you make design changes in the GUI Builder.
For example, to write custom code for a JLabel's
The Custom Code option in this property editor lets you fill in the
parameter of the
method yourself. You can fill in this parameter with the necessary logic
or with a call to a separate method that you have hand-coded elsewhere
in the class.
This tutorial has shown you how to access images from an application that you create in the NetBeans IDE. Image handling is further discussed in the Java Tutorial.
Note: The example given in this tutorial is very similar to the first
example in the
How to Use Icons section
of the Java Tutorial. One difference is that the code that is generated when you follow
this tutorial uses
method to apply the
icon to the label. In the Java Tutorial example, the icon is applied to the label
by being passed through its constructor.