Home > ActionScript 2.0 > How to create bubbles in flash (ActionScript 2.0)

How to create bubbles in flash (ActionScript 2.0)

Here is a simple peice of ActionScript that can also be used to create snow or rain. I've seen a few particle engines on the net that I easily could have used but I wanted something simpler.

So this is what I came up with.

var total:Number = 30; //total number of bubble
var sw:Number = Stage.width; //stage width
var sh:Number = Stage.height; //stage height
 
for (var i=0;i<total;i++){
 
     var bubble:MovieClip = this.attachMovie("mcBubble",
     "mcBubble"+i,this.getNextHighestDepth());
 
     // set the initial random speed
     bubble.yspeed = random(500) + 3;
 
     // set the initial random position
     bubble._y = sh;
     bubble._x = random(sw);
 
     // set the initial wobble factor (the X movement)
     bubble.xspeed = random(3);
 
     if (random(2) eq 1) {
          bubble.xspeed = -bubble.xspeed;
     }
 
     bubble.onEnterFrame = function(){
 
         // the bubble movement
         this._y = this._y - this.yspeed;
 
         // check if the bubble is out of the top of the screen
         if (this._y <= -15) {
 
             // then reset to the bottom
             this._y = sh;
             this._x = random(sw);
             this.yspeed = random(5) + 3;
 
            // now to randomise the scale of the bubble so
            // we get a few wee ones too
 
            scale = 2 + (random(8));
            this._width = scale;
            this._height = scale;
 
            // set the initial wobble factor (the X movement)
            this.xspeed = random(3);
 
            if (random(2) eq 1) {
               this.xspeed = -this.xspeed;
            }
         }
 
         // change the X value of the bubble
         this._x = this._x + this.xspeed;
 
         // the bounce code for either the left or right of the
         // margin for the bubble
         if (this._x > 100 or this._x < 50) {
             this.xspeed = -this.xspeed;
         }
 
      }
 
}

Easy.. now this is what it looks like.

You could make it more realistic by tweaking the speed, wobble values and add blurs or better graphics but what I needed  it for, this is perfect.

Download the Source Code - Use it any way you want, just let others know how you used it by leaving a comment. Peace!

Enjoy.

Post to Twitter Post to Plurk Plurk This Post Post to Yahoo Buzz Buzz This Post Post to Delicious Delicious Post to Digg Digg This Post Post to Ping.fm Ping This Post Post to Reddit Reddit Post to StumbleUpon Stumble This Post

  1. January 15th, 2010 at 07:19 | #1

    nice AS2 code…
    thanks

  2. February 22nd, 2010 at 21:16 | #2

    Really good work about this website was done. Keep trying more – thanks!

  3. Billy
    June 2nd, 2010 at 02:34 | #3

    How do i stop this in 10 frames time? So it only goes for the ten frams that I want?

  4. June 2nd, 2010 at 16:00 | #4

    Do you mean a timeframe? For example the bubbles stop witin 10 sec?

  5. July 2nd, 2010 at 04:36 | #5

    hi,
    thanks great work!
    how can i make the bubbles bigger?
    cheers

  6. July 12th, 2010 at 20:45 | #6

    Hi Mazza,
    You can either resize the actual bubble asset from the library or modify the following in the code and add a buffer.

    Original code:
    —————————————-
    scale = 2 + (random(8));
    this._width = scale;
    this._height = scale;
    —————————————-

    Edited code:
    —————————————-
    var buffer:Number = 50;
    scale = 2 + (random(8));
    this._width = scale+buffer;
    this._height = scale+buffer;
    —————————————-

    Hope that helps….

  1. No trackbacks yet.
SEO Powered by Platinum SEO from Techblissonline