UML: Developing Applications

In this tutorial, you learn how to use the UML features of the IDE to create a simple UML class diagram. You then use the code generation and reverse engineering features to develop a simple banking application, which you can test by executing a test class. This banking application is greatly simplified; a real model for an application of this type would require more detail. The purpose of this tutorial is to introduce some of the IDE's UML features, not to teach you about UML concepts or the Java programming language.

Expected duration: 25 minutes

Contents

Creating the Java Project for the Application Creating the UML Project and the Class Diagram Adding and Defining Class Elements Adding More Elements to Diagrams Identifying Associations Between Elements Generating Java Source Code Continuing Development Using Reverse Engineering Testing Your Work

Tutorial Requirements

Before you proceed, make sure you review the requirements in this section.

top

Creating the Java Project for the Application

In this section , you create a new Java project for the Java application you are going to develop in this tutorial.

1. From the main menu, choose File > New Project and then do the following in the New Project wizard:
   
   1. Under Categories, select Java.
   2. Under Projects, select Java Application
   3. Click Next.
2. In the Project Name field, type JavaPrj.
3. For the Project Location field, click Browse, navigate to any directory on your computer. Click Open and type MyPrj.
4. Clear the Set as Main Project and the Create Main Class checkboxes.
5. Click Finish.
   A progress dialog box appears.
   When the new JavaPrj project is created, it appears in the Projects window.

 View Demo

top

Creating the UML Project and the Class Diagram

In this section, you create the UML project (or UML project) and class diagram for the application. A UML project is the mechanism by which you store and manage a collection of files for a UML model. A UML model contains all of the model's diagrams, their associated elements, and metadata related to the UML model.

1. To create the UML project, choose File > New Project and then do the following:
   
   1. Under Categories, select UML.
   2. Under Projects, select Java-Platform Model.
   3. Click Next.
   The New Java-Platform Model dialog box opens.
2. In the Project Name field, type UMLPrj.
   Notice that when you type the Project Name, the IDE automatically suggests this name for the name of the Project Folder.
3. Verify that the Project Location is MyPrj.
4. Click Finish.
   The IDE creates the UML project and the Create New Diagram dialog box appears.
5. In the Diagram Type list, select Class Diagram.
6. In the Diagram Name field, type BankClassDiagram.
7. Leave UMLPrj in the Namespace field and click Finish.
   The IDE does the following:
   
   • Adds the UMLPrj project node in the Projects window.
   • Creates a BankClassDiagram node under the Model node
   • Displays the new diagram in the Diagram editor (the diagram is empty at this point)
   • Opens the Modeling Palette

 View Demo

top

Adding and Defining Class Elements

Now, add and define the class elements that will make up your Java application. You use the Class icon from the Modeling Palette to create the class elements.

1. From the Basic section of the Modeling Palette, select the Class icon and click in the Diagram editor.
   This action places a class element on the Diagram editor.
2. Deselect the Class icon by right-clicking anywhere in the Diagram editor.
3. Select the newly added class element, type BankAccount and press Enter.
   The IDE does the following:
   
   • Labels the element BankAccount
   • Creates a public operation, BankAccount()
   • Displays the properties of the BankAccount class in the Properties window
4. With the BankAccount class element selected in the Diagram editor, right-click the word Attributes and choose Insert Attribute from the pop-up menu.
   A one-line editor opens and displays the following information:
   

   visibility type name[ranges]=initialValue{name=value}

5. Type balance and press Enter.
   A private attribute named balance of type int appears on the BankAccount class. The following operations are created on the class:
   
   • public int getBalance()
   • public void setBalance(int val)
6. With the BankAccount class element still selected in the Diagram editor, right-click the word Operations and choose Insert Operation from the pop-up menu.
   A one-line editor opens and displays the following information:
   

   visibility returnType name(parameter) {properties...}

7. Type withdraw, move your cursor (use the forward arrow on your keyboard) into the parentheses, type int amount and press Enter.
   The IDE adds the new operation in the class element as follows:

   public void withdraw(int amount)

 View Demo

top

Adding More Elements to the Diagram

In this section, you use more UML icons from the Modeling Palette to add interfaces, packages, attributes, and operations to your application.

1. From the Basic section of the Modeling Palette, select the Package icon .
   
   Note: If necessary, scroll down to see the additional Modeling icons.
2. Click in the Diagram editor to add a package element to the class diagram.
3. Right-click anywhere in the Diagram editor to deselect the Package icon.
   
   Note: As you add modeling elements to the diagram, you can select them and drag them to new locations in the Diagram editor to improve the appearance of the diagram. Be careful when you right-click, as in some positions, this action opens a pop-up menu for the Diagram editor. If this happens, just click again in the white space of the Diagram editor.
4. With the package element selected, type bankpack and press Enter.
5. From the Basic section of the Modeling Palette, select the Interface icon and click in the Diagram editor.
6. Right-click anywhere in the Diagram editor to deselect the Interface icon.
7. With the interface element selected, type Bank and press Enter.
8. Add a deposit operation to the Bank interface.
   You add operations to interfaces the same way you add them to classes (Step 6 in the preceding section). Define the operation as follows:
   

   public void deposit(int amount)

9. From the Modeling Palette, select the Class icon and click in the Diagram editor two times.
10. Right-click anywhere in the Diagram editor to deselect the Class icon.
    
    Note: If you draw too many class elements, deselect the Class icon, then right-click the class element you want to delete and select Edit > Delete.
11. Name the class elements Checking and AccountTest and resize the elements if necessary.

 View Demo

top

Identifying Associations Between Elements

In this section, you use the UML icons from the Modeling Palette to identify the association between class elements.

1. From the Basic section of the Modeling Palette, select the Implementation icon and click inside the BankAccount class element.
2. Click inside the Bank interface element and right-click anywhere in the Diagram editor to deselect the Implementation icon.
   An implementation link appears between the class and the interface element. An implementation link denotes a relationship between a class and an interface.
3. From the Basic section of the Modeling Palette, select the Generalization icon .
4. Click inside the Checking class element (the subclass), then click inside the BankAccount class element (the superclass).
   The Select Methods to Redefine dialog box appears.
5. Select the withdraw method and click OK.
   The IDE does the following:
   
   • Closes the dialog box
   • Adds the withdraw method to the Checking class
   • Adds the Generalization link between the two related Class elements
   A generalization link shows the relationship between a subclass and its superclass. Subclasses are refinements of the superclass, meaning they can inherit features (attributes and operations) from the superclass.
6. Right-click in any white space in the Diagram editor to deselect the Generalization icon.
7. From the Basic section of the Modeling Palette, select the Nested Link icon and click inside the BankAccount element and then inside the bankpack package element.
8. Use the Nested Link icon as described in the prior step and connect the Checking, AccountTest, and Bank elements with the bankpack package.
9. Deselect the Nested Link icon.
   A nested link denotes how elements are organized into groups. In this case, you organized all the class elements into a group in the bankpack package.
10. Press Ctrl-S anywhere in the Diagram editor to save the changes made to the model.

 View Demo

top

Generating Java Source Code

In this section, using the Generate Code feature of UML you generate the Java source code for the UML model that you created in the previous sections.

1. In the Projects window, right-click the UMLPrj node and choose Generate Code from the pop-up menu.
   The Generate Code dialog box appears. and specifies the Target Project.
2. Accept the default checkboxes in the Generate Code dialog box.
3. Click OK.
   The IDE generates the code and the output window displays the progress of the code generation process.

 View Demo

top

Continuing Development Using Reverse Engineering

In this section, you continue with your application development by modifying the generated source code in the Source editor and using the Reverse Engineer feature to update your UML model of your application.

1. In the Projects window, expand the UMLPrj > Model > bankpack node.
2. Right-click the BankAccount node and choose Navigate To Source from the pop-up menu.
3. Add the following code to the deposit method in the Source Editor:
   

   setBalance(getBalance() + amount);

4. Under the UMLPrj > Model > bankpack node in the Projects window, right-click the AccountTest node and choose Navigate To Source from the pop-up menu.
5. Type (or copy and paste) the following code in the Source Editor:
   

   public static void main(String[] args) {            
   Checking myChecking = new Checking();
   myChecking.deposit(100); 
   System.out.println("Checking Balance is: " + 
   myChecking.getBalance() );
   }

   This code creates a new Checking object and specifies a deposit of $100, then prints the results.
   
6. Right-click in the Source Editor and choose Format Code.
7. Press Ctrl-S anywhere in the Source Editor to save the changes made to the AccountTest.java source file.
8. Right-click in the Source Editor again and choose Reverse Engineer from the pop-up menu.
   The Reverse Engineer dialog box appears.
9. Select Use Existing UML Project in the Reverse Engineer dialog box and choose UMLPrj as the target project.
10. Click OK to invoke the reverse engineering process.
11. The popup Model Element Overwrite Authorization dialog appears, requesting that you confirm your overwriting the AccountTest model element. Click Yes/ Yes to All.
12. Click the BankClassDiagram tab.
    Notice that the newly entered main method now appears in the AccountTest class element in the class diagram.
    By using the Reverse Engineer feature, the changes made to the Java source project can be reflected in the corresponding UML model project.

 View Demo

top

Testing Your Work

Now build and run your project.

1. In the Projects window, right-click the JavaPrj node and choose Build from the pop-up menu.
2. In the Projects window, right-click the JavaPrj node and choose Run from the pop-up menu.
   The Run Project dialog box appears.
3. In the Run Project dialog box, click OK to select the bankpack.AccountTest as the main class.
   The IDE executes the application and displays the following output in the Output window:

   Checking Balance is: 100

You have now completed the application.

 View Demo

top

Summary

In this tutorial, you designed a class diagram for a simple banking application. You learned how to perform the following tasks:

• Create a UML project
• Use the UML icons from the Modeling Palette to create classes, interfaces, packages, attributes, and operations
• Link the classes together with UML associations
• View the elements that you created in the Diagram editor in the UML project as represented in the Projects window
• Generate the source code for the elements created in the Diagram editor in the UML project and view the generated source in the Source Editor.
• Use the Code Generation and reverse engineering features to go back and forth between modeling and developing code in the Source Editor
• Compile and execute classes from the Source Editor

top

Next Steps

• To learn more about the UML feature, complete the Reverse Engineering tutorial.

• To send comments and suggestions, obtain support, and stay informed of the latest changes to the NetBeans IDE J2EE development features, join the [email protected] mailing list.

top

>> More NetBeans IDE UML Documentation