A Flash Developer Resource Site

Results 1 to 6 of 6

Thread: A waving flag effect?

  1. #1
    Senior Member
    Join Date
    Jul 2003
    Posts
    115

    A waving flag effect?

    I am trying to make a waving flag effect any Ideas, or tuts?

  2. #2
    Epicurean Love Toy
    Join Date
    Nov 2003
    Location
    Santa Monica, CA
    Posts
    171
    here is a nice commented example of a ripple/flag effect.

    The photo is cut up into sections using a mask, then each one is positioned according to a sin wave.

    Hope this helps!
    Attached Files Attached Files

  3. #3
    Senior Member
    Join Date
    Sep 2003
    Location
    Uk
    Posts
    196
    Or you could use the effect in Aftereffects if you have it.
    Works real nice
    Send me the flag if you need it done
    Peace bro

  4. #4
    Junior Member
    Join Date
    Dec 2009
    Posts
    1

    Thank man, it was great help

    Quote Originally Posted by kavelle View Post
    here is a nice commented example of a ripple/flag effect.

    works perfectly, thus kinda **** up the PC

    The photo is cut up into sections using a mask, then each one is positioned according to a sin wave.

    Hope this helps!

  5. #5
    Senior Member
    Join Date
    Apr 2000
    Location
    Minneapolis
    Posts
    2,127
    For a really serious flag ripple
    http://www.xerode.net/blog/2009/01/1...her-flag-post/

    Not for the novice actionscripter!
    the code is here
    http://www.xerode.net/blog/2009/01/1...r-flag-post/2/

  6. #6
    Junior Member
    Join Date
    Oct 2007
    Posts
    1

    Great flag animation!

    I converted this to AS3 -
    I needed a flag effect for a full size screensaver - all the ones i tested using Perlin Distort methods were way too taxing on the processor. This code gets the job done and doesn't kill the processor. Thanks!

    Actionscript Code:
    package com {

        import flash.display.MovieClip;
        import flash.events.Event;

     
        public class ScreenSaver extends MovieClip {
     
            private var _flag:MovieClip;
           
            //the number of slats used to make the flag effect
            private var number_of_slats:Number = 30;
            //speed at which the flag waves
            private var speed_of_flag:Number = .3;
            //the ammount the flag waves
            private var ammount_of_movement:Number = 9;
            //the length of the wave. small numbers make a larger wave.
            private var wave_length:Number = 0.2;
            //width of each slat
            private var slat_width:Number
            //the flag bitmap with mask over it
            private var _photo:Photo;
            private var _photoArray:Array = new Array();
            private var j:Number;
           
     
            public function ScreenSaver() {
                this.addEventListener(Event.ADDED_TO_STAGE, init);
            }
           
            public function init(evt:Event = null):void {
                this.removeEventListener(Event.ADDED_TO_STAGE, init);

               
                //FLAG ----------------------------------------------------------------------------
                //creates the movie clips of the flag
                for (var i:uint = 0; i<number_of_slats; i++) {
                    //creates an instance of the flag movie
                    _photo = new Photo() as Photo;
                    _photo.name = 'photo' + i;
                    this.addChild(_photo);
                    if (!slat_width) {
                        slat_width = _photo.width/number_of_slats;
                    }
                    _photoArray.push(_photo);
                    //sets the mask width to the slats width. the +1 is to remove hariline gaps
                    _photo.flag_mask.width = slat_width+1;
                    //sets the masks possition according to its number
                    _photo.flag_mask.x = slat_width*i;
                }
                j=1;

                // add enter fram handler
                this.addEventListener(Event.ENTER_FRAME, enterFrameHandler);
                //END FLAG --------------------------------------------------------------------------
               
            }
           
            //enterFrameHandler
            private function enterFrameHandler(e:Event):void {
                    j += speed_of_flag;
                    //trace(j);
                    var i:uint = 0;
                    for each (var pSlice:Photo in _photoArray) {
                        //move the slats Y position based on sin.
                        pSlice.y = Math.sin(j + i * wave_length) * ammount_of_movement;
                        i++;
                    }
            }
           
           
     
        }
     
    }

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