ADVANCED TOPICS-

ANIMATION
 ANIMATION

• Animation introduces dynamic changes to

graphics contents and often creates a visual
effect of motion
• An animation produces series of rendered
images (frames) that depicts the change in a
scene
 ANIMATION CONT.
- When the frames are displayed consecutively at certain rate
(for example, 60 frames per second), we may perceive
continuous motion
- Animation adds a dimension of time to the graphics model
- Each rendered frame at a specific time instance is
essentially a regular still image
- The content of the frames may change over time
- Higher frame rates represent smoother animations, but the
frame rate of the animation is limited by the capability of
the rendering system
 ANIMATION CONT.

• A power way to create an animation on Swing

components is to separate the rendering from the
model changes.
- The rendering code is placed in the paintComponent
method of the Swing component only.
- The animation logic is placed in the separate thread
without actual rendering .
- When the data for a frame is ready, the method
repaint() is called to trigger the rendering
 ANIMATION-IN JAVA

• Animation can be implemented in Java using:

• Timer
• Threading
 ANIMATION-IN JAVA
MULTI-THREAD
- The paintComponent method contains all the rendering code to generate a
frame.
- The run method of the Runnable interface or the Thread class is overridden
to perform the animation.
- It typically contains an infinite loop to continuously generate-update- the
frames.
- A frame is rendered by calling the repaint method.
- Between two frames, the thread typically goes to sleep for a specific period
of time.
- The sleep method of Thread specifies a sleep time in milliseconds.
GENERIC OUTLINE OF MULTI-THREAD

public void paintComponent(Graphics g) {

<* render a frame *>
}

public void run() {

while(true) {
<* update frame data *>
repaint();
try {
[Link](sleepTime);
} catch (InterruptedException ex) {}
}
}
 ANIMATION USING THREAD EXAMPLE
RAIN
• A droplet can be modeled as a line with (x, y)

some length stating at some point. h initializatio

n
• Random length and random position can be
used. 1. [Link][] pts = new
[Link][1200];
• Rain is an array of droplets with each 2. for (int i = 0; i < [Link]; i++) {
droplet has an (x,y) and h. 3. pts[i] = new [Link]([Link](),
[Link]());
• Array length controls the density of rain. 4. }
1. for (int i = 0; i < [Link]; i++) {
2. int x = (int)(640*pts[i].x);
3. int y = (int)(480*pts[i].y); Rendering
4. int h = (int)(25*[Link]());
5. [Link](x, y, x, y+h);
6. }
 ANIMATION USING THREAD EXAMPLE
RAIN CONT. Updating
• Droplets should be repositioned during the
animation- by the effect of gravity. [Link] (int i = 0; i < [Link]; i++) {

2. double x = pts[i].getX();
• Repositioning is commonly affects the y
3. double y = pts[i].getY();
component only of the droplet.
4. y += 0.1*[Link]();
• If a droplet reaches the ground it should be
5. if (y > 1) {
recreated again to keep the animation.
6. y = 0.3*[Link]();

7. x = [Link]();

8. }
 ANIMATION USING THREAD EXAMPLE
RAIN- FULL CODE
1. import [Link].*; 1. class RainPanel extends JPanel implements
2. import [Link].*; Runnable{

3. import [Link].*; 2. [Link][] pts = new [Link][1200];

4. import [Link].*; 3. public RainPanel() {

5. import [Link].*; 4. setPreferredSize(new Dimension(640, 480));

6. public class Rain extends JApplet { 5. setBackground([Link]);

7. public static void main(String s[]) { 6. for (int i = 0; i < [Link]; i++) {

8. JFrame frame = new JFrame(); 7. pts[i] = new [Link]([Link](),

[Link]());
9. [Link]("Rain");
8. }
10.
[Link](JFrame.EXIT_ON_CLOSE 9. Thread thread = new Thread(this);
); 10. [Link](); }
11. JApplet applet = new Rain(); 11. public void paintComponent(Graphics g) {
12. [Link](); 12. [Link](g);
13. [Link]().add(applet); 13. [Link]([Link]);
14. [Link](); 14. for (int i = 0; i < [Link]; i++) {
15. [Link](true); 15. int x = (int)(640*pts[i].x);
16. } 16. int y = (int)(480*pts[i].y);
17. public void init() { 17. int h = (int)(25*[Link]());
18. JPanel panel = new RainPanel(); 18. [Link](x, y, x, y+h);
19. getContentPane().add(panel); 19. }}
ANIMATION USING THREAD EXAMPLE
RAIN- FULL CODE CONT.
1. public void run() {
2. while(true) {
3. for (int i = 0; i < [Link]; i+
+) {
4. double x = pts[i].getX();
5. double y = pts[i].getY();
6. y += 0.1*[Link]();
7. if (y > 1) {
8. y = 0.3*[Link]();
9. x = [Link]();
10. }
11. pts[i].setLocation(x, y);}
12. repaint();
13. try {
14. [Link](100);
15. } catch (InterruptedException
ex) {}
 ANIMATION USING TIMER
- An alternative to creating your own thread is to use the Timer class provided by
Swing
- A Timer object periodically generates an action event at a predefined rate
- The event will trigger the listeners, which may perform the rendering of a frame
- To setup a Timer object, you may specify its period and listeners in its constructors
and call its start() method
1. Timer timer = new Timer(period, listener);
2. [Link]();

- The ActionListener object should implement the rendering in its actionPerformed

method
public void actionPerformed(ActionEvent event) {
<* do frame rendering *>
}
ANIMATION TIMER JAVA CODE OUTLINE

Timer timer = new Timer(period, listener);

[Link]();

public void actionPerformed(ActionEvent event) {

<* do frame rendering *>
}
 ANIMATION WITH TIMER EXAMPLE
CLOCK
• Clock is a circular shape with three arms that
is continuously updated at each second.
• The 3 arms can simply be modeled as lines.
• Rotation transformation can be used to
reposition the 3 arms at each second.
 ANIMATION WITH TIMER EXAMPLE
CLOCK- BACKGROUND CODE
1. Paint paint = new GradientPaint(-1
• To draw the clock background we can use 150,[Link],150,150,[Link]
oval with fancy gradient paint. 2. [Link](paint);
3. [Link](-190, -190, 380, 380)
• Marks on the clock boundary are simple 4. [Link]([Link]);
5. [Link]("Java 2D", -20, 80
rectangle rotated 12 time with different 6. Stroke stroke = new BasicStroke
angle 7. [Link](stroke);
8. [Link](-190, -190, 380, 38
• The rotation angle of each mark = 9. for (int i = 0; i < 12; i++) {
10. [Link](2*[Link]/12);
11. g2.fill3DRect(-3, -180, 6, 30, tr
12. }
 ANIMATION WITH TIMER EXAMPLE
CLOCK- BACKGROUND CODE CONT.
• Clock arms are updated using rotation transform
and given the current time (h:m:s)
• Seconds arm can stop at 60 location in its full
round, so at each second it is rotated an angle of .
• Minutes arm can stop at 60 location in its full
round, so at each second it is rotated an angle of .
• Hours arm can stop at 12 locations in its full
round, so it is rotated with an angle of but the
steps of the hours arm will be rough.
• So, we can consider the number of minutes
consumed to enhance the animation of hours 1. int hour =
arm. [Link]().get([Link]);
2. int min =
[Link]().get([Link]);
3. int sec =
[Link]().get([Link]);
4. [Link]([Link] * (hour+min/60.0)/6.0);
 ANIMATION WITH TIMER EXAMPLE
1. import [Link].*;
CLOCK- FULL CODE
2. import [Link].*; 1. class ClockPanel extends JPanel implements
3. import [Link].*;
ActionListener{
4. import [Link];
5. import [Link].*; 2. AffineTransform rotH = new AffineTransform();
6. public class Clock2D1 extends JApplet
3. AffineTransform rotM = new AffineTransform();
{
7. public static void main(String s[]) { 4. AffineTransform rotS = new AffineTransform();
8. JFrame frame = new JFrame();
5. public ClockPanel() {
9. [Link]("Clock");
10. [Link](JFram 6. setPreferredSize(new Dimension(640, 480));
e.EXIT_ON_CLOSE);
7. setBackground([Link]);
11. JApplet applet = new Clock2D1();
12. [Link](); 8. Timer timer = new Timer(500, this);
13.
9. [Link]();
[Link]().add(applet);
14. [Link](); 10. }
15. [Link](true);
11. public void paintComponent(Graphics g) {
16. }
17. public void init() { 12. [Link](g);
18. JPanel panel = new ClockPanel();
13. Graphics2D g2 = (Graphics2D)g;
19. getContentPane().add(panel);
20. }} 14. [Link](320,240);
1. ANIMATION WITH TIMER EXAMPLE
Paint paint = new GradientPaint(-150,-
150,[Link],150,150,[Link]); CLOCK- FULL CODE CONT.
2. [Link](paint);
1. [Link]([Link]);
3. [Link](-190, -190, 380, 380);
2. [Link](new BasicStroke(5, BasicStroke.CAP_ROUND,
4. [Link]([Link]);
BasicStroke.JOIN_ROUND));
5. [Link]("Java 2D", -20, 80);
3. [Link](hour);
6. Stroke stroke = new BasicStroke(3);
4. [Link](minute);
7. [Link](stroke);
5. [Link](new BasicStroke(2));
8. [Link](-190, -190, 380, 380);
6. [Link](second);}
9. for (int i = 0; i < 12; i++) {
7. public void actionPerformed(ActionEvent e) {
10. [Link](2*[Link]/12);
8. int hour = [Link]().get([Link]);
11. g2.fill3DRect(-3, -180, 6, 30, true);}
9. int min = [Link]().get([Link]);
12. Shape hour = new [Link](0, 0, 0, -80);
10. int sec = [Link]().get([Link]);
13. hour = [Link](hour);
11. [Link]([Link] * (hour+min/60.0)/6.0);
14. Shape minute = new [Link](0, 0, 0, -
12. [Link]([Link] * min /30.0);
120);
13. [Link]([Link] * sec /30.0);
15. minute =
14. repaint(); }}
[Link](minute);