Java: Animation Chris North cs3724: HCI

Animation? Changing graphics over time Examples: cartoons Clippy, agents/assistants Hour glass Save dohicky Progress bar Copy file Amit’s pulsating plot

Purvi Algorithm Animation

Java Graphics Review Extend JPanel Override paintComponent( ) method public class MyPanel extends JPanel { public void paintComponent(Graphics g){ super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; // my graphics here: g2.drawString("Hello World", 10, 10); }

Ticker

Animating the ticker text Keep repainting graphics using different x public class MyPanel extends JPanel { int x; public void paintComponent(Graphics g){ super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; // my graphics here: g2.drawString("Hello World", x, 10); }

Animation Loop Update x location (member variable) Repaint While(true){//infinite loop x = x – 1; repaint(); //calls paintComponent() Thread.sleep(10); //slow down animation } Problem?

Multi-Threading Loop prevents other parts of code from executing User events pile up Multiple threads let multiple methods execute simultaneously (multi-tasking) Threads = lightweight processes, shared memory Main thread User interaction Anim thread Update graphics

Java Threads implement Runnable interface Override run( ) method Put animation loop here new Thread(runnable) Thread.start( ) Calls runnable.run( ) in new thread Runnable run( ) Thread start( ) My Panel

Simplifying MyPanel implements Runnable Runnable run( ) Thread start( ) My Panel Thread start( ) My Panel Runnable run( )

Threaded Ticker public class MyPanel extends JPanel implements Runnable { int x = 100; Thread mythread; public MyPanel(){ // constructor mythread = new Thread(this); mythread.start(); } public void run(){ while(true){// animation loop x = x – 5; repaint(); Thread.sleep(100); } public void paintComponent(Graphics g){ super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; g2.drawString("Hello World", x, 10); // my graphics } or in button code that starts animation

Stopping a Thread Stop animation loop with a flag mythread = null; will cleanup thread object Boolean runMyAnimation; While(runMyAnimation){//flag stops loop x = x – 5; repaint(); //calls paintComponent() Thread.sleep(100); //slow down animation }

Controlling Animation Speed While(true){ x = x – 5;//animation step size repaint(); Thread.sleep(100); //delay between steps } Milliseconds 1000 = 1 second

Animation Summary In a secondary thread: 1.Make changes to global state 2.Repaint 3.Sleep delay 4.Repeat Use double buffering as needed

JBuilder Example