Graphics and Graphical User Interfaces

Computer Graphics and Graphical User Interfaces1Graphical User Interfaces Reviewed

Excellent example of software modularity and reuseUser Interfaces are almost always assembled from libraries of predefined building blocksTo Motif programmers on Unix systems, these GUI building blocks were the widgetsWindows programmers called them controlsJava programmers called them components2Java Components OverviewJava 1.0 and 1.1 the standard library of GUI components was AWT.In addition to GUI components, AWT also includes facilities for Drawing graphicsCut-and-paste style data transferOther related operationsAWT components are implemented using operating systems native GUI system3Java Components Overview (Continued)AWT API was not as complete and full-featured as it should have beenAs a result, Java 1.2 introduced a new library of GUI components known as SwingSwing has largely replaced AWT for creation of GUIs. Swing does retain the same underlying GUI programming model of AWT.4Basics Of Creating GUIs in JavaFour basic steps to creating graphical user interfaces in Java.Create and configure the componentAdd the component to a containerArrange or lay out the componentsHandle the events generated by the components

5Creating and Configuring the ComponentsCreate a GUI component just like any other object. Call the constructor to do the jobJButton quit = new Jbutton(Quit);Once created, you probably would want to configure itquit.setFont (new Font(sansserif, Font.BOLD, 18));

Note: API documentation should be consulted to determine what methods may be available for configuration.

6Adding The Components To The ContainerAll components must be placed within a ContainerCommon containers include JFrame, JDialog, representing top-level windows and dialog boxesSince a container actually is a type of component, containers can be nested within other containers. JPanel is a good example of a container commonly used in this fashion7Arrange Or Lay Out ComponentsWhen components are added to containers, their position and size must also be specified to address the proper look & feelNot a good idea to hard-code the position or size of components within containersIt is advised to use existing layout managers for containers to lay out these components automatically and based or layout manager rules and policiesFlow Layout, Grid Layout, Border Layout, etc8Handle Events Generated By ComponentsGood looking GUI by itself is not enough!Need to respond to user interactions with the GUI, through keyboard, pointing device, etcComponents generate or fire eventsAn event is an object that contains information about user interactionNeed to add event-listeners and handlers to the GUI for full functionality

9A Closer Look At Swing

10Sample GUIimport javax.swing.JFrame;import javax.swing.JLabel;

public class FirstExample extends JFrame {

public static void main(String args[]) {new FirstExample();}

FirstExample() {JLabel lblFirst = new JLabel ("Our Very First Example...");add(lblFirst);this.setSize(170, 50);this.setVisible(true);}}11GraphicsTwo different types of graphics:Raster graphicsRepresenting images as a collection of pixelsVector graphicsUsing geometrical primitives such as points, lines, curves or polygons to represent images. These primitives are created using mathematical equations.Both types of computer graphics have advantages and disadvantages. The advantages of vector graphics over raster include: Smaller size Ability to zoom indefinitely Moving, scaling, filling or rotating does not degrade the quality of an image

12Raster GraphicsPrimitives include:points lines polylines polygons circles ellipses Splines

13Graphics with JavaThe Java 2D APIProvides two-dimensional graphics, text, and imaging capabilitiesThe Java 2D API provides the following capabilitiesA uniform rendering model for display devices and printers A wide range of geometric primitives, such as curves, rectangles, and ellipses, as well as a mechanism for rendering virtually any geometric shape Mechanisms for performing hit detection on shapes, text, and images A compositing model that provides control over how overlapping objects are rendered Enhanced color support that facilitates color management Support for printing complex documents Control of the quality of the rendering through the use of rendering hints

14