1. ISE 582: Information Technology for Industrial Engineering Instructor: Elaine Chew University of Southern California Department of Industrial and Systems Engineering Lecture 8 JAVA Cup 7: Model-View Design Winston & Narasimhan: Chapt 41, 42

2. 7 November 2001Information Technology for IE2 GUI Design: Model-View Approach Class Types Relations Among Class Types Turning the Movie Class into an Observable Class Using the Observer A Meter Listener for MouseClicks RECAP

3. 7 November 2001Information Technology for IE3 Class Types Model Classes: domain knowledge View Classes: information-display Observer / Listener (Adapter) Classes: model-view connections Application Class: –Creates model/view/observer/listener instances –Connects model->(observer)->view and view- >(listener)->model –Establish container-component relations among views

4. 7 November 2001Information Technology for IE4 Relations Among Class Types Model View Application

5. 7 November 2001Information Technology for IE5 Model: Movie Interface import java.io.*; public interface MovieInterface { // Setters public abstract void setScript (int i) ; public abstract void setActing (int i) ; public abstract void setDirection (int i) ; // Getters public abstract int getScript () ; public abstract int getActing () ; public abstract int getDirection () ; public abstract String getTitle () ; public abstract String getPoster () ; // Miscellaneous methods public abstract int rating () ; public abstract void changed () ; }

6. 7 November 2001Information Technology for IE6 Making Movies Observable import java.util.*; public class Movie extends Observable implements MovieInterface { // Define instance variables: String title, poster; int script=5, acting=5, direction=5 // Define 3-parameter constructor: Movie (int s, int a, int d) // Define 4-parameter constructor: Movie (int s, int a, int d, String t) // Define 5-parameter constructor: Movie (int s, int a, int d, String t, String p) // Define setters: setScript, setActing, setDirection // Define getters: getScript, getActing, getDirection, getTitle, getPoster // Define rating method // Define changed method }

7. 7 November 2001Information Technology for IE7 Notifying Observers Blah blah blah… // Define setters and getters: public void setScript(int s) { script = s; setChanged(); notifyObservers(); } etc. … Blah blah blah… // changed method defined here public void changed () { setChanged(); notifyObservers(); } Blah blah blah… Activates connected observers and reset notification apparatus Establishes that a change worthy of note has occurred

8. 7 November 2001Information Technology for IE8 Professional Flourish Blah blah blah… private static int MIN=0, MAX=10; Blah blah blah… // changed method defined here public void setScript (int s) { if (script != s) { script = Math.max( Math.min(s,MAX), MIN ); setChanged(); notifyObservers; } Blah blah blah…

9. 7 November 2001Information Technology for IE9 Creating Movie in the M.App Blah blah blah … public void setMeter (Meter m) {meter = m;} public Meter getMeter() {return meter;} public void setMovie (Movie m) {movie = m;} public Movie getMovie() {return movie;} public static void main (String argv []) { new MovieApplication("Movie Application"); } private Meter meter; private Movie movie; public MovieApplication(String title) { super(title); setMeter(new Meter(0, 30)); setMovie(new Movie (5, 5, 5, "On to Java")); getContentPane().add("Center", getMeter()); addWindowListener(new LocalWindowListener()); setSize(300, 100); show(); } etc… Application

10. 7 November 2001Information Technology for IE10 On Demand Construction Blah blah blah … public void setMeter (Meter m) {meter = m;} public Meter getMeter() {if (meter==null) {setMeter(new Meter(0,30));} return meter;} public void setMovie (Movie m) {movie = m;} public Movie getMovie() {if (movie==null) {setMovie(new Movie (10,10,10,”Title”);} return movie;} public static void main (String argv []) { new MovieApplication("Movie Application"); } private Meter meter; private Movie movie; public MovieApplication(String title) { super(title); setMeter(new Meter(0, 30)); setMovie(new Movie (5, 5, 5, "On to Java")); getContentPane().add("Center", getMeter()); addWindowListener(new LocalWindowListener()); setSize(300, 100); show(); } etc… Application

11. 7 November 2001Information Technology for IE11 Using the Observer Define an Observer class that implements the Observer interface Embed it in the MovieApplication class as a private local class Connect an Observer to a model using addObserver method Do the connecting in the setMovie method to ensure correct correspondence

12. 7 November 2001Information Technology for IE12 The Local Observer Class Application Blah blah blah … public void setMovie (Movie m) { if(movie == m) {return;} if(movie instanceof Movie) {movie.deleteObservers();} if(m instanceof Movie) { movie = m; movie.addObserver(new LocalMovieObserver()); movie.changed(); }} private class LocalMovieObserver implements Observer { public void update (Observable observable, Object object) { getMeter().setValue(getMovie().rating()); getMeter().setTitle(getMovie().getTitle()); }}

13. 7 November 2001Information Technology for IE13 A Listener for the Meter Application Blah blah blah … public void setMeter (Meter m) { meter = m; meter.addMouseListener(new LocalMeterListener()); } Blah blah blah … private class LocalMeterListener extends MouseAdapter { public void mouseClicked (MouseEvent e) { int x = e.getX(); int y = e.getY(); int v = (int) Math.round(getMeter().getValueAtCoordinates (x, y) / 3.0); getMovie().setScript(v); getMovie().setActing(v); getMovie().setDirection(v); }} Blah blah blah …

14. 7 November 2001Information Technology for IE14 On MouseClick on Meter getX, getY, getValueAtCoordinates setScript, setChanged, notifyObservers setActing, setChanged, notifyObservers setDirection, setChanged, notifyObservers Update rating, setValue, repaint, paint Application MovieObserverListenerMeter

15. 7 November 2001Information Technology for IE15 Standalone Observers / Listeners Goal: move Observers / Listeners into independent files Changes: –Establish a MovieApplication instance variable in the class –Include the application instance as an argument to the constructor –Assign the application instance variable in the constructor

16. 7 November 2001Information Technology for IE16 Example: Old format import java.util.*; public class MovieObserver implements Observer { public void update (Observable observable, Object object) { getMeter().setValue(getMovie().rating()); // BUG! getMeter().setTitle(getMovie().getTitle()); // BUG! }

17. 7 November 2001Information Technology for IE17 Example: New Format import java.util.*; public class MovieObserver implements Observer { private MovieApplication applet; public MovieObserver (MovieApplication a) { applet = a; } public void update (Observable observable, Object object) { applet.getMeter().setValue(applet.getMovie().rating()); applet.getMeter().setTitle(applet.getMovie().getTitle()); } In setMovie: movie.addObserver(new MovieObserver(this));

18. 7 November 2001Information Technology for IE18 Similar Changes in MeterListener import java.awt.event.*; public class MeterListener extends MouseAdapter { MovieApplication applet; public MeterListener (MovieApplication a) { applet = a; } public void mouseClicked (MouseEvent e) { int x = e.getX(); int y = e.getY(); int v = (int) Math.round(applet.getMeter().getValueAtCoordinates (x, y) / 3.0 ); applet.getMovie().setScript(v); applet.getMovie().setActing(v); applet.getMovie().setDirection(v); }} In setMeter: meter.addMouseListener(new MeterListener(this));