Animating a line

I was wondering does anyone know the code to animate a line being drawing between 2 Points. Thats about it

import java.awt.*;
import java.awt.event.*;
import java.awt.geom.*;
import javax.swing.*;
import javax.swing.Timer;
public class AnimatedLine extends JPanel implements ActionListener
    Line2D.Double line;
    Timer timer;
    double xInc;
    public AnimatedLine()
        line = new Line2D.Double(10, 200, 50, 200);
        timer = new Timer(40, this);
        xInc = 3;
    public void actionPerformed(ActionEvent e)
        Point2D p1 = line.getP1();
        Point2D p2 = line.getP2();
        checkBoundries();
        line.setLine(p1.getX()+xInc, p1.getY(), p2.getX()+xInc, p2.getY());
        repaint();
    private void checkBoundries()
        double x1 = line.getX1();
        double x2 = line.getX2();
        int w = getWidth();
        if(x1 + xInc < 0 || x1 + xInc > w ||
           x2 + xInc < 0 || x2 + xInc > w)
            xInc *= -1;
    protected void paintComponent(Graphics g)
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D)g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
                            RenderingHints.VALUE_ANTIALIAS_ON);
        g2.draw(line);
    public void start()
        if(!timer.isRunning())
            timer.start();
    public void stop()
        timer.stop();
    public static void main(String[] args)
        AnimatedLine al = new AnimatedLine();
        JFrame f = new JFrame();
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.getContentPane().add(al);
        f.setSize(400,400);
        f.setLocation(200,200);
        f.setVisible(true);
        al.start();
}

Similar Messages

  • Suggstion: animation time line to preview layers in illustrator

    I would like the basic flash animation time line in illustrator to preview my layers (build or sequence) prior to exporting to flash, so I can tweak my shapes and vector objects as I am developing and working on my ideas

    Hi,
    It is not yet available for download. I am working on a plugin to replace Smart Guide and direct selection tool which will be available first. Please let me know if you are interested in testing this plugin. The animation plugin will come after that.
    What OS and AI version are you using?
    Vincent

  • Motion Animated Number Line

    Any suggestions or ideas as to how to create an animated number line in motion? Am working on a math project.

    Paint stroke and write-on behavior?
    Patrick

  • Animating a line graph

    Dear javafx coders
    I am a physics teacher in London and I am trying to learn JFX so that I can make animations for use in lessons. I don't know much about programming, but so far I have successfully managed to animate a circle which oscillates up and down (please see code below):
    package javafxapplication22;
    import javafx.stage.Stage;import javafx.scene.Scene;
    import javafx.scene.Node;import javafx.scene.shape.Circle;
    import javafx.animation.Timeline;import javafx.animation.KeyFrame;
    import javafx.scene.input.*;import javafx.animation.*;
    import javafx.scene.*;import javafx.animation.transition.*;
    import javafx.scene.shape.*;import javafx.scene.paint.*;
    import javafx.scene.transform.*;import javafx.stage.*;
    import javafx.scene.control.*; import javafx.scene.text.Text;*
    *import javafx.scene.Scene;import javafx.scene.text.Text;*
    *import javafx.scene.text.Font;*
    *var yold:Number=100; //old y pos*
    *var ynew:Number=100; //new y pos*
    *var yvel:Number=5; //y velocity*
    *var yacc:Number=0; // y acceleration*
    *var freq=0.001; //frequency of oscillation*
    *var time = Timeline {*
    *repeatCount: javafx.animation.Timeline.INDEFINITE // never stop*
    *keyFrames: for (i in [30..40])*
    *javafx.animation.KeyFrame*
    *time: 100ms*indexof i // each frame is 100ms apart*
    *action: function ()*
    *yacc=-39.48*freq*(yold-100); //calculate acceleration
    yvel=yvel+yacc; //update velocity
    ynew=yold+yvel; //update position
    MoveTo {x: 200+i*10 y: yold absolute: false} //graph from old position ...
    LineTo {x: 200+(i+1)*10 y: ynew absolute: false} //..to new
    yold=ynew;
    Stage {
    scene: Scene {
    width: 400
    height: 200
    content: [
    Circle {
    centerX: 100;
    centerY: bind ynew,
    radius:20,
    onMousePressed: function(e:MouseEvent) { time.play(); }
    } The circle behaves as expected and oscillates up and down. However, I would also like to graph its motion beside it (using moveTo and lineTo, you can see these two lines above) but no lines at all appear on the screen. The idea is that on each new frame a portion of the line graph is added (i.e. from the old y position to the new y position, also adding on an equal x increment each time as we move along the time axis.
    Any help on this would be really appreciated - I am very keen to move away from technologies such as Flash, but at the moment I am finding JFX a bit difficult.
    Thank you
    Matt Klein

    aheem...well! then how about this animation...I think I know what you are trying to do then. If I'm not mistaken, you are trying to do what the Ti-83 can do when graphing.
    Well! here is an idea on how I would do a simple animation on a graph
        This is an animation graph
    package animationgraph;
    import javafx.stage.Stage;
    import javafx.scene.Scene;
    import javafx.scene.chart.LineChart;
    import javafx.scene.chart.part.NumberAxis;
    import javafx.animation.Timeline;
    import javafx.animation.KeyFrame;
    * @author JJ
    //The start values of x & y for line 1
    var line1StartX : Number = 8;
    var line1StartY : Number = 10.2;
    //The end values of x & y for line 1
    var line1EndX : Number = 0;
    var line1EndY : Number = 0;
    //The x & y values for line 2
    var line2X : Number = 0;
    var line2Y : Number = 0;
    //Creates a line chart
    var getLineChart =  LineChart
         title: "Line Chart"
         xAxis: NumberAxis {
              lowerBound: 8
              upperBound: 9.1
         yAxis: NumberAxis {
              lowerBound: 0
              upperBound: 30
         data: [
              LineChart.Series {
                   name: "Line 1"
                   data: [
                        LineChart.Data { xValue: bind line1StartX  yValue: bind line1StartY}
                        LineChart.Data { xValue: bind line1EndX yValue: bind line1EndY }
    //Keeps track the time for line 1
    var keepTime1 : Number = 6;
    //Animation for the line chart
    var line1Animation = Timeline
         keyFrames: KeyFrame
                time:1s
                action:function()
                    keepTime1--;
                    if(keepTime1==5)
                        line1EndX = 8.1;
                        line1EndY = 10.5;
                    if(keepTime1==4)
                        line1EndX = 8.3;
                        line1EndY = 11.0;
                    if(keepTime1==3)
                        line1EndX = 8.5;
                        line1EndY = 11.5;
                    if(keepTime1==2)
                        line1EndX = 8.7;
                        line1EndY = 13.0;
                    if(keepTime1==1)
                        line1EndX = 9;
                        line1EndY = 15.5;
           repeatCount:5
    Stage {
        title: "Animation Graph"
        scene: Scene {
            width: 500
            height: 500
            content: [
                getLineChart
    line1Animation.play();

  • Animating a line by moving bezier handles, points

    I'm working on a clip that simply moves lines around the stage and makes them bend. It seems very easy to do this, in a sloppy and uncontrolled kind of way, with the record button on, moving to different points along the timeline and moving the handles and points along the lines. But what kind of movement/animation am I creating? No keyframes appear as I adjust the handles and points, and I can't find any parameters that reflect the changes I'm making, and that I might be able to tweak in other ways as I refine the adjustments.
    This appears to be too simple or too uninteresting an issue to be covered in any of the multiple references, videos, and tutorials I've seen. Anybody able to shed some light on my line movements?
    TIA!
    dpc

    Hi David
    I've been looking for the very same keyframes. I've made a little progress: if your lines are Shapes, select one and go to the Shape tab of the Inspector. Select Geometry. To the right of Control Points is a diamond with a drop-down menu. Choose Show in Keyframe Editor. In the Keyframe Editor you get Shape Animation control. However, the only parameter I can see that is controllable is the timing of your animation changes. Nothing else - at least that I can figure out.

  • Animating a line chart on click?

    I have a line chart that has multiple points of data on it that shows growth from 2008 - 2013.  I'm going to be giving a presentation to show this growth, but I want to emphasize a point in the middle (around 2011) where the growth skyrocketed.  To do this, I want to click...the chart builds using the Build In feature but then stops on 2011.  I'll talk, then click again, and the chart will finish the growth going up to 2013.  I've googled this till I'm blue in the face but I can't seem to get a straight answer. 
    My only thoughts are to build two charts...one that has data up to 2010, and one that has data the rest of the way, and then do a dissolve or something on click to show the growth.  Here is what my chart looks like in it's present form...help!!

    My only thoughts are to build two charts...one that has data up to 2010, and one that has data the rest of the way, and then do a dissolve or something on click
    That's the way I have to do it also as there are no built in controls to animate the graph line.
    I use a left to right wipe which looks more convincing.

  • Animating Single Lines of Block Text In Keynote

    Is it possible to animate single lines of block text in Keynote? Or do I have to rewrite each line as a separate text box

    Select the text box then
    Inspector > Animate > Build > Delivery;  from the drop down menu, select By Paragraph

  • Animation with 48 lines

    I have 48 different lines(linestriparrays) and i want to show them one by one in two seconds so it will be an animation(curving line).What is the best way to do this?(or which behavior method?)
    Morph explains this but it is deprecated and i dont want to use it.
    Thank you.

    What is the best way to do this?
    I`m not sure there is a 'best' way. You can make the objects transparent and turn them solid one by one. You can make them a background color and change that color one by one. You could move a plane across the world to reveal the objects one by one...
    Whatever you choose it sounds like you need a WakeupOnElapsedFrames(someFrameInterval) wakeupCondition for your custom reveal Behavior.
    regards

  • Animating line drawings?

    I recently watched a video on Vimeo that had a simple but cute hand drawn animation for the intro.  Here is a link to the video: http://vimeo.com/53869615  I've never explored animation, however I wouldn't mind trying some simple animations with line drawings but not sure where to start.  I'm mainly curious about the workflow on how one would go about creating an animation like this?
    1) How do you compose the drawings?
    2) How is the background animated to show motion relative to the car?  I can't imagine one would draw each frame over and over like a flip book?  At 24fps, for a 20 sec clip that would be 480 frames?
    3) Would it be much simpler to create the drawings in Illustrator to be animated in After Effects?
    I appreciate any advice!  Thanks.

    Look up Andrew Kramer's blueprint tutorial. it covers all the basics from using masks to the Scribble effect. Beyond that you sure can find all sorts of variations on the theme, but most of them will involve some form of mask animation and stroke effects, complemented by conventional layer transform animation to create parallax for the illusion of motion. In any case, many of your questions will fall into place once you actually start using AE and understand its basic principles. Not much point in getting wound up in theoretical considerations before that and asking a hundred people about their favorite technique will result in 100 different answerrs and only confuse you further.
    Getting started with After Effects
    Mylenium

  • Animated dots cirkel line

    Hello 
    In After Effects CS4, I would like to make an animated dot line is red and white colors. The line must be a circle that starts at 0% and ends with a complete circle of 100% - how can I do this task?

    1. Select the Ellipse tool (nested among the shape tools quadrant in the tool bar).
    2. Make sure Stroke is active and has the width you want, and Fill is turned off in the tool options (you can change stroke/fill options later if you want.
    3. Make sure no layer is selected, and shift drag with the Ellipse tool. Also add the alt (win) or option (mac) key before you start dragging to make the circle grow from the center. Press the space bar if you want to relocate the circle on the fly as you draw it (without having to release the mouse button as you create the circle). The shape tools create vector Masks when a non-shape layer is selected, and they create shape groups in shape layers when no layer is selected or a shape layer is selected.
    4. You will get a shape group called "Ellipse" inside a shape layer. Twirl open the shape layer and "Ellipse" shape group and find the "Stroke" property group inside the "Ellipse" group.
    5. In the Stroke group, you'll find a section called "Dashes". Press the "+" (plus) button to add a dash. Press it again to add a gap. Set the dash length to 0. Set the gap to something like 10.
    6. Still in the stroke group, set the "Line gap" menu to "Round gap" (Why are we doing all this? You're creating dashes with rounded caps, by setting the dash to a length of 0, you're making the two dash caps meet each other, with no visible dash in between, and form a circle for each dash. It's a famous Adobe Illustrator trick).
    7. To reveal the circle line over time, add a "Trim Paths" path effect to the Ellipse group. Select the Ellipse group and use the Add menu inside the shape layer.
    8. Animate the End property in Trim Paths with keyframes, so it goes from 0 to 100 in the time span you want.
    For more information on Shape layers, shape tools, path effects, etc, see all the shape layer-related topics in the After Effects Help chapter on Drawing, painting and paths.

  • How can I show an image before my animation starts playing

    Hey there!
    First of all, great work on making Adobe Edge...! I can see real potential in the use of this program!
    I have started to work on an animation which will work as a splash-screen before the users see the actual site. (Yes I know... but the client wants it like this...)
    The problem I have now is that the animation plays after a few seconds and that during these seconds it shows the content of the website. Besides that I still find it pretty difficult to actually position the animation the way I want.
    I am using a plug-in for wordpress so I might not be in the right place to find help.
    I tried fixing this with a pre-loader but this is also too slow. Is there any way I can force the animation to play sooner or to make sure they can't see the content before the animation has played?
    You can find the concept of the website on: www.appyourservice.nl/concept/Jack.
    Any help is appreciated.
    Cheers,
    Dominic

    For sure,
    It's also in my reply above. What I did is add an other div to my website which overlaying the complete content.
    Then you add in the animation a line to hide this div before the animation starts playing like so:
    So add this to the stage in "CompositionReady" --> jQuery("#div").hide();
    This will make sure that the animations hides the div before playing so you will see first only the overlaying div and once the animation is ready to play, this div will hide and the animation will start.
    Hope this helps.
    Cheers,
    Dominic

  • Growing chart line, Flash CS4

    Hello,
    I want to make a growing line. Therefore I have an object without outlines that is angled like a stock exchange chart line. The object is imported (copy paste) from Illustrator.
    I tried with shape tween with the same object form (not the same object) but different colour gradient (blue/white to solid blue). But this didn't do the trick. Looks more like changing the alpha value.
    I want something like this (Last animation, yellow line).:
    http://www.dundas.com/Components/Products/chart/NET/Why/WhitePapers/Animation.aspx
    How can I realise this with flash? Is there a tutorial?
    P.S.: I don't get the forum search. How can I search through just the flash forum?
    Thanks,
    Slodomir

    Thanks for the answer.
    The Problem is that I have multiple lines which overlay themselves.
    I tried this:
    I created two layers. In both I pasted the line. The line above is white, the one below is blue. But I can't manage to shorten the white line by cutting parts off. I just can compress the whole white object. Is there a function for trimming an object?

  • Web Banner with Video: How to start a flash animation ONLY after .flv is finished loading.

    Hi,
    I am making a 10 sec. web banner and am required to use a video that is on an external server. I had no problem getting the video file converted, uploaded to the external server and it is now playing back perfectly after exporting the .swf file.
    The problem I am having is that my animations (mostly text items, which are placed very carefully throughout the .flv movie) aren't matching up with the movie's movements (due to the .flv starting later due to streaming – I am assuming).
    How would I go about syncing these two things, so that the animations always line up exactly with the video's movements? Something like a preloader would be totally fine. I've also read about 'Cue Points' but they seem to be a little unnecessary for what should be a simple 10 sec. banner.
    Also the .flv itself is exactly 10 sec. long, but the banner is 13 sec. long so that the last screen (with the most important information) is shown statically for 3 sec. Should I be doing anything to compensate for this other than simply adding the 3 sec. in the timeline in flash, and letting the .flv restart when the entire .swf starts looping?

    use cuepoints in the video to sync your swf movieclips/timelines with your video.

  • Dashed line / dotted line coupon effect? FCPX

    Seeing if anyone has any tips or tricks on how to create a dashed line type of effect around an object in a video, making it look like a coupon or like it was cut out of paper?
    The line doesn't necessarily progress around the object in the video -- it can be a static layer. Though, if anyone DOES have tips on animating the lines, that could be cool, too!
    Thanks in advance.

    Familiar with Motion?
    Draw a short horizontal line. Select the Anchor point tool and drag the center to the right end of the line you drew. Replicate the line. Change the Arrangement to Outline.  In the Cell Controls section, check the Align Angle option.
    You will now have a dashed outline rectangle. You can publish the Size parameter and change the size of the rectangle with the Width and Height parameters from Size. You can increase the number of line segments with the Points parameter and you can animate the outline with the Offset parameter (but there's a catch.)
    When animating the offset, you will have line segments extend "outside" the base rectangle shape briefly (since they are aligned to the side they are attached to, then snap to another side when the anchor point changes over from one side to the next.)
    To get around that, you need to create another rectangle that is 100 by 100 and link the Scale X and Scale Y parameters (separately) to the Width and Height of the Replicator (in the Link behavior, set the Scale to 10 for both.) Drag the rectangle onto the Replicator in the Layers List and hold until you get the popup menu -- select Add Mask to Object. [PS -- you should center the Replicator AND the rectangle before adding the rectangle as a mask!] [You can create a square rectangle then select the Shape > Geometry tab and type in the exact points: (-50, 50); (50, 50); (50, -50); (-50, -50) to create the exact size you need.]
    If the mask is perfectly aligned, you can now animate the dashed line and it won't look weird. You can change the width and height of the replicator and the mask will change in perfect synchronization.
    You can also make the dashes longer or shorter by manipulating the Scale X parameter in the Cell Controls of the Replicator. If you made the original line white, you can colorize from the Cell Controls as well.
    After that, you'll need to figure out if you want a solid color background; a drop zone or effect source/title background; what kind of text you want inside the dashed outline (or you can manually place a Basic Title in FCPX if you like); etc...
    Hope this helps...  If  you need further help with this, let me know.

  • Dashed line in Motion

    Hi I'm tryin create an animated dashed line in motion.
    I've done a lot of searches on the forum and people keep refering to this url: http://www.motionsmarts.com/tutorials/drawinglines/drawinglines1.html
    However the site is closed so can't seem to find any good info.
    Any ideas?
    Thanks

    What you want can be done by using shape styles with either the line (shape) tool or paint brush and applying the write-on behavior. (A couple of the shape styles are dashes.)
    I think that at least one of Mark Spencer's Mac Break Studio episodes is on paint brushes and/or shapes. Do a search.
    There is a very good Motion discussion group in these forums. There is also a good one at Creative Cow (at which Mark Spencer is a frequent contributor).
    Russ

Maybe you are looking for

  • My phone won't turn on.. but it was working five minutes ago perfectly.. help!!!

    So i woke up, was texting on my phone that works perfectly or so i thought.. Come back from getting something to eat and the phone won't turn on.. I've used 2 different charges to try to charge it, plugging it into my computer and 2 different wall ch

  • Strange item in desktop dropdown list after CS4 installed

    Since installing CS4, there is a new item in the dropdown list when I right-click on my desktop The new item is "Adobe Drive CS4". It has two items showing under it. They are "Connect to", and "New Project". The "New Project" is greyed out, even when

  • Why can't i watch videos of youtube on mac

    why cant i watch videos of youtube on my mac?

  • Db migration from Solaris 8i to windows 10g

    There is requirement to move db from solaris8(dbversion8170 to window Server 2003 (10204 already installed) DB is about 80gb big, what would be the best approach ? I am thinking to create new db on windows, and export and import data.....any concerns

  • Problem with License server

    Hi All, I am facing problem with license server. We have installed SAP Business One , Did License import, Installed patch 15 and than again DTW and every thing. Now when I want to connect through DTW, it gives error messege : connection to license se