"Simple" Animation

Hi everyone,
I'm trying to design (what I thought to be) a simple flashcard-type program to help students learn Japanese. Basically what it's supposed to do is read images of Japanese characters (kanji) from a folder and fill a vector up with them, then animate that image vector in a small window in the top-left corner of the student's screen as they work on their computers, thereby allowing them to absorb the material.
I THOUGHT that the hardest part of the project would be to get the vector to grab the image files automatically each time it ran, but that turned out to be pretty easy and only took up 3 lines of code. The part that I just can't get to work is the animation. I've animated stuff before in applets, but I just can't get the animation to run in this Swing Application. I can get two images to display (and I can choose which image in the array), but I can't get them to scroll through. Would someone be kind enough to look over my code and see if there's somewhere I'm going blatantly wrong? I think the thread just isn't doing what I want it to...
The code comes in two files.
KanjiFlashTwo.java (the actual work):
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
import java.io.*;
public class KanjiFlashTwo extends JPanel implements Runnable {
Image imageOne;
Image imageTwo;
int i = 0;
Image blank;
Thread thread;
public void start(){
thread = new Thread(this);
thread.start();
public void run() {
     //grab images from the images directory and load the vector with them
     File dir = new File("images/");
     String[] images = dir.list();
     //my attempt at animation
     while (Thread.currentThread() == thread) {
     imageOne = Toolkit.getDefaultToolkit().getImage(images);
     repaint();
     if(i == images.length) {
          i=0;
     else {
          i++;
     try { Thread.sleep(5000); }
     catch (InterruptedException e) { System.exit(0); };
public void paintComponent(Graphics g) {
     super.paintComponent(g);
     customDrawingMethod(g);
public void customDrawingMethod(Graphics g) {
     Graphics2D g2 = (Graphics2D) g;
     double w = (double) (getSize()).getWidth();
     double h = (double) (getSize()).getHeight();
     g2.drawImage(imageOne,0,0,this);
     g2.drawImage(imageTwo,100,0,this);
and FlashKanjiTwo.java (the window to display the actual work):
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class FlashKanjiTwo extends JFrame {
public FlashKanjiTwo() {
     KanjiFlashTwo kf = new KanjiFlashTwo();
     getContentPane().add(kf, BorderLayout.CENTER);
     setTitle("Kanji Flash!");
     setSize(new java.awt.Dimension(200,100));
     addWindowListener(new WindowAdapter() {
          public void windowClosing(WindowEvent e) {
          System.exit(0);
public static void main(String[] args) {
     (new FlashKanjiTwo()).show();
Thank you SO much for any help you can give me.
-Ben

wouldn't a MediaTracker be useful here?Thanks for the advice! I still can't get it to animate, though. I feel pretty useless at this so far -- I'm just learning how to program and am continually stalling. This is my attempt at re-writing it to use a MediaTracker, but it still gets me nowhere. Can you recommend a good book on animation or threads or any of the important ideas behind this thing? Thanks again for your help, and if anyone can help clear this up for me I'd be extremely grateful.
My new (but not much improved) code:
import java.awt.*;
import javax.swing.*;
import java.io.*;
public class KanjiFlash extends JPanel implements Runnable {
Image[] imageOne;
Image imageTwo;
Image blank;
File dir;
String[] images;
int i = 0;
MediaTracker tracker = null;
Thread animThread = null;
double w = (double) (getSize()).getWidth();
double h = (double) (getSize()).getHeight();
public void paintComponent(Graphics g) {
     super.paintComponent(g);
     customDrawingMethod(g);
public void customDrawingMethod(Graphics g) {
     Graphics2D g2 = (Graphics2D) g;
     getKanji();
     drawKanji(w/2.0, h/2.0, g2);
public boolean getKanji() {
     tracker = new MediaTracker(this);
     dir = new File("images/" );
     images = dir.list();
     for (i=0; i<images.length; i++) {
          imageOne[i] = Toolkit.getDefaultToolkit().getImage("images/" + images);
          tracker.addImage(imageOne[i], i);
     animThread = new Thread(this);
     animThread.start();
     imageTwo = Toolkit.getDefaultToolkit().getImage("images/save.gif");
     blank = Toolkit.getDefaultToolkit().getImage("images/blank.gif");
     return true;
public void drawKanji(double w, double h, Graphics2D g2) {
     if (tracker == null) { g2.drawString("Getting Close...",20,20); }
     else
     if (tracker.checkAll()) {
     g2.drawImage(imageOne[i++],0,0,this);
     if (i>=imageOne.length) i=0;
     else {
     g2.drawImage(imageOne[0],0,0,this);
     g2.drawImage(imageTwo,100,0,this);
public void run() {
     try { tracker.waitForAll();
     for (;;) {
     repaint();
     Thread.sleep(5000);
     catch (InterruptedException ie) {};

Similar Messages

  • I am trying to create a simple animated gif in Photoshop. I've set up my frames and want to use the tween to make the transitions less jerky. When I tween between frame 1 and frame 2 the object in frame two goes out of position, appearing in a different p

    I am trying to create a simple animated gif in Photoshop. I've set up my frames and want to use the tween to make the transitions less jerky. When I tween between frame 1 and frame 2 the object in frame two goes out of position, appearing in a different place than where it is on frame 2. Confused!

    Hi Melissa - thanks for your interest. Here's the first frame, the second frame and the tween frame. I don't understand why the tween is changing the position of the object in frame 2, was expecting it to just fade from one frame to the next.

  • Help need in a simple animation

      Hello !
    I hope somebody can help me, i want to make a simple animation to my logo in macromedia flash 8.
    The resource picture is in jpg (but i think i have in png also if that is better) and there is a text next to the logo.The background is black. I want to animate the text line,like its appering from the black.It is as if a cover was drawn before it along.The rest of the picture is fixed.
    How can i do that ?
    Thank You !

    sorry im absolutely new to flash so i dont know how to do that.
    here is the picture http://sherto.deviantart.com/art/Iris-Soft-193301609
    so its like this : at the first frame, there are no text and with 3-4 frames the " I " comes in and etc... the rest.
    as you can see there is a picture close to the texts so i cant cover them with a rectangle tool as big as the text,because it would go into the picture  when moves.
    once again im sorry im new so i cant even move the rectangle above the pic.
    do you have any simple idea for this ?
    anyway thank you for the anwser !

  • Convert simple animation code from as2 to as3

    Hi everyone,
    I have a simple animation that is controlled by the y movement of the mouse. The code for the animation is put in frame 1 and is as follows:
    var animationDirection:Boolean = false;
    var prevMousePosition:Boolean = false;
    var mouseListener = new Object();
    mouseListener.onMouseMove = function () {
    var curMousePosition = _ymouse;
    if(curMousePosition > prevMousePosition) {
    animationDirection = false;
    }else if(curMousePosition < prevMousePosition) {
    animationDirection = true;
    prevMousePosition = curMousePosition;
    Mouse.addListener(mouseListener);
    function onEnterFrame() {
    if(animationDirection && _currentframe < _totalframes) {
    nextFrame();
    }else if(!animationDirection && _currentframe > 1) {
    prevFrame();
    Is it possible to use this code in as3 or do I need to convert it? I am grateful for any help. Best wishes

    Yes, you need to convert the code. Here is what looks like a similar logic in AS3:
    import flash.events.Event;
    import flash.events.MouseEvent;
    var animationDirection:Boolean = false;
    var prevMousePosition:Boolean = false;
    addEventListener(Event.ENTER_FRAME, onEnterFrame);
    addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
    function onMouseMove(e:MouseEvent):void {
        var curMousePosition = mouseX;
        if (curMousePosition > prevMousePosition)
            animationDirection = false;
        else if (curMousePosition < prevMousePosition)
            animationDirection = true;
        prevMousePosition = curMousePosition;
    function onEnterFrame(e:Event):void
        if (animationDirection && _currentframe < _totalframes)
            nextFrame();
        else if (!animationDirection && _currentframe > 1)
            prevFrame();

  • How to make simple animation of 2D object ?

    I am a beginner of LABVIEW, and here is my problem...
    For each time loop, I can get a the x,y,theta information of a rigid body in the 2D plane.
    I want to use those data to make a simple animation to represent how the object is moving like in a 2D plane, which includes the 2DOF translation movement and 1DOF rotation movement. 
    How should I do?
    Thanks a lot for helping me!

    You can use XY graph to plot the trajectory of the object.
    Regarding the introduction of the XY graph, you can refer to the tutorial on LabVIEW pro.
    http://www.labviewpro.net/teach_content.php?fid=6&post=308&fpt=5
    This can only represent the XY movement, not include the rotation part.
    I don't think there's any graph control in LabVIEW that can represent the rotation aspect.

  • Simple animation software for Arch?

    Can anyone suggest a simple animation program for Linux; something similar to AnimationShop for windows.  I know there's gimp-GAP, but that seems to be fairly advanced for my purposes.  I just want to be able to string together images into .gif or video, perhaps with an 'onion layer' feature so you can see the previous frame transparently; that sort of thing.
    I use gnome, so preferably something for GTK, or at least if it's KDE, that depends only on QT and not KDE packages.
    Any ideas?
    Thanks.
    Fishonadish

    skottish wrote:You don't actually need GAP to do animated Gifs in Gimp. All you need to do is add all the frames that you want as layers in one image, then save as Gif. Gimp will ask you if you want to flatten the image or make an animation out of it. If you choose animation, it will ask you for a frame rate.
    Thanks.  I realised this eventually and got it done that way.
    Still, out of curiosity are there any 'film-strip' type animation programs out there?
    Fishonadish

  • Simple animation triggered by flex event

    I need to have a simple animation, which I suppose I can created in Flash and bring in as a swf -- or can I do it in Flex alone?
    What I need is  a container which, when it receives an event, creates a rect and "drops" it in the container.  Each time it receives an event it  drops another rect in the container. Ideally, the rects try to keep distance from each other so they dont overlap until there are way too many items.
    Possible?  How would you approach this?

    I tell you what this app of yours would wanna be one kick-arse piece of work when its finished
    Anyway to the problem in hand, this is what I would do, from the fired event
    1. create a rectangle object
    2. add the element to the display canvas but off screen -x -y
    3. use animate with a generated random co-ordinate to move  the object to, while the object is animating track its position using a hittest to stop it when it collides with an existing object.(plus a little testing to make sure its fully displayed), repeat if you want to get a more random spread(so it bounces of an object it hits so to speak.
    4. if the object takes to long to find free space call it quits and remove the object.
    The best way is to actually create a layout template, this way you have a nice spread of 'placeholders' you simply fill the 'placeholders' randomly until there are none left, you can even empty them as an option. This way you randomly select off screen co-ordinates and then animate the object into the randomly selected template co-ordinates.
    David

  • Simple animation jiggles but does not move

    Im very new to adobe edge, But ive done my reasearch! I have a png on top of a background image and I want the background image to move to the left when the website loads. The simple animation sometimes works after time but it sometimes doesn't when i preview it in my brower. But it works in my timeline. I dont know what im doing wrong and am pressed for time! please help !!!

    so it doesn't do it as bad anymore now that I made the image behind it smaller. But it still takes a while to load and the animations aren't that smooth. any advice on what I can do to make it load faster/animate smoother?

  • Duke Pt avail. 2nd time askin, (Flicker-free background) Simple Animation

    2nd time askin, since didn't get sufficient help. Duke Pts available! I am trying to create simple animation on a solid constant background. I used double buffering for moving the object and it works fine. But the problem is with the background image. The image seems to flicker while the object is moving. Here's my code:
    import java.awt.*;
    import java.applet.Applet;
    public class changed extends Applet implements Runnable{
    Image buffer;
    Graphics bufferg;
    Thread main;
    int x=0;
    boolean flag=false;
    public void init(){
    setSize(500,500);
    main=new Thread(this);
    main.start();
    buffer=createImage(getSize().width,getSize().height);
    bufferg=buffer.getGraphics();
    public void run(){
    while(main!=null){
    try     {
    main.sleep(50);
    catch(Exception e){}
    repaint();
    public void stop(){
    if(main!=null){main.stop();}
    public void paint(Graphics g){
    update(g);
    public void update(Graphics g){
    Dimension d=getSize();
    bufferg.setColor(getBackground());
    bufferg.fillRect(0,0,d.width,d.height);
    bufferg.setColor(Color.red);
    Image img = getImage(getCodeBase(),"bliss.jpg");
    if((x<500)&(!flag))
    bufferg.fillRect(x+=5,10,25,25);
    else
    flag=true;
    bufferg.fillRect(x-=5,10,25,25);
    if(x==0)
    flag=false;
    g.drawImage(img,50,50,this);
    g.drawImage(buffer,0,0,this);
    Please help me with this minor problem. I think what's happening is that the background is been drawn over and over again. I don't know how to make it constant and flicker-free.

    Possible 2 things:
    1. You're reloading the image on each repaint:
    Image img = getImage(getCodeBase(),"bliss.jpg");You shouldn't do that, you should just load it in init.
    2. You're drawing the image with the non-buffer Graphics "g" instead of "bufferg." You should use bufferg and draw it before anything else.
    I've modified the code for you, it should work but I can't test it because I don't have bliss.jpg. Let me know if it doesn't work.
    Here's the modified code:
    import java.awt.*;
    import java.applet.Applet;
    public class changed extends Applet implements Runnable {
         Image buffer,img;
         Graphics bufferg;
         Thread main;
         int x = 0;
         boolean flag = false;
         public void init() {
              setSize(500, 500);
              img = getImage(getCodeBase(), "bliss.jpg");
              main = new Thread(this);
              main.start();
              buffer = createImage(getSize().width, getSize().height);
              bufferg = buffer.getGraphics();
         public void run() {
              while (main != null) {
                   try {
                        main.sleep(50);
                   } catch (Exception e) {}
                   repaint();
         public void stop() {
              if (main != null) {
                   main.stop();
         public void paint(Graphics g) {
              update(g);
         public void update(Graphics g) {
              Dimension d = getSize();
              bufferg.drawImage(img, 50, 50, this);
              bufferg.setColor(getBackground());
              bufferg.fillRect(0, 0, d.width, d.height);
              bufferg.setColor(Color.red);
              if ((x < 500) & (!flag)) {
                   bufferg.fillRect(x += 5, 10, 25, 25);
              } else {
                   flag = true;
                   bufferg.fillRect(x -= 5, 10, 25, 25);
                   if (x == 0)
                        flag = false;
              g.drawImage(buffer, 0, 0, this);
    }

  • Hello, i'm creating a very simple animation in ps cs5, but when I try to transform a smart object in a frame, all the frames are affected by it. What can I do ? Thanks, Ep

    Hello, i'm creating a very simple animation in ps cs5, but when I try to transform a smart object in a frame, all the frames are affected by it. What can I do ? Thanks, Ep

    Ok, you are in frame animation mode. I thought cs5 had a timeline mode, but now I think I was wrong.
    In frame animation mode what you do is in one frame you have the object rotated in one position, then select an other frame and rotate it. If it rotates the first frame, which I think it will. Create duplicate of the object in a new layer. Then rotate the second layer.
    At this point in my example you would have two layers, one of which has a rotated object.
    Clear the frames
    Convert the two layers to frames.
    You now have two frames, one for each layer.
    Select both frames then click the tween button.
    This will create the in between frames.
    In the tween dialog box the higher the number of frames set here, will create a smoother animation but will result in a longer time frame for the animation to play.
    Because Photoshop has no way of knowing which way the object should rotate, it is feasible for it to rotate the opposite direction or could look wonky. Just undo and add an in between layer showing how it should look in the middle, then continue on.
    So your layers should be the following, a frame that shows all objects in their rest state.
    All objects that remain in a rest state must be copied to the next layer (ctrl-j on Windows or cmd-j on Mac)
    All subsequent layers are then used for rotating a duplicate of the object. (Ctrl j or cmd j)
    You will find the commands to clear the frames, convert layers to frames and tweeting in the hidden menu found when you click the small icon in the upper right hand corner of the animation panel.

  • Simple animation software

    When I was at NAB earlier this year, a program was demonstrated where a simple animated character would actually speak the words typed on the keyboard. I can't find the info, and don't know if it was available for Mac, but if anyone knows about such a program, please let me know. I want to use it in FCP projects.
    Thx,
    Marcia Orland
    [email protected]

    I think those programs are PC based. I do know of the ones you speak of and have seen them used online often. What I'm not certain is how you would get a person to type in a Movie or QT file after FCP is done with it?
    You might want to consider filming your subjects with loads of answers than exporting that video and building the rest of your project in Flash 8. This way you get full functionality of video and user input.
    Also Macromedia has done a loads of improvments with flash video and you might want to consider reading up on it, might be more helpful on what your trying to do.
    Good Luck
    AM

  • How to make a simple animation within text area ?

    Hi guys ,I am getting familiar with the Flash animations so I would appreciate a bit of help.
    I am trying to make a simple animation within the text input area i.e.
    1.FAN BASE
    2.FA   NBASE
    What I want is the letter N to move slowly towards letter B.I have done motion tweening but it doesn't work - either the whole text is moving left right  or the letter N is simply skipping to the second position without smooth animation.( there's no error on motion tween by the way) any ideas ?
    Thanks.

    best would be you would create your sentence "fanbase" and break down the single letters into objects by selecting the whole textfield and pressing CTRL+B, convert everyone of them into single movieclips or graphics and tween them accordingly.

  • Simple Animation Sample Form

    Hi,
    I just want to share the code.
    Here's a simple animation, if someone is interested, he/she can download the form and one can modify it according to its needs.
    I made it in Forms 6i.
    Cheers
    http://www.orafaq.com/forum/t/49957/67693/

    hi,
    I checked the form. I didn't find the cursor blinking. Infact as the form starts the cursor moves to the button. The only thing is the item speed. You can change the speed by increasing or decreasing the variable time_passed in when-new-form-instance trigger. And also in the when-timer-expired trigger, you can increase or decrease the x position of the item to make the animation fast or slow.
    In this trigger, you need to change this:
    SET_ITEM_PROPERTY(v_item,POSITION,v_x_pos + 5,v_y_pos);
    change 5 to another value.
    To get the more appropriate result, change the coordinate system to points.
    I think it should be clear now.
    Regards.

  • Non-physics metaballs for simple animations?

    I'm attempting a very simple animation where three circles ease out from the center. I would like these balls to have a metaball (liquid) effect so they appear sticky/liquid, but because I also need full control of the shapes, and physics engines are way overkill for something so simple, I'm hoping there is a much better way to accomplish this besides hand animate this in Illustrator frame by frame (where I do have a very simple metaball script (thanks to Hiroyuki Sato).
    Here's the basic animation.. It's pretty much the same first animation you ever created in Flash LOL:
    http://files.flashvenom.com/uploads/Anim.swf
    So, hopefully you can get what I'm after.
    Any help would be greatly appreciated!

    Yo thanks. The link there - that's totally metaballs. But I'm not trying to do anything interactive / live. I'm animating. There's no user interaction and I need full control of the shapes it produces.
    Not sure if you use blender, but there's modifiers you can apply to shapes. Then you can animate, etc. I'm already done animating it with Illustrator, but I'd still love to find a solution so I can do more animations in the future faster.
    And yeah, Re: Amy... The video on the top of the page that Amy shared is great for what it is, very clean and professional... but unfortunately it's not what I'm after.  And the page has click to buy, register now, free chapter, log in with facebook, (in other words, click bait) everywhere on the page so that's where my crass comment came from.

  • HELP MAKING VERY SIMPLE ANIMATION - Adobe Flash CS5

    - First off, apologies for the simplicity of the task I need to carry out- cannot seem to find any tutorials on this. (All aimed at After Effects)
    - I am hoping to make two simple animations;
    1. Animate the word "water" so it appears to be moving like water itself.
    2. Animate the word "sand" so it appears to crumble into sand itself.
    Appreciate any help, very new to Flash - still no luck after Lynda and other tutorials.

    Not exactly the answer to your question but found a tutorial page that could help you.
    Text Effects with Flash Professional 8 « Wonder How To

  • Getting a simple animation to play in IE

       I am having trouble getting a simple animation to play properly, on a site designed by someone else, in IE. It works fine in Mozilla and Safari. In IE, on some computers, it shows up but there is a prompt about downloading a Shockwave add-on. On other  computers it doesnt show up at all. Going from Mac to PC is also presenting problems. I'm freelance, so it's not like I'm in the office with these other people, so I only know what's going on with the 3 pc's I have at my disposal; which is as described above. I tried uploading another .swf with just 1 frame to see what would happen and it did the same thing. I'm starting to think it is a problem with the site and not the Flash.
       If anyone could take a look at it and offer some help, it would be greatly appreciated.
    Thanks,
    Murrz
    www.buildingdimensionsnc.com

    Thanks for your help. I didn't even think about the .html file. Normally I send both but I thought they had that sorted (so I was told) out when it worked in Mozilla and Safari. I won't know until tomorrow if it worked, but thanks again.
    Export your movies a Shockwave version or two behind, just to be on the safe side.
    This I don't quite get. Normally I publish and send .swf and .html and send them and everything works.
    Murrz

Maybe you are looking for