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.

  1. var total:Number = 30; //total number of bubble
  2. var sw:Number = Stage.width; //stage width
  3. var sh:Number = Stage.height; //stage height
  4.  
  5. for (var i=0;i<total;i++){
  6.  
  7. var bubble:MovieClip = this.attachMovie("mcBubble",
  8. "mcBubble"+i,this.getNextHighestDepth());
  9.  
  10. // set the initial random speed
  11. bubble.yspeed = random(500) + 3;
  12.  
  13. // set the initial random position
  14. bubble._y = sh;
  15. bubble._x = random(sw);
  16.  
  17. // set the initial wobble factor (the X movement)
  18. bubble.xspeed = random(3);
  19.  
  20. if (random(2) eq 1) {
  21. bubble.xspeed = -bubble.xspeed;
  22. }
  23.  
  24. bubble.onEnterFrame = function(){
  25.  
  26. // the bubble movement
  27. this._y = this._y - this.yspeed;
  28.  
  29. // check if the bubble is out of the top of the screen
  30. if (this._y <= -15) {
  31.  
  32. // then reset to the bottom
  33. this._y = sh;
  34. this._x = random(sw);
  35. this.yspeed = random(5) + 3;
  36.  
  37. // now to randomise the scale of the bubble so
  38. // we get a few wee ones too
  39.  
  40. scale = 2 + (random(8));
  41. this._width = scale;
  42. this._height = scale;
  43.  
  44. // set the initial wobble factor (the X movement)
  45. this.xspeed = random(3);
  46.  
  47. if (random(2) eq 1) {
  48. this.xspeed = -this.xspeed;
  49. }
  50. }
  51.  
  52. // change the X value of the bubble
  53. this._x = this._x + this.xspeed;
  54.  
  55. // the bounce code for either the left or right of the
  56. // margin for the bubble
  57. if (this._x > 100 or this._x < 50) {
  58. this.xspeed = -this.xspeed;
  59. }
  60.  
  61. }
  62.  
  63. }

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.

  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….

  7. Karen
    October 7th, 2010 at 18:40 | #7

    Hi i need to make a fish tank project so im using your code to make the bubbles. But i only want them in two scenes (i need to make an into, middle and outro, and i dont want them in outro). My question is how can i get the bubbles to stop at the end of the second scene? Thank you in advance!!!

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