Solved

primitive animation using repaint();

Posted on 2001-09-01
8
521 Views
Last Modified: 2007-12-19
Hello everyone.

  I am trying to make some silly animations using basic paint graphics just for fun. this applet has two buttons the second button once pressed should cause the car to move across the page and loop around 10 times or so. But so far I have only made it so that the image moves by pressing the button over and over. Is there a way to make this loop correctly?

  Here is the code. run it on your computer you'll see what I mean. Thanks everyone.

import java.awt.*;
import java.applet.*;
import java.awt.event.*;
import java.io.*;
import java.util.*;

public class CarButton2 extends Applet implements ActionListener
{
      //use variable to move car around
      int x = 50;
      int y = 70;
      int z = 0;
      int hex = 808080;
      String rrggbb = "000000";


      //Create labels and text boxes
      TextField textField1 = new TextField(2);
      TextField textField2 = new TextField(2);
      TextField textField3 = new TextField(5);
      Label labelOne = new Label( "Enter x value" );
      Label labelTwo = new Label( "Enter Y value" );
      Label labelThree = new Label( "Enter Hex Color" );
      Label labelFour = new Label( "                " );
      Label labelFive = new Label( "                " );

      //lable my buttons
      String BUTTON_STRING = "Use cooridents";
      String BUTTON_S2 = "my animation";

      private Button button = new Button(BUTTON_STRING);
      private Button button2 = new Button(BUTTON_S2);

      // create instants of these
      MoveIt mv = new MoveIt();
      Car pc = new Car();


      public void init()
      {
            //Create user input boxes
            textField1.setText( "" );
            textField1.addActionListener( this );

            textField2.setText( "" );
            textField2.addActionListener( this );

            //Create button
            button.addActionListener( new ButtonHandler() );
            button2.addActionListener( new ButtonAnimate() );

            add( labelOne );
            add( textField1);
            add( labelTwo );
            add( textField2);
            add( labelThree );
            add( textField3);
            add( labelFour );
            add( labelFive );
            add( button );
            add( button2 );

      }

      // not sure if I need this any more
      public void actionPerformed (ActionEvent event)
      {
            x = Integer.parseInt( textField1.getText() );
            y = Integer.parseInt( textField2.getText() );
      }

      // button 1 moves images only once
      public class ButtonHandler implements ActionListener
      {
            public void actionPerformed( ActionEvent e )
            {
                  // update location of the lines and change colors
                  x = Integer.parseInt( textField1.getText() );
                    y = Integer.parseInt( textField2.getText() );
                  String rrggbb = textField3.getText();

                  if ( rrggbb != "" )
                  {
                        // recolor the lines and circles
                         hex = Integer.parseInt(rrggbb, 16);
                  }
                    repaint();
            }
      }

      // button 2 should move the car over and over.
      public class ButtonAnimate implements ActionListener
      {
            public void actionPerformed( ActionEvent e )
            {
                  labelFour.setText( "loop2: "+ x );
                  labelFive.setText( "color: "+ hex );
                  mv.amove();
                  repaint();
            }
      }


      public class MoveIt
      {
            void amove()
            {
                  x = x + 1;
                    y = y + 0;
                  hex++;

                  if( x > 290 )
                  {
                        x = x * -1;
                  }
            }
      }


      public class Car
      {
            void pause()
            {
                  mv.amove();
            }
      }


      public void paint (Graphics g)
      {
            g.setColor(Color.green);

            if ( hex != 0 )
            {
                  g.setColor(new Color(hex));  
            }

            // Begin to draw car image.
            // Strait verticle lines top down
            g.drawLine(60+x,70+y, 120+x,70+y);
            g.drawLine(65+x,75+y, 120+x,75+y);
            g.drawLine(10+x,100+y, 45+x,100+y);
            g.drawLine(50+x,100+y, 135+x,100+y);
            g.drawLine(5+x,130+y, 20+x,130+y);
            g.drawLine(50+x,130+y, 150+x,130+y);
            g.drawLine(180+x,130+y, 190+x,130+y);
            //Horizontal lines
            g.drawLine(90+x,70+y, 90+x,130+y);
            g.drawLine(140+x,100+y, 140+x,130+y);
            //Slanted lines
            g.drawLine(10+x,100+y, 5+x,130+y);
            g.drawLine(60+x,70+y, 45+x,100+y);
            g.drawLine(65+x,75+y, 50+x,100+y);
            g.drawLine(120+x,75+y, 135+x,100+y);
            g.drawLine(120+x,70+y, 140+x,100+y);
            g.drawLine(140+x,100+y, 180+x,105+y);
            g.drawLine(180+x,105+y, 190+x,130+y);
            //Circles for the car wheels
            g.drawOval(20+x,115+y, 30,30);
            g.drawOval(150+x,115+y, 30,30);
      }
}
0
Comment
Question by:MrError
  • 4
  • 3
8 Comments
 
LVL 27

Expert Comment

by:rrz
Comment Utility
What do you mean by this line that you have in your code?

>x = x * -1;
0
 
LVL 2

Expert Comment

by:Tom7
Comment Utility
You should create a new Thread for your animation so you can control the movement properly.

Something like (this is simplified, of course):

class AnimationThread extends Thread {
  public void run() {
    while(true) {
      mv.amove();
      repaint();
      try {
        sleep(20); // sleep time in milliseconds
      } catch (InterruptedException ex) {
        // whatever
      }
    }
  }
}
...
...

public void actionPerformed(ActionEvent ev) {
  AnimationThread at = new AnimationThread();
  at.start();  // start thread on button press
}  

Hope this helps.

Cheers Tom

BTW: you will notice that the animation will flicker. To prevent flickering you can use double buffering.
0
 

Author Comment

by:MrError
Comment Utility
rrz,

 x = x * -1; <---this line of code makes the animation loop once it goes off to the right beyond x values of 290.

Tom,

  Your idea works... How do I use double buffering? Also How can I stop the thread once it begins? I tried to make a stop button like:

     public class ButtonAnimate implements ActionListener
     {
          public void actionPerformed( ActionEvent e )
          {
               AnimationThread at = new AnimationThread();
               at.start();  // start thread on button press
          }

          void stopit()
          {
               try
               {
                    at.stop();
               }
               catch (InterruptedException ex)
               {
                    // whatever
               }
          }
     }


     public class StopAnimate implements ActionListener
     {
          public void actionPerformed( ActionEvent e )
          {
               ButtonAnimate.stopit();
          }
     }
0
 
LVL 2

Accepted Solution

by:
Tom7 earned 100 total points
Comment Utility
Hi,

you can set a boolean flag to tell the thread when to exit:

class AnimationThread extends Thread {
 boolean running = true;  // *** new line ***
 public void run() {
   while(running) { // *** changed ***
     mv.amove();
     repaint();
     try {
       sleep(20); // sleep time in milliseconds
     } catch (InterruptedException ex) {
       // whatever
     }
   }
 }
 public void stopIt() {
   running = false;
 }
}


Now the run() method exits as soon as 'running' is false.


As for double buffering, the idea is to draw on an off-screen image first and then draw the image without clearing the screen first.
To achieve this, you must override the applet's update() method to prevent the clearing which occurs by default.
Here's a suggestion:


  public void update(Graphics g) { // *** new ***
    paint(g);
  }

  Image offImage;  // *** is a 'global' variable
  public void paint (Graphics realG) {     // *** changed ***
    if (offImage == null) offImage = createImage(400, 300); // image size
    Graphics g = offImage.getGraphics();  // ** changed  ***
    g.setColor(Color.green);  // *** from now on painting is done on the off-image ***


    // *** clear the image first ***
    g.setColor(Color.white);
    g.fillRect(0,0,400,300);
    if ( hex != 0 ) {
      g.setColor(new Color(hex));
    }

    // Begin to draw car image.
    // Strait verticle lines top down
    g.drawLine(60+x,70+y, 120+x,70+y);
    g.drawLine(65+x,75+y, 120+x,75+y);
    g.drawLine(10+x,100+y, 45+x,100+y);
    g.drawLine(50+x,100+y, 135+x,100+y);
    g.drawLine(5+x,130+y, 20+x,130+y);
    g.drawLine(50+x,130+y, 150+x,130+y);
    g.drawLine(180+x,130+y, 190+x,130+y);
    //Horizontal lines
    g.drawLine(90+x,70+y, 90+x,130+y);
    g.drawLine(140+x,100+y, 140+x,130+y);
    //Slanted lines
    g.drawLine(10+x,100+y, 5+x,130+y);
    g.drawLine(60+x,70+y, 45+x,100+y);
    g.drawLine(65+x,75+y, 50+x,100+y);
    g.drawLine(120+x,75+y, 135+x,100+y);
    g.drawLine(120+x,70+y, 140+x,100+y);
    g.drawLine(140+x,100+y, 180+x,105+y);
    g.drawLine(180+x,105+y, 190+x,130+y);
    //Circles for the car wheels
    g.drawOval(20+x,115+y, 30,30);
    g.drawOval(150+x,115+y, 30,30);
    g.dispose();
         
    realG.drawImage(offImage, 0, 0, this); // *** draw the image all at once ***
  }
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 

Author Comment

by:MrError
Comment Utility
Tom7,

 One more dumb question:

C:\Inetpub\wwwroot\ObjClass\assignment1>javac CarButton2.java
CarButton2.java:118: non-static method stopIt() cannot be referenced
from a static context
                        AnimationThread.stopIt();
                                       ^
1 error
     public class StopAnimate implements ActionListener
     {
          public void actionPerformed( ActionEvent e )
          {
               AnimationThread.stopIt();
          }
     }


     class AnimationThread extends Thread
     {
          boolean running = true;
          public void run()
          {
                 while(running)
               {
                       mv.amove();
                    repaint();
                    try {
                         sleep(20); // sleep time in milliseconds
                    }
                    catch (InterruptedException ex)
                    {
                         // whatever
                    }
               }
          }
          public void stopIt()
          {
                 running = false;
          }
     }

0
 
LVL 2

Expert Comment

by:Tom7
Comment Utility
Hi,

stopIt() is an instance method, not a class method. That means you must call stopIt() for a particular instance of AnimationThread.
So my suggestion would be to make 'at' a class variable:

public class CarButton2 extends ........ {
  AnimationThread at;  // make 'at' global
  ...
  ...
  ...

  public class ButtonAnimate implements ActionListener {
    public void actionPerformed( ActionEvent e ) {
      // at is now a class variable, not a local variable
      at = new AnimationThread();
      at.start();  // start thread on button press
    }
  }

  public class StopAnimate implements ActionListener {
    public void actionPerformed( ActionEvent e ) {
      at.stopIt();  // *** changed ***
    }
  }

  ...
  ...
}

   ...



Cheers Tom
0
 

Author Comment

by:MrError
Comment Utility
Tom7

 Hey still stuck.I know I am a kinda dumb but here is what I tried:

Moved this out to make it global :
     AnimationThread at = new AnimationThread();
then :

     public class StopAnimate implements ActionListener
     {
          public void actionPerformed( ActionEvent e )
          {
               //at.destroy(); <-- tried it too did not work...
               at.stopIt(); <-- it not only does not work but now the start(); wont run unless I comment it out???
          }
     }


     class AnimationThread extends Thread
     {
          boolean running = true;

          public void run()
          {
                 while(running)
               {
                       mv.amove();
                    repaint();
                    try {
                         sleep(20); // sleep time in milliseconds
                    }
                    catch (InterruptedException ex)
                    {
                         // whatever
                    }
               }
          }

          public void stopIt()
          {
                 running = false;
               repaint();
          }
     }
0
 

Author Comment

by:MrError
Comment Utility
Tom7,

Your very good! Thanks... I figured my last issue out simply named one variable wrong and it was not using the the correct action event. Doh thanks for the help. I will try to do one more thing with this dumb animation so you might see one more question. would it be ok if I asked a question about buffering thing, I try that next.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

For customizing the look of your lightweight component and making it look lucid like it was made of glass. Or: how to make your component more Apple-ish ;) This tip assumes your component to be of rectangular shape and completely opaque. (COD…
Java functions are among the best things for programmers to work with as Java sites can be very easy to read and prepare. Java especially simplifies many processes in the coding industry as it helps integrate many forms of technology and different d…
Viewers will learn one way to get user input in Java. Introduce the Scanner object: Declare the variable that stores the user input: An example prompting the user for input: Methods you need to invoke in order to properly get  user input:
Viewers will learn about if statements in Java and their use The if statement: The condition required to create an if statement: Variations of if statements: An example using if statements:

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now