The Butterf project is included in the Visual Basic samples folder. In Visual Basic to view it, choose Open Project from the File menu and then select Samples and firstapp folders choose project Butterf. Open the project and view the form.
Running the Form shows an animated butterfly moving across the screen.
The VB form consists of 5 controls and the Form. There are 3 images names Main, OpenWings, and CloseWings. There is a Timer called Timer1 and a CommandButton called Command1. The Form is named Form1. The properties of these Controls can be viewed in the Properties window. For instance, the CommandButton, Command1 has the its property caption set to "E&xit". All of the properties of Command1 are shown below.
The visible property is false for the Images OpenWings and CloseWings. It is set true for Main. To create the animated effect, the OpenWing and CloseWing pictures are alternated for Main.
The bulk of the code in this project is associated with Timer1. The following code is seen by double clicking on Timer1.
Private Sub Timer1_Timer()
Static PickBmp As Integer
Main.Move Main.Left + 20, Main.Top - 5
' For a variation, use the following line instead of the preceding one.
' Main.Move (Main.Left + 20) Mod ScaleWidth, (Main.Top - 5 + ScaleHeight) Mod ScaleHeight
If PickBmp Then
Main.Picture = OpenWings.Picture ' Displays the open butterfly picture.
Else
Main.Picture = CloseWings.Picture ' Displays the closed butterfly picture.
End If
PickBmp = Not PickBmp ' Toggle the value.
End Sub
The code can be summarized as: 1. Move the Image Main 2. Alternate Main's picture between OpenWing's Picture and CloseWing's Picture.
This routine will fire 5 times per second because Timer1's interval property is set to 200 milliseconds.
Notice that the properties and methods of a particular control are referred to as Control.property or Control.method. For instance, Main.Picture, OpenWings.Picture and Main.Move.
The only other code in the project is associated with Command1. The following is executed when Command1 is clicked or the x key is hit.
Private Sub Command1_Click() Unload Me End End Sub
How does this get done in Java?
The first question to ask is "Are there equivalent controls in Java?"
For the first difference in terminology, VB Controls are equivalent to Java Components. All components discussed here will be JFC Swing components. That is JFC (Java Foundation Class) Swing components that are included in JDK 1.2 that was released in December 1998. JDK 1.2 (Java Development Kit 1.2) is also known as the Java 2 release. Swing provides a sophisticated set of components that compare favorable to Visual Basic.
There is no 1 to 1 relationship between VB's Image Control and any Java components, but a VB Image can be considered a Swing JLabel. JLabel can appear similar to a VB Label, but it also has an icon property. If the JLabel displays only an icon , it is equivalent to a VB Image.
To handle icons, a new Swing component called an ImageIcon needs to be introduced. ImageIcons hold images. In Java, native images are GIF's or JPeg's. In VB they are bitmaps. So a conversion needs to occur. This is handled by Convert 2.
Note: Black Dirt's Convert tools are used in the development of these articles, but the emphasis is on education and understanding Java.
Java handles applets and standalone applications sligthlty differently. Those details will be discussed in a separate column, but it is important for this example to note that images are handled differently between applets and applications. For applications, the image is specified by a file name and for applets images are specified by URL. This example was developed as an application so the following code is used to define an ImageIcon:
ImageIcon CloseWingsImage = new ImageIcon("CloseWings.jpg"); ImageIcon OpenWingsImage = new ImageIcon("OpenWings.jpg");
Had this been an applet, the following would be used:
ImageIcon CloseWingsImage = new ImageIcon("http://www.blackdirt.com/CloseWings.jpg");
ImageIcon OpenWingsImage = new ImageIcon("http://www.blackdirt.com/OpenWings.jpg");
ImageIcon MainImage = new ImageIcon("Main.jpg");
Swing provides equivalents of a Timer and a CommandButton, so JLabels, a JButton and a Timer are defined:
JLabel CloseWings = new JLabel();
JLabel OpenWings = new JLabel();
JLabel Main = new JLabel();
JButton Command1 = new JButton("Exit");
Timer Timer1 = new Timer(200, new Timer1Listener());
At this point, the general structure of a Java program needs to be considered. In a simple case in VB, there is a form, controls, and code that is fired when an event occurs on a control. VB implements event driven programming. When an button is clicked, the click event is fired, and the corresponding code is run.
VB is very easy to use in that Controls are defined visually and it is very easy to add code for any relevant events.
The VB development process allows a programmer to visually:
0. Start with a Form
1. Add Controls to a Form
2. Set properties on the Controls
3. Add code for events
The general Structure of a Java program allow for all of these things.
In VB, starting with a Form is taken for granted. Consider a JFrame or JApplet as equivalent to a VB Form. A JFrame is a Container that can hold Java Components. Container is an important term in Java and will come up again.
The code to declare the JFrame is:
public class butterf_2 extends JFrame implements WindowListener {
This line of code declares a new class called butterf_2 that is a JFrame. In Java, the class being defined must be the same as the file name that it is in, so this code is in the file butterf_2.java.
This line of code DOES NOT make a new JFrame. It indicated that a new type of JFrame called a butterf_2 is about to be defined. Later in the code, in the main method, a new butterf_2 is "instantiated: and at that point a new JFrame is created. (If that does not make sense yet, that's OK, keep reading )
The Java Development process for a simple application is:
0. Extend a JFrame or JApplet to Define a Class
1. Declare the properties of the class (That includes declaring the components)
2. Create a Constructor for the class indicates what should happen when the class is instantiated (constructed)
3. Add components to the JFrame
4. Associate events with components
5. Add code to for events
6. For a JFrame, add a main method that "instantiates" the JFrame.
The following code fragments are commented using // to indicate that the line is commented.
So the skeleton Java code will have:
//A Class declaration
public class butterf_2 extends JFrame implements WindowListener {
//Properties are declared for the class, including components. These Components are available for the class to use
ImageIcon OpenWingsImage = new ImageIcon("OpenWings.jpg");
JLabel OpenWings = new JLabel();
// A Constructor - or possibly constructors.
public butterf_2() {
. . .
// In the constructor, the Components are actually added to the display and their properties can be modified.
getContentPane().add(Main);
Main.setBounds( getInsets().left + getInsets().right + 24, getInsets().top + getInsets().bottom + 176, 77, 77);
Main.setIcon(MainImage);
}
public butterf_2(String title) {
. . .
}
//Note that the constructor is a method with the same name as the class.
//And a Main Method.
public static void main(String args[]){
butterf_2 f = new butterf_2();
f.show();
}
/*
The main method code, declares a new butterf_2 called f and calls the JFrame method show that displays the Jframe. The main method is invoked when the class is run from the command line.
*/
Note that components are declared in the class and added in the Constructor
This skeleton framework has left out 2 fundamental things;how are events associated with components and where does the event code go?
For the most part, components and there associated events can be added in the constructor. That is the case with JButton Command1.
getContentPane().add(Command1);
. . .
Command1.addActionListener( new ActionListener() {
public void actionPerformed(ActionEvent e) { // clicked
System.exit(0);
} // end clicked
}); // end Command1 clicked
JButtons have a method called addActionListener. It is this method that created the association between a component and the event. The parameter to the addActionListener method is a class called an ActionListener. The code above creates a new ActionListener as an "inner class." Inner Classes allow classes to be defined as members of other classes or within a block of code. The ActionListener in the above code fragment is also anonymous. This is the first instance of a class declaration that did not include a name. Anonymous, inner classes are perfect for associated events with components. The code called is System.exit(0) which closes the Frame and exits execution.
Timer1's event, where the real action occurs will not be defined as anonymous inner class.
The constructor for Timer's take 2 parameters. The first is the interval in milliseconds and the second is the ActionEvent to fire. This can be done as an anonynous inner class. An inner class is can appear in the clock of code, so the Timer's constructor could be:
Timer Timer1 = new Timer(200, new ActionListener() { // Timer
public void actionPerformed(ActionEvent evt) {
// Timer Code goes here
} // end actionPerformed
}; // end classTimer1 Listener
);
That would put the Timer Event Code in the declaration section of the class and it would decrease readability.
The Timer will be define by creating a named inner class. The class will exist within butterf_2, but it will not be anonymous.
The Constructor
Timer Timer1 = new Timer(200, new Timer1Listener());
The inner class:
class Timer1Listener implements ActionListener { // Timer
public void actionPerformed(ActionEvent evt) {
z+=20;
y+=5;
if (closed){
closed = false;
Main.setIcon(OpenWingsImage);
} else{
closed = true;
Main.setIcon(CloseWingsImage);
}
Main.setBounds( getInsets().left + getInsets().right + 24 + z, getInsets().top + getInsets().bottom + 176 -y, 77, 77);
} // end actionPerformed
}; // end classTimer1 Listener
To clarify the details. In VB, OpenWings and CloseWings are images. The pictures from OpenWings and CloseWings are substituted into Main and Main moves across the screen.
In Java, a JLabel with an icon set to an image is eqquivalent to a VB Image. In this case, it is nt necessary for Jlabels to exist for OpenWings and CloseWings. ImageIcons can just be set for Main using the set Icon method.
If there are questions about these or a need to drill deeper please post your questions in the forum
The code
butterf.frm The VB Form
butterf_1.java The Converted Form
butterf_2.java The updated Form with code
ex1Jan07.zip Zip will all code
Next Steps
What about Object Oriented?
The fact that butterf_2 extends is an example of the inheritance aspect of Object Orientation
In the next newsletter, the development of Java methods to handle VB parsing functions such as Trim, LTrim, and RTrim will be detailed. In the examples that are developed, the Java String Class will be extended to include these methods. The Object Oriented aspects will be covered
What about null layout? And what is a layout manager anyway?
For this example the null layout is appropriate. It will be used to develop other examples. A future issue will cover Layout Managers in general.
Getting Started?
If there is a need for help in getting started with Swing and Java, post a note in the forum. I think it migtht be a good idea to provide a skeleton Applet (Hello World) and step by step instructions for downloading, installing, compiling and running.
The current challenge before the next issue is to write the RTrim and LTrim equivalents in Java. Post in the Forum.
Carmen 1/12/99