A Flash Developer Resource Site

Results 1 to 4 of 4

Thread: project: interactive liquid wave

  1. #1
    Member
    Join Date
    Mar 2001
    Location
    Portugal
    Posts
    47

    project: interactive liquid wave

    hi,


    I am what can be considered a newbie on actionscripting, though I know how to do some...

    I am now starting a project that I have in mind for my next web site, and that I am planning to take about two months on writing...

    What I need is *obviusly* help, and some directions on what to do (like one or two code lines there and there..).

    The Project:

    Imagine a wave of water, plotted like a math SIN or COS function. on passing over with the mouse pointer, the water would "move" like an elastic material...

    now, first thing: plot the water line. This could be a simple mathematical function, so I would start with a simple
    y=sin(x). any directions/articles on how to do this?

    thank you very much in advance

    ps: as I am a beginner, it will take me some time to get back to this,after completing the scripting...

  2. #2
    Senior Member jbum's Avatar
    Join Date
    Feb 2004
    Location
    Los Angeles
    Posts
    2,920
    Attached is a sample project, to help get you started. It's for Flash MX 2004.

    Here's the code:

    code:

    kNbrControlPoints = 20;
    kStartX = 0;
    kEndX = Stage.width;
    kBottomY = Stage.height;
    kWaterLevel = Stage.height/2;
    kWaveHeight = 30;
    kWaveSpeed = .001;

    _root.onEnterFrame = function()
    {
    this.clear();
    this.beginFill(0x000044, 100);
    this.moveTo(kStartX, kBottomY);
    for (x = 0; x < kNbrControlPoints; ++x)
    {
    var r = x/(kNbrControlPoints-1);
    px = kStartX + r*(kEndX-kStartX);
    py = kWaterLevel + kWaveHeight*Math.sin(r*Math.PI*2 + getTimer()*kWaveSpeed);
    this.lineTo(px,py);
    }
    this.lineTo(kEndX, kBottomY);
    this.lineTo(kStartX, kBottomY);
    this.endFill();
    }



    Here's a link to a more complex example which uses spring physics to model the surface of the water, rather than sin waves.

    Deep Blue Sea
    Attached Files Attached Files

  3. #3
    Member
    Join Date
    Mar 2001
    Location
    Portugal
    Posts
    47
    hi, excellent, this will be very helpful, and the code is very much like what I wanted!

    thank you very much I'll get on to it now!

    ac7

  4. #4
    Junior Member
    Join Date
    Sep 2005
    Location
    Manhattan
    Posts
    3
    Hey Jbum,

    Your DeepBlueSea.fla rocks.

    Been playing around with it....was curious how I could make the wave 1 or 2 pixels high. So it would show up as a line rather than a full wave.

    Any help is greatly appreciated!

    Thanks!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center