2. C OMP 401 U SER -I NTERFACE VS. M AIN T HREADS Instructor: Prasun Dewan

3. 2 P REREQUISITE Animation Threads Commands

4. 3 A NIMATIONS FROM M AIN public static void main(String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); ShuttleAnimator shuttleAnimator = new AShuttleAnimator(); shuttleAnimator.animateFromOrigin(aShuttle, 5, 100); } No thread as single animation

5. 4 A NIMATIONS FROM M AIN public static void main(String[] args) { PlottedShuttle shuttle1 = new AnObservablePlottedShuttle(50, 100); OEFrame oeFrame1 = ObjectEditor.edit(shuttle1); oeFrame1.hideMainPanel(); oeFrame1.setLocation(0, 0); oeFrame1.setSize(400, 400); PlottedShuttle shuttle2 = new AnObservablePlottedShuttle(100, 50); OEFrame oeFrame2 = ObjectEditor.edit(shuttle2); oeFrame2.hideMainPanel(); oeFrame2.setLocation(400, 0); oeFrame2.setSize(400, 400); ShuttleAnimator shuttleAnimator1 = new AShuttleAnimator(); ShuttleAnimator shuttleAnimator2 = new AShuttleAnimator(); concurrentDemoShuttleAnimation(shuttleAnimator1, shuttle1); concurrentDemoShuttleAnimation(shuttleAnimator2, shuttle2); } Threads created, as multiple independent animations wanted

6. 5 S INGLE A NIMATION F ROM M AIN : N O S PECIAL T HREAD APlotted Shuttle APlotted Shuttle AShuttleAnimator main animate Shuttle() setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread

7. 6 C ONSIDER S INGLE A NIMATION public static void main(String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); ShuttleAnimator shuttleAnimator = new AShuttleAnimator(); shuttleAnimator.animateFromOrigin(aShuttle, 5, 100); } Start animation from the user interface? Extension of ShuttleAnimator that allows parameters to be properties We can edit these properties interactively and start animation with them as parameters

8. 7 GUI

9. 8 M AIN VS. I NTERACTIVE A NIMATION public static void main(String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); ShuttleAnimator shuttleAnimator = new AShuttleAnimator(); shuttleAnimator.animateFromOrigin(aShuttle, 5, 100); } public static void main (String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); FancyShuttleAnimator shuttleAnimator = new AFancyShuttleAnimator(); ObjectEditor.edit(shuttleAnimator); }

10. 9 F ANCY A NIMATOR public class AFancyShuttleAnimator extends AShuttleAnimator implements FancyShuttleAnimator { int animationStep = 5; int animationPauseTime = 100; PlottedShuttle shuttle; public AFancyShuttleAnimator(PlottedShuttle theShuttle) { shuttle = theShuttle; } public int getAnimationStep() { return animationStep; } public void setAnimationStep(int animationStep) { this.animationStep = animationStep; } public int getAnimationPauseTime() { return animationPauseTime; } public void setAnimationPauseTime(int animationPauseTime) { this.animationPauseTime = animationPauseTime; } public void animateShuttle() { animateFromOrigin(shuttle, animationStep, animationPauseTime); }

11. 10 V IDEO

12. 11 W HEN DOES M AIN T ERMINATE ? public static void main(String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); ShuttleAnimator shuttleAnimator = new AShuttleAnimator(); shuttleAnimator.animateFromOrigin(aShuttle, 5, 100); } public static void main (String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); FancyShuttleAnimator shuttleAnimator = new AFancyShuttleAnimator(); ObjectEditor.edit(shuttleAnimator); } Main thread executes loop Main thread starts UI UI Thread (created by Java) executes loop Main thread terminates

13. 12 C ONSIDER S INGLE A NIMATION UI Thread (created by Java) executes loop Main thread executes loop Main thread starts UI and terminates

14. 13 I NTERACTIVE A NIMATION : N O SPECIAL T HREAD APlotted Shuttle APlotted Shuttle AFancy ShuttleAnimator main setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread JFrame setVisible() AWT Thread setVisible() JFrame animate FromOrigin() animate Shuttle()

15. 14 S INGLE A NIMATION F ROM M AIN : N O S PECIAL T HREAD APlotted Shuttle APlotted Shuttle AShuttleAnimator main setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread setVisible() JFrame AWT Thread animate FromOrigin() animate Shuttle()

16. 15 I NTERLEAVING W ITH UI T HREAD while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); }

17. 16 L OOP E XECUTES while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); }

18. 17 L OOPING T HREAD U PDATES S HUTTLE AND E NQUEUES R EPAINT E VENT while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } //in Java component showing //the shuttle public void repaint() { enqueueRepaintEvent( this ); } while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); }

19. 18 L OOP R E -E XECUTES while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); }

20. 19 L OOPING T HREAD U PDATES S HUTTLE AND E NQUEUES A NOTHER R EPAINT E VENT while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } //in Java compoent showing //the shuttle public void repaint() { enqueueRepaintEvent( this ); }

21. 20 L OOP F INISHES while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); }

22. 21 UI T HREAD P ROCESSES E NQUEUED P AINTS while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } public void paint(Graphics g) { //draw shuttle }

23. 22 UI T HREAD W AITS FOR N EXT E VENT while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); }

24. 23 C ONCURRENT F ANCY A NIMATOR public class AConcurrentShuttleAnimator extends AFancyShuttleAnimator { public AConcurrentShuttleAnimator(PlottedShuttle theShuttle) { super(theShuttle); } public void animateShuttle() { Thread thread = new Thread( (new AShuttleAnimationCommand( this, shuttle, animationStep, animationPauseTime))); thread.start(); }

25. 24 S TARTING C ONCURRENT F ANCY A NIMATOR public static void main (String[] args) { PlottedShuttle shuttle = new APlottedShuttle(50, 100); OEFrame oeFrame = ObjectEditor.edit(shuttle); oeFrame.hideMainPanel(); oeFrame.setSize (450, 450); FancyShuttleAnimator shuttleAnimator = new AConcurrentShuttleAnimator(); ObjectEditor.edit(shuttleAnimator); }

26. 25 I NTERACTIVE A NIMATION : S PECIAL T HREAD APlotted Shuttle APlotted Shuttle AConcurrentFancy ShuttleAnimator main setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread JFrame setVisible() AWT Thread setVisible() JFrame Shuttle Animation Thread AShuttleAnimation Command run() animate FromOrigin() animate Shuttle()

27. 26 UI E VENT L OOP while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); } AWT Thread Event Loop Mouse Click

28. 27 UI E VENT L OOP AND A NIMATIONS while ( true ) { //wait for and process paint, // menu and other events waitForAndProcessNextQueuedUIEvent(); } AWT Thread while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } Listener Code Event Loop Mouse Click Repaint New UI event not processed until listeners for previous event finish Animating listener should create new thread for animation code

29. 28 I NTERACTIVE A NIMATION : S PECIAL T HREAD APlotted Shuttle APlotted Shuttle AConcurrentFancy ShuttleAnimator main setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread JFrame setVisible() AWT Thread setVisible() JFrame Shuttle Animation Thread AShuttleAnimation Command run() animate FromOrigin() animate Shuttle()

30. 29 V IDEO The animation method is synchronized

31. 30 GUI P ROCESSING Even if main thread terminates, the application continues to run as long as a GUI has been created, which creates the GUI thread. A single GUI thread is created for processing the controller (menu/button/… processing) and view (repaint) actions of all models. View updates cannot occur until controller returns. Controller action should result in a new thread if it starts an animation. If a single animation is started from main then no thread needs to be created a main thread executes loop and separate GUI thread updates view.

32. 31 E XTRA S LIDES

33. 32 N EW L OOPING T HREAD C REATED while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); }

34. 33 W AIT FOR N EXT E VENT W ITHOUT B LOCKING while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); }

35. 34 L OOPING T HREAD B ECOMES C URRENT while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); }

36. 35 L OOPING T HREAD U PDATES S HUTTLE AND E NQUEUES R EPAINT E VENT while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } //in Java panel showing //the shuttle public void repaint() { enqueueRepaintEvent( this ); }

37. 36 N EW T HREAD E XECUTES S LEEP while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); }

38. 37 UI T HREAD B ECOMES C URRENT AND E XECUTES P AINT while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } public void paint(Graphics g) { //draw shuttle }

39. 38 A NIMATION T HREAD B ECOMES C URRENT while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); }

40. 39 L OOPING T HREAD U PDATES S HUTTLE AND E NQUEUES R EPAINT E VENT while ( true ) { //wait for and process paint, // menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep( animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } //in Java panel showing //the shuttle public void repaint() { enqueueRepaintEvent( this ); }

41. 40 I NTERACTIVE A NIMATION : N O SPECIAL T HREAD APlotted Shuttle APlotted Shuttle AFancy ShuttleAnimator main setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread JFrame setVisible() AWT Thread setVisible() JFrame animate FromOrigin() animate Shuttle()

42. 41 S INGLE A NIMATION F ROM M AIN : N O S PECIAL T HREAD APlotted Shuttle APlotted Shuttle AShuttleAnimator main setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread setVisible() JFrame AWT Thread animate FromOrigin() animate Shuttle()

43. 42 I NTERACTIVE A NIMATION : N O SPECIAL T HREAD APlotted Shuttle APlotted Shuttle AFancy ShuttleAnimator main animate Shuttle() setShuttleX(Y)() Main Class JPanel repaint() paint() Main Thread JFrame setVisible() AWT Thread setVisible() JFrame animate Shuttle() Shuttle Animation Thread AShuttleAnimation Command run()

44. 43 S YNCHRONIZATION Methods that access global state and can be executed by multiple threads should be made synchronized The synchronized keyword should also be used in declaration of all methods that access variables changed by the animation method.

45. 44 A NIMATION S TEPS Animation consists of one or more animation steps An animation step updates one or more animating graphical properties such as size, location, and icon of one or more graphical objects and then pauses execution

46. 45 P AUSING E XECUTION Execution can be paused using busy waiting or a sleep call provided by the operating system Busy waiting has the problem that it is platform- specific and does not allow other activity to proceed while the animation is paused Therefore using the sleep call is preferable

47. 46 I NCREMENTAL U PDATES After each animation step, all displays of the animation must be updated The refresh operation can be used to do ensure these updates are made. Or The observable-observer concept can be used to ensure these updates are made for each graphical property changed by the animation, the class of the property should allow observers to be registered and the setter of the property informs the observers about the update ObjectEditor requires the JavaBeans observer- observer approach based around the PropertyChangeListener interface

48. 47 T HREADS If we want multiple animations then we must create our own threads Threads use command objects. Command objects represent method calls

49. 48 UI P ROCESSING while ( true ) { //process paint, menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep(animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } //in Java panel showing the shuttle public void repaint() { enqueueRepaintEvent( this ); } UI Thread will not process queued paint event until called method returns

50. 49 C ONCURRENT A NIMATION while ( true ) { //process paint, menu and other events processNextQueuedUIEvent(); } while (curY < originalY) { ThreadSupport.sleep(animationPauseTime); curY += animationStep; shuttle.setShuttleY(curY); } //in Java panel showing the shuttle public void repaint() { enqueueRepaintEvent( this ); } UI Thread will not process queued paint event until called method returns

51. 50 A RCHITECTURE ASynchronizedShuttle Animator AShuttleAnimation Command Main Thread AShuttleAnimation Command Shuttle Animation Thread 1 Shuttle Animation Thread 2 JFrame run() main animate Shuttle() setVisible() AWT Thread setShuttleX(Y)() ASynchronizedShuttle Animator setVisible() animate Shuttle() JPanel repaint() paint() JFrame APlotted Shuttle APlotted Shuttle Main Class

52. 51 GUI