Mathematics for Computer Graphics - Lecture 13

Size: px

Start display at page:

Download "Mathematics for Computer Graphics - Lecture 13"

Aron Matthew Brown
6 years ago
Views:

1 Mathematics for Computer Graphics - Lecture 13 Dr. Philippe B. Laval Kennesaw State University October 10, 2003 Abstract This document is about creating Java Applets as they relate to the project we are developing in class. 1 Java2D As we have mentioned many times, our goal is to develop a java applet which will represent 3D objects on a 2D screen. Though the Java language does a lot of this for us, we will develop almost everything ourselves. We will only use a few of the methods Java provides. These methods are included in the Graphics or Graphics2D package. This package comes with the Java distribution, so nothing extra has to be installed. See the section entitled "Drawing" below, to see the list of the methods we will borrow from Java to do our job. To explain how one can draw in an applet, I have written java code for the skeleton of an applet. This applet uses some of the components you are most likely to use in your assignment. The applet is not entirely done. It just contains the code which draws the various components on the applet. As an assignment, you will have to finish coding the applet. Let us now go through the code of the applet and explain it, line by line. As you read this document, you should follow the code with line numbers for the applet which is available on my site. This applet is called AppletSample, it written using the AWT toolkit. The applets we talked about in the previous lecture were written using Swing. This way, you will have been exposed to both technologies. 1.1 Basics of a Java Applet (AWT) All AWT applets are subclasses of the class Applet. Java applets are not executed like a standard application. Instead, they must run inside a java enabled browser. Each applet must be accompanied by an html file which will be used to launch the applet. It defines an area on a web page, then puts various components the user will interact with. A Java applet is event driven. This means 1

2 that after the applet has been drawn, it waits for the user to interact with it. As the user interacts with the applet, events are triggered. The code of the applet handles the events as they are being triggered. When writing an applet, one must know the following: 1. What components can be drawn on an applet, how are they drawn? 2. What are the events each component can trigger? 3. How are these events caught? How are they handled? To better understand how an applet functions and how to write one, it helps to think of a java applet as having two states. 1. The initial state, how the applet appears when it starts. 2. The working state, what the applet becomes as the user is working with it. Each applet must contain at least two methods, which correspond to the two states: 1. public void init() This method is executed automatically when the applet starts. It is executed only once during the life of the applet. It is the method which draws the applet in its initial state. In this method, you should put all the code which has to be executed before the applet is used. It should contain the following: (a) Code to set up the various components which go in the applet. If youlookattheinitmethodofappletsample, this is what it does. (b) Anything which must be done before the applet starts. This includes initializing variables. 2. public void paint(graphics g) The argument passed with this method is called a "Graphics context". It is needed to use any of the routines provided by the Graphics or Graphics2D packages. We will talk more about this below, in the section called "Drawing". This method should contain the code which changes the applet after its initial state. 1.2 HTML file to launch an applet. Thecodetolaunchanappletisverysimple.Thecodebelowistheentirehtml file used to launch the AppletSample applet. 2

3 <HTML> <HEAD> <TITLE>Sample Applet HTML</TITLE> </HEAD> <BODY> <APPLET CODE="AppletSample.class" WIDTH=605 HEIGHT=450></APPLET> </BODY> </HTML> Most of this code is actually part of every html file. The only line which launches the applet is the line containing the tag "APPLET CODE" The name of the applet must be specified, as well as the size of the area on the web page the applet will use. 1.3 Components of a Java Applet (AWT) This section will not list all the possible components. Neither will it list everything there is to know about each component. Only the most used components are listed, so you will know they are available. The code in AppletSample will show you how to set most of them up, and how to work with them. The idea is that once you know they exist, if you want to use them, come ask me. I ll explain you how to use them. Going over each component in details is done in a CS class, not a math class Button This class creates a labeled button. The application can cause some action to happen when the button is pushed. When a button is pressed and released, AWT sends an instance of Action- Event to the button, by calling processevent on the button. The button s processevent method receives all events for the button; it passes an action event along by calling its own processactionevent method. The latter method passes the action event on to any action listeners that have registered an interest in action events generated by this button. If an application wants to perform some action based on a button being pressed and released, it should implement ActionListener and register the new listener to receive events from this button, by calling the button s addactionlistener method. The application can make use of the button s action command as a messaging protocol. The applet AppletSample contains a button. Line 194 declares the button, it is called buttonreset. Lines define the button. They tell the applet how to draw it. Buttons respond to an actionperformed event. Such an event is declared on line 172. Line 173 registers the event listener with the button. Lines contain the code for the event listener. You should not change 3

4 it. Lines contain the code for the event handler. This is where you put your code which will perform the action you want to perform when the button is pressed Check Box A check box is a graphical component that can be in either an "on" (true) or "off" (false) state. Clicking on a check box changes its state from "on" to "off," or from "off" to "on." The applet AppletSample contains two check boxes. They are declared on lines 186 and 199. Lines and define the button. They tell the applet how to draw it. CheckBoxes respond to the ItemStateChanged event. Such an event is declared on line 159. Lines 160 and 161 registers the event listeners for this event with each checkbox. Lines define the code for the event listener. You should not change it. Lines contain the code for the event handler. This is where you put your code which will perform the action you wanttoperform whenthecheckboxisclicked on. The method public boolean getstate() can be used to see if the check box is checked or not. Ifit returns true, it is checked. Otherwise, it will return false. The method public void setstate(boolean state) sets the state of this check box Choice The Choice class presents a pop-up menu of choices. The current choice is displayed as the title of the menu. The applet AppletSample contains a choice list. Line 193 declares the choice list, it is called choicecolor. Lines define choicecolor. They tell theapplethow to draw it. Achoicelistresponds toanitemstatechanged event. Suchanevent is declared on line 159. Line 171 registers the event listener with the button. Lines contain the code for the event listener. You should not change it. Lines contain the code for the event handler. This is where you put your code which will perform the action you want to perform whenachoiceismade from that list. The method public int getselectedindex() returns the index of the selected item. Like arrays, the first item has index 0. The method public void select(int pos) sets the selected item at the given position Label A Label object is a component for placing text in a container. A label displays a single line of read-only text. The text can be changed by the application, but a user cannot edit it directly. The applet AppletSample contains several labels. Lines 182, 185, 188, 192, and 196 declares them. Toseehow one is drawn, look at lines

5 There is no interaction with this item Panel Panel is the simplest container class. A panel provides space in which an application can attach any other component, including other panels. The applet AppletSample contains three panels. They are declared on lines 180, 181, 184. To see how one is drawn, look at lines Panels can be configured to monitor events. The code would be similar to the code mentioned above for other components Scroll Bar The Scrollbar class embodies a scroll bar, a familiar user-interface object. A scroll bar provides a convenient means for allowingausertoselectfrom a range ofvalues. A scroll bars could be used as slider controls: Alternatively, a scroll bar can represent a range of values. For example, if a scroll bar is used for scrolling through text, the width of the "bubble" or "thumb" can represent the amount of text that is visible. Scrollbars can be vertical or horizontal. They are not used in the applet AppletSample. Ifyou decide touseone, either look at a java book, or come see me Text Area A TextArea object is a multi-line region that displays text. It can be set to allow editing or to be read-only. The applet AppletSample contains one text area, on the Messages panel. It isdeclared on line 183. Lines 68, 69 define it. They tell the applet how and where to draw it. This item in this applet does not respond to any messages. However, it could monitor events like the other components. If you want to enable such events, look in a java book, or come see me. The method public void append(string s) can be used to append text at the end of thetextalready in this component. The method public void insert(string s, int pos) canbeused to insert text at the specified position in this component. The method public String gettext() canbeused to get the text of this component. The method public void settext(string s) canbeused to set the text of this component. The are many more methods, see me if you feel you need them Text Field A TextField object is a text component that allows for the editing of asingle line of text. 5

6 The applet AppletSample contains several text fields. They are declared on lines 187, , 195, 197, 198 and 200. To see how one is drawn, look at lines 108, 109. Text areas can be set to monitor various events (see me for a complete list). The one you are likely to use is the focus event (loose or gain). Suchanevent is declared on line 162. Lines declare the listeners for this event for each component for which it is enabled. The code for the event listener can be found on lines You should not change this code. The handlers for this event, for each component for which it is enabled can be found on lines This is where you put your code tohandle this event. The method public String gettext() canbeused to get the text of this component. The method public void settext(string s) canbeused to set the text of this component. The are many more methods, see me if you feel you need them. 2 Drawing 2.1 More on the paint method Its format is public void paint(graphics g). This method is called each time the applet s output must be redrawn. This can occur for several reasons. The window where the applet is may have been hidden, then brought back to focus. The applet window may have been minimized, or resized. The applet may have been internally modified. The code in the applet may have drawn additional objects. Paint is also called every time the applet starts. There is a paint method for the applet as well as for every component on the applet. The paint method of a component only redraws the components it contains. For example, the paint method of the AppletSample applet only redraws whatitcontains, that is the three panels. When each panel is being redrawn, it, in turns, calls the paint method of each of the components it contains. And so on. Each component has its own paint method predefined. You do not need to worry about it. Each predefined component knows how to draw itself. The only we have changed is the paint method of the graph panel. This panel will be drawn by us. There is no way the applet would know how to redraw it. To redefine it, we had to override the paint method of the panel class. For this, we declared a new class, called mypanel (see line 180). This new class is defined on lines The keyword "extends" means that it is a copy of the class it extends, that is Panel. Only the methods we redefine in this new class will 6

7 override the methods of the same name in the Panel class. We could also, if we need to, add new methods. The only method we want to override is paint. This is what we did. In the paint method of this class, you should put the code which will draw the various objects in the panel. 2.2 Requesting Repainting As a general rule, an applet writes to its window only when its paint method is called. Even if you ask the applet to draw astringoraline, the line will not be drawn until paint is called. There are instances when the applet will know it has to redraw itself. For example, if it regains focus, the windowing system will send it a message telling it to redraw itself. The applet will then invoke its paint method. There are times when the applet will not know. For example, if the user has changed the coordinates of a corner of the a rectangle, the applet does not know that the corner is related to a rectangle. In such a case, the applet hastobetold to redraw itself. The simplest way to accomplish this is to use the repaint method. Its signature is public void repaint(). When this method is called, it will cause the whole applet to be redrawn. Each component also has a repaint method. When it is called, only that component will be redrawn. To call it, use the name of the component. For example, to call the repaint method of panelgraph, use panelgraph.repaint(). 2.3 Simple Drawing Methods The methods you will need to finish the AppletSample applet are: void drawstring(string s, int x, int y) Draws the string s starting at the specified location. How big the drawn object is depends onthetext, its font and the size of the font. There are also methods to find this information. void drawline(int x 1,inty 1,intx 2,inty 2 ) Draws a line between (x 1,y 1 ) and (x 2,y 2 ).These are coordinates in pixels. void drawrect(int x, int y, int width, int height). Drawsarectanglewhose upper left corner is (x, y) with the specifiedwidth and hieght. Color getcolor() returns the current color. void setcolor(color newcolor) sets the current color. There are several colors predefined in the Color class you can use. They include Color.black,Color.blue,Color.darkGray, Color.gray, Color.lightGray, Color.green, Color.orange, Color.red, Color.white, Color.yellow. Remark 1 The coordinates specified are always with respect to the component of the Graphics context. If we are in the paint method of the applet, then all 7

8 coordinates are with respect to the area of the applet. If we are in the paint method of the panelgraph, then the coordinates are with respect to this panel. This is another advantage of having overridden the paint method of panelgraph. (0, 0) corresponds to the upper left corner of that component. 3 Assignment Please, feel freetocomeseemeasoften as you need. I will help you with the code I am asking you to write. The goal of this assignment is for you to understand how a java appletisprogrammed. You are to do thefollowing: Complete the code for the applet discussed in class (you can download the skeleton from my site) so that the applet does the following: When the applet starts, besides drawing itself, it should also set all the field, choices and check boxes to default values. I will let you pick the default values. When the user clicks on the various components, write the code to make each component respond. For example, if the state of a check box changes, redraw the applet accordingly. If the color used to draw is changed, redraw the applet accordingly. If the value in one of the text fields is changed, redraw theappletaccordingly. When the user clicks on any of the components, have a description saying what the component does and how to use it in the message area. When the RESET button is pressed, all the fields should be reset to their default values. You will give methejava files, the html file and the class file. This is due on Wednesday October Resources Thisisalistof books and other resources I used to compile these notes. References [BG1] Burger, Peter, and Gillies, Duncan, Interactive Computer Graphics, Addison-Wesley, [DD1] Deitel, H.M., and Deitel, P. J., Java, How to Program, Prentice Hall, [DP1] Dunn, Fletcher and Parberry, Ian, 3D Math Primer for Graphics and Game Development, Wordware Publishing, Inc.,

9 [FD1] Foley, J.D., Van Dam, A., Feiner, S.K., and Hughes, J.F., Computer Graphics, Principles and Practices, Addison-Wesley, [FD2] Foley, J.D., Van Dam, A., Feiner, S.K., Hughes, J.F., and Philipps, R.L., Introduction to Computer Graphics, Addison-Wesley, [H1] Hill, F.S. JR., Computer Graphics Using Open GL, Prentice Hall, [LE1] Lengyel, Eric, Mathematics for 3D Game Programming & Computer Graphics, Charles River Media, Inc., [SH1] Schildt, Herbert, Java2, The Complete Reference, McGraw-Hill, 2001 [SE1] Schneider, Philip J., and Eberly, David H., Geometric Tools for Computer Graphics, Morgan Kaufman, [SP1] Shirley, Peter, Fundamentals of Computer Graphics, A KPeters, [SJ1] Stewart, James, Calculus, Concepts and Contexts, second edition, Brooks/Cole, [WG1] Wall, David, and Griffith, Arthur, Graphics Programming with JFC, Wiley, [AW1] Watt, Alan, 3D Computer Graphics, Addison-Wesley, [AW2] Watt, Alan, The Computer Image, Addison-Wesley,

Mathematics for Computer Graphics - Ray Tracing III

Mathematics for Computer Graphics - Ray Tracing III Dr. Philippe B. Laval Kennesaw State University November 12, 2003 Abstract This document is a continuation of the previous documents on ray tracing.