1. 1 More Animation, Images and Sound Chapter Eleven

2. 2 Chapter Topics l Getting Images from Server, Loading them into Java and displaying them in applets l Using Sounds l Sun’s Animator applet - organize animations and sounds l Double-buffering (avoid flicker)

3. 3 Retrieving and Using Images l the image class in java l Special methods in Applet and Graphics l Getting Images –getImage ( ) method with single argument »object of type URL –getImage with two arguments »URL object »path (relative to the base URL) ” FLEXIBLE”

4. 4 Applet class Methods l getDocumentBase( ) = Directory of an HTML file l http://www.myserver.com/htmlfiles/j avahtml/,getDocumentBase returns a URL pointed to by that path l getCodeBase( ) directory may not be same as HTML, attribute in l See page 197 four examples all to.gif files l.jpeg files can also be supported by Java

5. 5 Drawing Images l Once you’ve got the image (.gif,.jpeg) l What are you going to do with it ? l public void paint ( ) { –g.drawImage(img. 10, 10, this); } –img = image to display –10, 10 where x, y are –and this

6. 6 Ladybug applet - List 11.1 l import Graphics and Image l public class LadyBug extends java.applet.Applet { l Image bugimg; l public void init( ) { l bugimg = getImage(getCodeBase( ), –“images/ladybug.gif “); } l public void paint(Graphics g) { l g.drawImage(bugimg, 10, 10, this); } }

7. 7 More Ladybugs - list 11.2 Scaled with getWidth( ) getHeight( ) l The key to this program vs. 11.1 is that –g.drawImage( ); takes six arguments. l The mysterious last argument is “this” l It is an ImageObserver which enables the viewer to see how far along an images is in the loading process - you can make some decisions when the image in partially loaded

8. 8 More differences 11.2 vs. 11.1 l public class LadyBug2 extends java.applet.Applet { l public void paint(Graphics g) { l int iwidth = bugimg.getwidth(this); l int iheight = bugimg.getHeight(this); l int xpos = 10; // 25% l g.drawImage(bugimg, xpos,10,iwidth/4, iheight/4, this); // 50%, 100%, 150% later l (which image, x,y, width, height, this)

9. 9 Modifying Images - Which is possible is really something in the.AWT l color, image processing, creating bitmap images by hand. l Some of the multimedia classes deal with those topics

10. 10 Neko “cat” an anamation l Think old cartoons for a bit - how are they animated? l Somehow the stills (cells) are flipped through and the eye is fooled - it sees motion. l In Neko the.gif files are placed into an array called String neksrc[ ] = (“right1,gif “, “right2.gif”, “yawn.gif”,... etc... l See Fig 11.3 page 202 and 203 for code

11. 11 Neko contd. l Once the String nekosrc[ ] = array is loaded the program continues into a for loop l for (int i=0; i < nekopics.length; i++) l nekopics[i] = getImage(getCodeBase( ), “images/” + nekosrc[i]; } } l All this is in the public void init ( ) { l method

12. 12 What the “cat” Neko is to do: l Run into screen from left l Stop in middle, yawn l Scratch four times l Sleep “exciting yes ? “ l wake up run off right side of screen

13. 13 Original had 36 images text 9 l text repeats some of the images - run for example l To get neko to run create a method it has two positions x at start and x at end with lots of sleeping... l void pause (int time) { –try { Thread.sleep(time); } –catch (InterruptedException e) { } }

14. 14 l void nekorun (int start, int end) { l for (int i = start; i < end; i +=10) l // why ten,? try other times 10 works OK l xpos = i; // next swap images l if (currentimg = = nekopics[0]) –currentimg = nekopics[1]; –else (currentimg = = nekopics[0]); l repaint( ); l pause(150); } } // paint a one liner l public void paint(Graphics g) { –drawImage(currentimg,xpos,ypos,this);}

15. 15 Yawn and Pause - class favorites l Find the nekopics[2] and nekopics[3].gif l files....Start your count at zero from the left l Does one second seem too long to you l (1000 milli seconds = one seconds) if so change the time

16. 16 Scratching - some peoples idea of fun l Two scratch images [4] and [5] of nekopics l In a for loop l pause for 150 milli seconds (OK time length) l Top of method l void nekoscratch(int numtimes) { l The call in the program page 207 is 4 times

17. 17 Sleeping another class favorite l void nekosleep(int numtimes) { l for (int i = numtimes; i > 0; i-- ) { l currentimg = nekopics[6]; l repaint( ); pause(250); currentimg = nekopics[7]; repaint( ); pause( 250); } } l Please wake up if you are asleep at this time

18. 18 Wake UP and run off (not in class, the neko...applet ) l currentimg = nekopics[8]; l repiant( ); pause(500); nekorun(xpos, size( ).width + 10 );

19. 19 List 11.3 Final Neko applet l Pages 206, 207 and 208 the longest program thus far. l ASSIGNMENT: you are to write a program that is similar to neko. It does not have to be as long but should be presented in class next week. You do not have to create your own.gif files. You can use some of the.gif files from author or etc...

20. 20 Retreiving and Using Sounds l Java supports Sun’s AU format l HTML external files clips may sound better l play ( ); gets one argument a URL, plays it as an audio clip l play ( ); with two arguments first is URL –second is a pathname l Example : play( getCodeBase( ), “audio/meow.au”);// you may/may not get

21. 21 List 11.4 AudioLoop applet l import // Graphics and AudioClip; l public class AudioLoop extends java.awt.Applet implemets Runnable { l AudioClip bgsound; AudioClip beep; –Thread runner; l public void start( ) { if( runner = = null) { l runner = new Thread(this); runner.start( ); l } }

22. 22 l public void stop ( ) { l if (runner ! = null) { l if(bgsound ! = null) bgsound = null; } l bgsound.stop( ); runner.stop( ); runner = null; } } l public void init( ) { –bgsound = getAudioClip(getCodeBase( ), “audio/loop.au”); –beep = setAudioClip(getCodeBase( ), “audio/beep.au); –}

23. 23 Run it l public void run( ) { if (bgsound ! = null) { l bgsound.loop( ); l try { Thread.sleep(5000); } //long time l catch (InterruptedException e) { } l if (bgsound ! = null) beep.play( ); } } l public void paint (Graphics g) { g.drawString(“ Playing Sounds”, 10, 10);}}

24. 24 Sun’s Animator Applet l Create an animation loop l Add a sountrack l Add sounds to play at/in individual frames l Indicate SPEED of applets l Specify order of frames - you can re-use frames in the animation l http://java.sun.com // for more info

25. 25 Double-Buffering l Create a second surface (off screen) then at the correct time draw the whole surface onto the actual applet. l Problems - uses more memory, space. l Better to try drawing portions of screen l Overriding update( ) l The good Double-buffering nearly eliminates flicker - but avoid it if possible

26. 26 Using Double-buffering in an applet l 1. Add instance variables to hold image and grahhics contexts for off screen buffer l 2. Create an image and a graphics context when applet is initalized l 3. Do all applet painting to offscreen buffer NOT applet l 4. At end of paint ( ) draw the offscreen to real screen

27. 27 Checkers Revisited page 213 l Image offscreenImg; Graphics offscreenG; l public void init( ) { offscreenImg = createImage(size( ).width, size( ).height); l offscreenG = offscreenImg.getGraphics( );} l public void paint( Graphics g) { –offscreenG.setColor(color.black); –offscreenG.fillRect(0,0,100,100); –fillscreenG.setColor(Color.white); –offscreenG.fillRect(100,0,100,100);

28. 28 l //Draw checker l offscreenG.setColor(Color.red); l offscreenG.fillRect(xpos,5,90,90); l g.drawImage(offscreenImg, 0, 0, this); }