GUI Frameworks CS 3331 Fall 2009 CS 3331 1 Outline MVC Model GUI components widgets Layout managers Handling events CS 3331 2 MVC Model A way of cleanly breaking an application into three parts Model for maintaining data View for displaying all or a portion of the data and Controller for handling events that affect the model or views View Controller Model CS 3331 3 Separating M from VC get data from model changes model or view View Controller Model update view when data changes CS 3331 4 Due to Separation Multiple views and controllers for models model gui ppt views CS 3331 request modification change notification 5 Due to Separation Cont New views and controllers can be added for the model Changes in views are localized such changes have minimal or no impact on the model CS 3331 6 Outline MVC Model GUI components widgets Layout managers Handling events CS 3331 7 Sample GUI Program Counter applet Value CS 3331 10 Increment 8 Java GUI Frameworks GUI frameworks Part of Java Foundation Class JFC Abstract Window Toolkit AWT and Swing Framework classes GUI components or widgets Layout managers Events and event listeners Graphics and imaging classes CS 3331 9 AWT vs Swing AWT Heavyweight components Associated with native components called peers Same behaviour but platform dependent look Package java awt Swing CS 3331 Lightweight components i e no peer components Same look and feel across platforms Support pluggable look and feel Package javax swing 10 AWT Components primitive CS 3331 container 11 Swing Components Every widget is a container CS 3331 12 Composite Design Pattern To allow clients to treat both single components and collections of components identically To define recursive data structures such as trees Client uses Component operation Leaf operation CS 3331 Composite operation add Component remove Component 13 Exercise Design a class hierarchy to represent parse trees for Expression Literal Expression Expression CS 3331 14 Outline MVC Model GUI components widgets Layout managers Handling events CS 3331 15 Q How to Layout Widgets Three approaches Manually specify absolute positions Manually specify relative positions Automate it What re pros and cons CS 3331 16 Layout Managers Associated with containers Automate the layout of elements When elements are added to the container When the window is resized CS 3331 automatically adjust the positions and sizes of the elements 17 Hierarchy of Layout Managers Q Can you identify the design pattern used here CS 3331 18 Using Layout Managers Method Description setLayout lm Set lm as the layout manager add comp Add a component add comp cst Add a component with constraint public class CounterApplet extends Applet public CounterApplet setLayout new FlowLayout add new JButton Increment add new JButton Decrement CS 3331 19 Flow Layout width 400 height 50 width 100 height 120 CS 3331 20 Flow Layout Cont public class Flow extends Applet public Flow setLayout new FlowLayout add new JButton Java add new JButton C add new JButton Perl add new JButton Ada add new JButton Smalltalk add new JButton Eiffel CS 3331 21 Grid Layout 3x2 grid 0x1 grid 1x0 grid CS 3331 22 Grid Layout Cont public class Grid extends Applet setLayout new GridLayout row col public void init add new JButton Java int row 0 add new JButton C int col 0 add new JButton Perl String att getParameter row add new JButton Ada if att null add new JButton Smalltalk row Integer parseInt att add new JButton Eiffel att getParameter col if att null col Integer parseInt att if row 0 col 0 row 3 col 2 CS 3331 23 Question Why compose the GUI in the init method not in the constructor CS 3331 24 Border Layout CS 3331 25 Border Layout Cont public class Border extends Applet public Border setLayout new BorderLayout add new JButton North BorderLayout NORTH add new JButton South BorderLayout SOUTH add new JButton East BorderLayout EAST add new JButton West BorderLayout WEST add new JButton Center BorderLayout CENTER CS 3331 26 Exercise Write an applet of the following layout public class ClassRoom extends Applet public ClassRoom setLayout new BorderLayout WRITE YOUR CODE HERE CS 3331 27 Outline MVC Model GUI components widgets Layout managers Handling events CS 3331 28 Event Handling Mechanism to write control code Composed of Event Event source Event listener or handler CS 3331 29 Event Handling Cont Event A way for GUI components to communicate with the rest of application Implemented as event classes e g ActionEvent Event source Components generating events Examples buttons check boxes combo boxes etc CS 3331 30 Event Handling Cont Event listener or handler Objects that receives and processes events Must implement an appropriate listener interface Must inform the source its interest in handling a certain type of events by registering May listen to several sources and different types of events CS 3331 31 Example create a button JButton button new JButton Increment register an action listener button addActionListener new ButtonActionListener Action listener class class ButtonActionListener implements ActionListener public void actionPerformed ActionEvent e handle the event e System out println Increment button pressed CS 3331 32 How Does It Work h ActionListener b JButton addActionListener h create e ActionEvent actionPerformed e getSource CS 3331 33 Naming Convention For event XYZ Event class XYZEvent Listener interface XYZListener Adapter class XYZAdapter Registration method addXYZListener CS 3331 34 Events and Listeners Event Listener ActionEvent ComponentEvent FocusEvent KeyEvent MouseEvent ActionListener ComponentListener FocusListener KeyListener MouseListener MouseMotionListener WindowListener ItemListener TextListener WindowEvent ItemEvent TextEvent CS 3331 Adapter ComponentAdapter FocusAdapter KeyAdapter MouseAdapter MouseMotionAdapter WindowAdapter 35 Example Resizing Component To prevent windows from being resized too small use ComponentEvent and ComponentListener public class WinJava extends JFrame public WinJava String name super name setResizable true addComponentListener Util createComponentListener 400 300 CS 3331 36 Example Cont public class Util public static ComponentListener createComponentListener int width int height return new MyComponentListener width height private static class MyComponentListener extends ComponentAdapter private int width height public MyComponentListener int w int h width w height h public void componentResized ComponentEvent e Component c e getComponent