Creating a class diagram
Class diagrams are the blueprints of your system. Use class diagrams to model the objects that make up the system, to display the relationships between the objects, and to describe what those objects do and the services they provide.
Design the simple phone book application using the Model-View-Controller (MVC) architecture pattern, as shown in Figure 7. (See Resources for information on MVC.) The following three classes will be created:
PhoneBookModel- A class that manages the phone book entries and captures the state of the application. Whenever the state is changed, it notifies
PhoneBookView, which should then refresh the user interface based on the state of the application.
PhoneBookView- A class that manages the graphical or textual interface to the user based on the state of the application, and notifies
PhoneBookControllerwhen an input is received.
PhoneBookController- A class that controls the operation of the entire application. It changes the model state of the application and updates the data model based on user input.
The purpose of this exercise is to show the use of Rational Software Architect when designing an application. The design itself is not the focus, and you can proceed with a different design.
Figure 7. MVC design
Let's create a class diagram that reflects the design in Figure 7.
- In the Model Explorer view, right-click Phone Book UML Model and select Add Diagram > Class Diagram.
Class Diagramas the name of the generated diagram to replace the default name Diagram1.
- Select Class in the Palette, then click anywhere in the diagram to create a class.
- Right click the created class PhoneBookModel and select Add UML > Operation
to create an operation for this class. Name it
- Similarly, create the rest of the elements as shown in Table 2. The operation names are chosen without any
programming language assumptions.
Table 2. Class information
Class Operation(s) PhoneBookModel addAnEntry
- Now create some associations to relate these three classes together. As shown in Figure 8, click the arrow that appears
next to Association] from the Palette and select Directed Association.
Figure 8. Directed association relationship
- Draw the directed association relationship line from the class PhoneBookController to PhoneBookModel (the order is important) to initiate a Directed Association relationship between these two classes. A Directed Association relationship means the first one is aware of the latter, but not the other way round.
- Similarly, create the following relationships:
- Create an Association relationship between the class PhoneBookModel and PhoneBookView.
- Create an Association relationship between the class PhoneBookView and PhoneBookController.
An Association relationship without any direction means the two connected classes are aware of each other.
- The complete class diagram should look similar to Figure 9. Select Ctrl-S to save the diagram.
Figure 9. Complete class diagram