1. CS102 – Bilkent University
06/25/12
MVC and GUIs
Use of the model, view, controller design pattern in graphical user interfaces
CS102 – Bilkent University

2. MVC (Model, View, Controller)
06/25/12
MVC (Model, View, Controller)
Used to build GUI applications
Separation of concerns
Easy to maintain and update
Model: The model represents data and the rules that govern access to and updates of this data.
View: The view renders the contents of a model. If the model data changes, the view must update its presentation.
Controller: The controller translates the user's interactions with the view into actions that the model will perform.
Copyright © 2012 Pearson Education, Inc.

3. A common MVC implementation
06/25/12
A common MVC implementation

4. Interaction Between MVC Comps.
06/25/12
Interaction Between MVC Comps.
The view:
Renders the model when needed (when relevant changes happen).
Registers as a listener on the model. Changes on the model will invoke a listener method in the view class.
Notifies the controller when the user interacts with the view.
The controller:
Registers as a listener on the view. User actions performed on the view will invoke a listener method in the controller class.
Updates the model based on user input (which it learns through listener calls from the view) by applying its own control policies.
Copyright © 2012 Pearson Education, Inc.

5. Interaction Between MVC Comps.
06/25/12
Interaction Between MVC Comps.
The model:
Notifies the view when the model changes.
Provides inspection methods to the view.
Provides manipulation methods to the controller.
Copyright © 2012 Pearson Education, Inc.

6. A Java SE Application Using MVC
06/25/12
A Java SE Application Using MVC

7. A Typical Interaction User changes the text:
06/25/12
A Typical Interaction
User changes the text:
The view notifies the controller of the change
The controller updates the model
The model notifies the view of the change
The view redraws to reflect the change
Advantages:
There could be multiple views of the same model
Control policies can be applied without cluttering the main jobs of rendering state (view) and managing it (model)
Copyright © 2012 Pearson Education, Inc.

8. More than one view Multiple Views Using the Same Model 06/25/12
Copyright © 2012 Pearson Education, Inc.

9. 06/25/12
Variations on MVC
In this variation, we have the controller arbitrating between the model → view notifications. Apple Cocoa framework uses this variation of MVC.
Copyright © 2012 Pearson Education, Inc.

10. 06/25/12
Self-exercise
Read the code example at: html#4
Copyright © 2012 Pearson Education, Inc.