1.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(1/15) MVC and Swing Joel Adams and Jeremy Frens Calvin College

2.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(2/15) Review: The Java Class Hierarchy We’ve seen that Java provides a unified class hierarchy… Almost everything in Java is ultimately derived from the Object class… Object Component Container JComponent AbstractButton JButton Number DoubleIntegerLong Throwable ErrorException IO Exception Runtime Exception

3.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(3/15) Java User Interface Widgets Original Java had the awt package of user-interface widgets: Java 1.2 added the swing package of lighter-weight widgets swing package Object Component ButtonCanvasCheckboxScrollbar … Container PanelScrollPaneWindow … JComponent AbstractButton JButton JFile Chooser JLabelJPanelJScrollPaneJTabbedPane …

4.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(4/15) Java strongly encourages UI designers to use the model-view- controller (MVC) design pattern, in which: Designing User Interfaces The application’s core functionality is isolated in a model class: This pattern lets you modify the UI (or add additional ones) without touching the app’s core functionality. The application’s user-interface is isolated in a view class: The application’s control is isolated in a controller class: Model Object View JFrame Controller i View i Controller Listener

5.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(5/15) Example Let’s build an app with a background-color-changing button. Basic Design: Sample Model Object Sample View JFrame Sample Controller Action Listener  SampleView provides the UI, and a method to modify its background  SampleModel provides the new background color  SampleController acts as mediator between them To change background Push Me SampleController

6.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(6/15) Example: SampleModel SampleModel is the simplest of our three classes: import java.awt.Color; A model “knows” nothing about the classes that use it… public class SampleModel { } private Color [] myColors = {Color.white, Color.red, Color.green, Color.blue}; private int myIndex = 0; public SampleModel() { } // nothing to do public Color getNextColor() { myIndex = (myIndex+1) % myColors.length; return myColors[myIndex]; }

7.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(7/15) Example: SampleView … defines instance variables for the GUI’s widgets: import java.awt.Color; import java.awt.event.ActionListener; import javax.swing.*; // JLabel, JButton,... public class SampleView extends JFrame {... private JPanel myPane; private JButton myButton; We could also define a JLabel instance variable for our “To change background” label, but we’ll avoid that for now

8.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(8/15) Example: SampleView (ii) The constructor actually builds the GUI: Our class only needs handles to GUI widgets if it needs to access them after they have been created… … public SampleView() { myPane = new JPanel(); myPane.add(new JLabel("To change background color")); myButton = new JButton("Push me"); myPane.add(myButton); this.setContentPane(myPane); this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); }...

9.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(9/15) Example: SampleView (iii) Pressing a JButton triggers an ActionEvent object, that is usually handled by an ActionListener object… What to do in response is the responsibility of our controller, so our view needs to provide a method to let its controller register itself as the ActionListener for our JButton :... public void setButtonActionListener(ActionListener al) { myButton.addActionListener(al); }... The API The API tells us the messages we can send to a JButton …

10.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(10/15) Example: SampleView (iv) Since our GUI has to let its controller change its background color, we need a method to do this…... public void setBackgroundColor(Color c) { myPane.setBackground(c); } } // end of class SampleView The API The API tells us the messages we can send to a JPanel … Given a Model and View, we just need a Controller…

11.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(11/15) Example: SampleController To handle a JButton ’s ActionEvent, a controller must implement the ActionListener interface: import java.awt.Color; import java.awt.event.ActionListener; public class SampleController implements ActionListener {... private SampleModel myModel; private SampleView myView; In our design, our controller has-a model and has-a view…

12.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(12/15) Example: SampleController (ii) Its constructor initializes its two components: … public SampleController() { myModel = new SampleModel(); myView = new SampleView(); myView.setButtonActionListener(this); myView.pack(); // or myView.setSize(w, h); myView.setVisible(true); }... Note that our controller uses our view’s method to register itself as the ActionListener for the view’s JButton.

13.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(13/15) Example: SampleController (iii) To implement the ActionListener interface, our controller must define method actionPerformed() … public void actionPerformed(ActionEvent ae) { Color c = myModel.getNextColor(); myView.setBackgroundColor(c); }... Each press of the JButton in our view, the JRE sends the actionPerformed() message to that button’s ActionListener (i.e., our controller), causing this method to be executed.

14.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(14/15) Example: SampleController (iv) Finally, our controller must define the main() method so that execution begins with itself: … public static void main(String [] args) { SampleController sc = new SampleController(); } } // end of class SampleController Now, when we run our app: java SampleController our main() method creates an instance of the controller, which creates instances of the model and view, and then begins handling user-events (clicks on the JButton ).

15.  2003 Joel C. Adams. All Rights Reserved. Calvin CollegeDept of Computer Science(15/15) Exercise Go to today’s exercise and complete parts I, II, and III