Images, Animation, and Randomness

1. Use images and randomness to animate our Actors. James Brucker Revised July 2014 Images, Animation, and Randomness

2. Topics how to animate actors use randomness animate crabs, worms, and lobster Materials Crabgame

3. Animating an Actor We want the Crab to look more alive. A Crab should move its legs and claws.

4. How to Create Animation? Use asequenceof images that differ a little. Change the image every few milliseconds. image0 image1 image2 image3 image4 image5

5. Crabgame has 2 Crab image files Right click on Crab class and choose "set image". Greenfoot shows the image files. What are the 2 image files? "crab.png" "crab2.png"

6. Actor has an Image Each Actor has an image of type GreenfootImage. You can change the image using: actor.setImage( image ) Crab eat( ) move( ) setImage( ) turn( ) image1 : GreenfootImage setImage setImage image2 : GreenfootImage

7. "animate" behavior animate: if current image is image1 then set image to image2 else set image to image1 setImage( image2 ) "crab2.png" "crab.png" setImage( image1 )

8. How do we know the actor's image? ? animate: if current image is image1 then set image to image2 Actor has a getImage( ) method. It returns a reference to the current image. "==" tests if two things are the same. if ( getImage()==image1 ) setImage( image2 );

9. Create Image Objects Edit the Crab class. Create GreenfootImage objects: image1 & image2. public class Crab extends Animal { private GreenfootImageimage1 = new GreenfootImage("crab.png"); private GreenfootImageimage2 = new GreenfootImage("crab2.png"); These are attributes of a Crab

10. animate() behavior in Java • Write an animate() method in Crab. • Make it "public" so we can test it. /** Animate the actor */ public void animate( ) { if ( getImage() == image1 ) setImage( image2 ); else setImage( image1 ); }

11. Test in interactively! Create a Crab object. Right-click and invoke animate( ). Does it work?

12. Use the Animation Each time the crab moves, call animate( ). public void act( ) { moveWithKeyboard( ); animate( ); if ( canSee( Worm.class ) ) eatWithSound( Worm.class ); ... }

13. Compile and Test the Program Does the crab look more alive?

14. Worms wiggle, but not too much. Animating Worms

15. How to Animate a Worm Worm has only 1 image. We would like the worm to "wiggle" about its center line. Idea: Can we "flip" the worm image to create a new image? flip

16. Using Greenfoot Documentation (We will study this more later.) Click Help → Greenfoot Class Documentation Click on GreenfootImage Click on Methods

17. GreenfootImage Methods The documentation is shown in a Web Browser Yeah! This is what we want.

18. Create 2 Worm Images Make a copy of the worm image, then flip it. image1 = getImage() // get the worm image image2 = copyof image1 // flip image2 image2.mirrorHorizontally( )

19. Create 2 Worm Images We need to put the code in Constructor public class Worm extends Animal { private GreenfootImage image1; private GreenfootImage image2; /** Worm constructor */ public Worm( ) { image1 = getImage(); image2 = new GreenfootImage(image1); // flip the image image2.mirrorHorizontally(); } Make a copy of image1

20. Exercise: animate the Worm Animate the Worm class. /** Animate the worm */ public void animate( ) { } This code is the same as in Crab.

21. Use the Animate Method Call animate from act( ). /** Do whatever a Worm wants to do */ public void act( ) { animate( ); } Test the Code

22. Yuck ! The worms move too much. Worms all moveat same time -- not natural. What's the Solution?

23. RandOmnEss Games are interesting when things cannot be predicted. Use Random Numbers to make things different. To get a random number between 0 and 5: // a random number 0, 1, 2, 3, or 4 int rand = Greenfoot.getRandomNumber( 5 ); A random number between 0 and 10: int rand = Greenfoot.getRandomNumber(10);

24. Exercise: Move Worms Randomly animate( ) { choose a random number if the random number is 0 change the image else do nothing } • Try to write this code yourself before looking at the next slide.

25. Random Animation for Worm /** animate the worm randomly */ public void animate( ) { int rand = Greenfoot.getRandomNumber(5); if ( rand == 0 ) { // animate image if ( getImage() == image1 ) setImage( image2 ); else setImage( image1 ); } } 1/5 chance of wiggling.

26. Summary

27. Random Numbers Randomness is essential for many games. Greenfoot has a random number generator: GreenfootImage.getRandomNumber(MAX) getRandomNumber(MAX) always returns an "int" between 0 and MAX-1.

28. More Random Numbers Java also has a random number generator class. It is named Random in package java.util. Example using BlueJ Codepad: > import java.util.Random; > Random rand = new Random(); // random integer between 0 and 10 (excluding 10) > rand.nextInt( 10 ) 7 > rand.nextInt( 10 ) 0 // double between 0.0 and 1.0 (excluding 1.0) > rand.nextDouble( ) 0.1861105400031966 (double)

29. Images Every Actor has an image of type GreenfootImage. GreenfootImage image = getImage( ); To change an actor's image, create a GreenfootImage and then call setImage( ): GreenfootImage image2 = new GreenfootImage("dog.png"); setImage( image2 ); • You can modify a GreenfootImage using its methods: mirrorHorizontally( ) setTransparency( 80 )

30. Use the Documentation The Greenfoot documentation (Javadoc) tells you how to use each class. The Javadoc tells you the behavior of each class. Click Help → Greenfoot Class Documentation