Support Lecture Architectural Patterns Patterns Pattern A representation

Support Lecture Architectural Patterns

Patterns Pattern: A representation of a proven solution. Problem Applicable Forces Solution Benefits Consequences

Software Architecture l Architecture is OVERLOADED • • l l l System architecture Application architecture Architecture for this presentation is The modules, processes, interconnections, and protocols which constitute the deployed software system. Different from the behavioral architecture which describes how the business classes execute the business processes.

Architecture Specification l l Document which defines in text and diagrams the design, flow and technologies of the design. Shows how persistence, communication, and behavior are to be implemented in the system.

Architectural Layers - Patterns • Presentation • interactions with the user – HTML, thick client, MVC, web services • Domain (Logic) • Business rules, validations, calculations, verifications • Data Storage • database • Environmental • Session management, messaging

Presentation Architectural Patterns l l l Model View Controller – our focus Application Controller Input Controller • • l Page Controller Front Controller View Controller • • • Template View Transform View Two Step View

Model View Controller (MVC) – an architectural pattern that modularizes GUI applications into three well-formed object-oriented components namely the view (presentation) component, the model (data) component, and the controller (action) component. WHY? We use MVC because of REUSE : one screen view may be used with various controllers one data model may be used with many screens

Model View Controller 1. When a user modifies the view on the screen VIEW 2. The controller modifies the model with the new input. Controller 3. The model validates the change and updates the view. MODEL

Model View Controller There are various uses for the MVC application pattern such as 1) Simple division of responsibilities 2) Allowing one view and multiple controllers. 3) Allowing one model with multiple views. 4) Allowing one view and multiple models

Model View Controller Our MVC example will have one view and two controllers. One controller will allow viewing of the value of an item. The other controller will allow the editing of the field. A. We will ONLY have the view items in the view including a get method allowing the return of a specific graphical component to the controller to attach an action listener. B. We will define two controllers – one for displaying the data, the other for editing. C. We will have one model to hold the data.

Model View Controller Scenario 1: We want to use our screen for the VRS to allow the customer to enter their member information. We will need several classes. One for the member – the model class information (this could be multiple classes), one for the member display or view(again this could be multiple classes), one for the controller for that view (at least one for each view), and one for the database table for updating the database.

Model View Controller Scenario 1: Membership Application First Name Format 8 to 20 alphabetic characters Last Name Format 8 to 20 alphabetic characters Phone Number Format xxx-xxxx Credit Card Number Only Master Card Accepted Expiration Date Email Address Format MMYYYY SUBMIT

Model View Controller Example First lets look at the View Define the View with a name that allows you to realize it is indeed a view. import java. applet. *; import java. awt. *; import javax. swing. *; public class Member. View extends Panel private JLabel first. Name. Label; private JText. Field first. Name. Text. Field; private JLabel last. Name. Label; private JText. Field last. Name. Text. Field; ……// others Define the components within the view. {

Model View Controller Example View public JText. Field get. First. Name. Text. Field() { return first. Name. Text. Field; } // end get. First. Name. Text. Field public JText. Field get. Last. Name. Text. Field() { return last. Name. Text. Field; } // end get. Last. Name. Text. Field Add two methods that return the components needing the action listeners. Note: these methods return the actual instance of the components so that the controller can add the action listeners.

Model View Controller Example public void add. First. Name. Label() { first. Name. Label = new JLabel(“First Name"); add(first. Name. Label); first. Name. Label. set. Bounds (10, 100, 25); } // end add. First. Name. Label public void add. First. Name. Text. Field() { first. Name. Text. Field = new JText. Field(); addfirst. Name. Text. Field); first. Name. Text. Field. set. Background (Color. yellow); first. Name. Text. Field. set. Bounds (80, 100, 25); } // end add. First. Name. Text. Field Add the first name label and textfield to the component in their respective methods. View

Model View Controller Example public void add. Last. Name. Label() { last. Name. Label = new JLabel(“Last Name"); add(last. Name. Label); last. Name. Label. set. Bounds (200, 180, 25); } // end add. Last. Name. Label public void add. Last. Name. Text. Field() { last. Name. Text. Field = new JText. Field (); add(last. Name. Text. Field); last. Name. Text. Field. set. Background (Color. red); last. Name. Text. Field. set. Bounds ( 400, 10, 60, 25); } // end add. Last. Name. Text. Field Add the last name label and textfield in their respective methods. View

Model View Controller Example View public Membert. View ( ) { set. Layout(null); add. First. Name. Label(); add. First. Name. Text. Field(); add. Last. Name. Label(); add. Last. Name. Text. Field(); set. Size (350, 350); } // end constructor } // end View Not in the constructor, you can set the layout to null so you can use the direct positioning, add the four components and set the size of the panel. This completes the view.

Model View Controller Example Now lets look at the Model or Record. public class Member { private String first. Name; private String last. Name; ……. // other elements public void set. First. Name (String first. Name) { this. first. Name = first. Name; } public void set. Last. Name (String last. Name) { this. last. Name= last. Name; } …. . public String get. First. Name() { return first. Name; } We have defined public String get. Last. Name() { return last. Name; } ……. our model as a public Member () { record with the first. Name = new String("Sara"); last. Name = new String (“Stoecklin"); necessary data. } // end constructor } // end class

Model View Controller Example Now lets look at the Controller. import java. awt. *; import java. awt. event. *; import java. io. *; import javax. swing. *; First, we define the components which we wish to add action listerners namely the first. Name and last. Name textfield. public class Member. Controller implements Window. Listener { private JText. Field first. Name. Text. Field; private JText. Field last. Name. Text. Field; Member. View member. View; Memberl member; Then we define both the view namely Member. View and the model called Member.

Model View Controller Example Controller public Member. Controller (Member. View member. View) { this. member. View = member. View; member = new Member(); set. First. Name. Text. Field (); set. Last. Name. Text. Field(); } // end constructor In the constructor, we pass the name of the view we wish to use for this controller.

Model View Controller Example Controller public Member. Controller (Member. View member. View) { this. member. View = member. View; member = new Member(); } // end constructor We then make an instance of both the view and the model.

Model View Controller Example Controller public void edit. View ( ) { set. First. Name. Text. Field (); set. Last. Name. Text. Field(); } // end edit. View We then call two methods, one method to set up the first. Name textfield with an action listener and the other to set up the last. Name textfield’s listener.

Model View Controller Example Controller public void set. First. Name. Text. Field() { name. Text. Field = member. View. get. First. Name. Text. Field(); first. Name. Text. Field. add. Action. Listener (new Action. Listener() { public void action. Performed (Action. Event e) { member. set. First. Name(name. Text. Field. get. Text()); System. out. println (“Member First Name: " + member. get. First. Name()); In this method we first get the } // end action. Performed } // end new name textfield from the view ); // end add. Action. Listener parameter } // end set. First. Name. Text. Field() using the get method in the view class. .

Model View Controller Example Controller We then add the action listener as an anomalous first. Name. Text. Field = member. View. get. First. Name. Text. Field(); listener instance with the first. Name. Text. Field. add. Action. Listener embedded action listener for (new Action. Listener() { ONLY the textfield. public void action. Performed public void set. First. Name. Text. Field() { (Action. Event e) { member. set. First. Name(first. Name. Text. Field. get. Text()); System. out. println (“Member First Name: " + member. get. First. Name()); } // end action. Performed } // end new ); // end add. Action. Listener parameter } // end set. First. Name. Text. Field()

Model View Controller Example Controller Set the Name in the model (record) to the name keyed in the name. Text. Field = Member. View. get. Name. Text. Field(); text when the textfield name. Text. Field. add. Action. Listener encounters an enter action. Then (new Action. Listener() { print the field public void action. Performed public void set. Name. Text. Field() { (Action. Event e) { member. set. Name(name. Text. Field. get. Text()); System. out. println (“Member First Name: " + member. get. First. Name()); } // end action. Performed } // end new ); // end add. Action. Listener parameter } // end set. First. Name. Text. Field()

Model View Controller Example Controller public void set. Last. Name. Text. Field() { last. Name. Text. Field = member. View. get. Last. Name. Text. Field(); last. Name. Text. Field. add. Action. Listener (new Action. Listener() { public void action. Performed (Action. Event e) { member. Record. set. Last. Name(last. Name. Text. Field. get. Text()); System. out. println (“Member Last Name: " + member. get. Last. Name()); } // end action. Performed } // end new ); // end add. Action. Listener parameter The DOB textfield } // end se. Lastt. Name. Text. Field() follows the same pattern.

Model View Controller Example Controller public void window. Closing (Window. Event e) { System. exit(0); } // end window. Closing public void window. Closed (Window. Event e) { System. exit(0); } // end windoe. Closed public void window. Opened(Window. Event e) { } public void window. Iconified (Window. Event e) { } public void window. Deiconified(Window. Event e) { } public void window. Activated(Window. Event e) { } public void window. Deactivated(Window. Event e) { } } // end class End the class.

Model View Controller Example Now the Applet. Your use case controller. import java. applet. *; import java. awt. *; import javax. swing. *; Set up the view, record and controller variables. public class MVC extends JApplet { private. Member. View mvc. Member. View; private Member mvc. Member; private Member. Controller mvc. Member. Controller; private Container container; public void init( ) { container = get. Content. Pane(); container. set. Layout (new Grid. Layout()); mvc. Member. View = new Member. View (); mvc. Member. Controller = new Member. Controller(mvc. Member. View); mvc. Member. Controller. editview(); container. add (mvc. Member. View); container. set. Bounds (50, 500, 500); } // end init } // end MVC

Model View Controller Example Applet your use case controller import java. applet. *; import java. awt. *; import javax. swing. *; Make an instance of the view as a public class MVC extends JApplet { controller passing private Member. View mvc. Member. View; private Member. Record mvc. Member. Record; parameter. private Member. Controller mvc. Member. Controller; private Container container; public void init( ) { container = get. Content. Pane(); container. set. Layout (new Grid. Layout()); mvc. Member. View = new Member. View (); mvc. Member. Controller = new Member. Controller(mvc. Member. View); mvc. Member. Controller. edit. View(); container. add (mvc. Member. View); container. set. Bounds (50, 500, 500); } // end init } // end MVC

Model View Controller Example Applet - your use case controller import java. applet. *; import java. awt. *; import javax. swing. *; Call the edit. View routine to allow the textfields to be connected to the action listener. public class MVC extends JApplet { private Member. View mvc. Member. View; private Member mvc. Member. Record; private Member. Controller mvc. Member. Controller; private Container container; public void init( ) { container = get. Content. Pane(); container. set. Layout (new Grid. Layout()); mvc. Member. View = new Member. View (); mvc. Member. Controller = new Member. Controller(mvc. Member. View); mvc. Member. Controller. edit. View(); container. add (mvc. Member. View); container. set. Bounds (50, 500, 500); } // end init } // end MVC

Model View Controller Once you begin having many interacting classes, some type of diagram abstraction is most helpful in making changes to the design of your system. The Unified Modeling Language (UML) is a good tool for modeling these class interactions. We will first model the MVC example using the application rather than the applet.

Model View Controller Use. Case The line represents a class or instance of a class. Instances are represented by an underlined class name. REMEMBER: not all developers use a driver. Instead they have the controlling class drive the application. We use one because it makes teaching and understanding easier.

Model View Controller Use. Case Container create () get. Content. Pane () set. Layout (new. Grid. Layout) These lines represent the invoking of the constructor for the Container with calls to the methods get. Content. Pane and set. Layout for new Grid. Layout.

Model View Controller Driver Container Member View Controller create () get. Content. Pane () set. Layout (new. Grid. Layout) create () create (member, membert. View) It then invokes the Member class with no parameters, the Member. View class with no parameters, and the Member. Controller with two parameters. .

Model View Controller Use Case Container Member View Controller create () get. Content. Pane () set. Layout (new. Grid. Layout ()) create () create (member, member. View) add (membert. View) edit () set. Bounds() We then add the member view panel to the container. And then we call the edit routine in the controller. We then set. Bounds and make the frame viewable.

Model View Controller Example Now the Application if you did not want an applet import java. awt. *; import javax. swing. *; import java. awt. event. *; public class Application extends JFrame implements Window. Listener{ private Container container; private Member. Controller member. Controller; // change this line private Member member; private Member. View member. View; Declare the variables for the controller, record and the view.

Model View Controller Example Now the Application public Application ( ) { super ("Test for Application GUI"); container = get. Content. Pane(); container. set. Layout(new Grid. Layout()); member = new Member. Record (); member. View = new Member. View(); member. Controller = new Member. Controller(member. View, member. Record); container. add (member. View); member. Controller. edit. View(); container. set. Bounds (10, 700, 700); set. Size (700, 700); set. Visible (true); Create instances of the view and the record and } // end constructor of the Member. Controller with the parameters of the view and the record. Call the edit. View routine in the controller.

Model View Controller Example Now the Application public void window. Closing (Window. Event e) { System. exit(1); } // end window. Closing public void window. Closed (Window. Event e) { } public void window. Opened(Window. Event e) { } public void window. Iconified (Window. Event e) { } public void window. Deiconified(Window. Event e) { } public void window. Activated(Window. Event e) { } public void window. Deactivated(Window. Event e) { } public static void main (String args [ ] ) { Application my. Application = new Application(); my. Application. set. Default. Close. Operation ( JFrame. EXIT_ON_CLOSE); } // end main } // end Application Perform the necessary window activity.

Model View Controller Scenario 1: Membership Application When the applet appears, you can enter the first. Name and last. Name, etc. First Name Format 8 to 20 alphabetic characters Last Name Format 8 to 20 alphabetic characters Phone Number Format xxx-xxxx Credit Card Number Only Master Card Accepted Expiration Date Email Address Format MMYYYY SUBMIT

Model View Controller Scenario 2: Now write more code that allows ONLY displaying of the data within the record and does not allow editing those fields. You should be able to reuse some classes.

Model View Controller Scenario 2: This applet displays the data in the model upon construction. Membership Application First Name Format 8 to 20 alphabetic characters Last Name Format 8 to 20 alphabetic characters Phone Number Format xxx-xxxx Credit Card Number Only Master Card Accepted Expiration Date Email Address Format MMYYYY SUBMIT

Model View Controller Example Scenario 2: The View will be the same. The Model or Record will also be the same.

Model View Controller Now lets look at the Controller. We will need three new methods. One for allowing non editable viewing of the first. Name textfield. One for allowing non editable viewing of the last. Name textfield. One method called by the driver to call these methods.

Model View Controller public void display. View () { display. First. Name. Text. Field (); display. Last. Name. Text. Field(); } // end display view This method called by the driver. These methods allow display of the data in the model and prohibits it from editing. public void display. Name. Text. Field() { first. Name. Text. Field = member. View. get. First. Name. Text. Field(); first. Name. Text. Field. set. Text(member. get. First. Name()); first. Name. Text. Field. set. Editable(false); } // end view. First. Name. Text. Field() public void display. Last. Name. Text. Field() { last. Name. Text. Field = member. View. get. Last. Name. Text. Field(); last. Name. Text. Field. set. Text(member. get. Last. Name()); last. Name. Text. Field. set. Editable(false); } // end view. Name. Text. Field()

Model View Controller Applet import java. applet. *; import java. awt. *; import javax. swing. *; public class MVCDisplay extends JApplet { private. Member. View mvc. Member. View; private Member mvc. Member; private Member. Controller mvc. Member. Controller; private Container container; This applet calls the display. View method. public void init( ) { container = get. Content. Pane(); container. set. Layout (new Grid. Layout()); mvc. Member. View = new Member. View (); mvc. Member. Controller = new Member. Controller(mvc. Member. View); mvc. Member. Controller. display. View(); container. add (mvc. Member. View); container. set. Bounds (50, 500, 500); } // end init } // end MVC