10 Killer Flash Tips For Beginners

Advertisement

flash tips for beginners

This article will come in handy for those of you who are interested in Flash, or perhaps have a basic idea and would like to learn more about Adobe Flash.

Before we get started:
The list below provides you valuable and useful short tips including sample FLA source files to help you understand better and apply faster in your Flash projects. You need to have Adobe Flash CS3 or CS4 Professional software installed in your computer to open the source files.

1. Understanding Object Names

Usually some Flash beginners think that object names in the library are same as instance names. In fact, they ARE NOT. Please make sure that you do not get confused with instance names, class names, and object names in the library. They have totally different meanings in Flash. Below example shows that gray_box_01 is the instance name, graybox is the class name without spacing (which is used to create instances by ActionScripts), gray box is the movieclip (or object) name with spacing in the library.

Moreover, gray_box_01 is just an instance of gray box movieclip in the library, there can be gray_box_02, gray_box_03, gray_box_04, etc and they are just instances of the same gray box movieclip.

Instance Name

2. How to make URL buttons in ActionScript 3.0

  1. Create a button in the library.
  2. Drag it onto stage 2 times and position them.
  3. Give the instance names button_01 and button_02.
  4. Add Event Listeners as show in below screenshot and code below:
        button_01.addEventListener( MouseEvent.CLICK, goto_hongkiat );
        button_02.addEventListener( MouseEvent.CLICK, goto_koflash );
        function goto_hongkiat(e:MouseEvent):void
        {
        navigateToURL( new URLRequest( "http://www.hongkiat.com" ), "_blank" );
        }
        function goto_koflash(e:MouseEvent):void
        {
        navigateToURL( new URLRequest( "http://www.koflash.com" ), "_blank" );
        }
        

URL Buttons AS3

Download Source

3. How to duplicate MovieClips in ActionScript 3.0

  1. Create a movieclip "box" in the library.
  2. Right-click on it and click on Linkage…
  3. Set the class as box as show in below screenshot.
  4. var b:MovieClip = new box(); duplicates a movieclip.
  5. Line no. 4 and 5 set the X and Y positions of a dupliated movieclip.
  6. addChild() function adds that dupliated movieclip onto stage.

Duplicate MovieClips AS3

Download Source

4. How to add Right-Click menu in Flash ActionScript 3.0

  1. Create custom menu items.
  2. Add Event Listeners to those items.
  3. Hide built-in items.
  4. Apply the custom menu items.

Right-Click Menu AS3

Download Source

5. Using Tweener class or tween engine for motion tweening

There are a number of open source tween engines on the web. Tweener is one of the most popular tween engines for motion tweening.

  1. Download Tweener Class (AS3).
  2. Import Tweener class by unzipping it and put caurina folder into the folder that your flash file exists.
  3. Create a movieclip "gray box" in the library.
  4. Drag it 2 times and give them instance names gray_box_01 and gray_box_02.
  5. Apply Tweener to them.
  6. Download Tweener Documentations to understand and apply it better.

Using Tweener Engine

6. General Structural Guidelines for Flash

It is really important to keep your flash timeline structure and library clean and reusable. This way you can save a lot of time for future projects.

  1. Create and apply layer folders when you have more than 10 layers on timeline.
  2. Avoid using default layer names (examples: Layer 1, Layer 2, etc.) and give them meaningful names.
  3. Put all actionscripts in one layer (named "actions") and put it on top of all layers.
  4. Give the meaningful names for every object in the library and use folders to group related objects.
  5. Remove unused objects from the library by clicking the small drop down arrow, then "Select Unused Items" and press delete button.
  6. Download FLA file from Flashmo.

7. How to create a simple preloader

  1. Add new scene preloader using the scene panel click on plus icon . (Window > Other panels > Scene or press Shift + F2)
  2. Move the preloader scene above content scene as show in below screenshot.
  3. Create a movieclip "preloader bar" drawing a rectangle using width 200px, height 4px, and color: #CCCCCC.
  4. Create another movieclip "preloader bar bg" drawing a rectangle using width 400px, height 4px, and color: #666666.
  5. Put them on stage giving instance names bar and bar_bg and align them centered as show in the screenshot.
  6. Put a dynamic textfield loader_info and put it below the bar and centered.
  7. Add an event listener with a function to calculate the percentage loaded as show in the screenshot.

Simple Preloader AS3

Download Source

8. How to use Bandwidth Profiler and Simulate Download in Flash

You can simulate download in Flash. This is really a very useful tool in Flash, especially to check how flash movies are loaded for slow network speed users.

  1. Run your flash file, go to main menu Control > Test Movie (or press Ctrl + Enter).
  2. Click on View > Bandwidth Profiler (or press Ctrl + B) in Test Movie window.
  3. Click on View> Simulate Download (or press Ctrl + Enter) in Test Movie window.
  4. You can adjust the download speed by View > Download Settings > (different speed options).

Flash Bandwidth Profiler

Download Source

9. How to play timeline frames in reverse

  1. Declare a boolean variable reverse which can be only 2 values, either true or false.
  2. Add event listeners for mouse over, mouse out and enter frame events to the button instance box_01.
  3. When mouse pointer is on the button, reverse value is set to true.
  4. When mouse pointer is NOT on the button, reverse value is set to false.
  5. Event.ENTER_FRAME executes run function continuously. It executes the run function 30 times per second if the frame rate is 30 fps.
  6. run function continuously checks if the reverse value is true or false.
  7. It goes to previous frame when reverse is true and it goes to next frame when reverse is false.
  8. You may see how the timeline pointer goes in bandwidth profiler while testing this movie.

Play Reverse Frames

Download Source

10. How to use a Timer class in Flash

  1. Create a new timer variable timer_01 as in this example.
  2. Add an event listener function play_timer.
  3. Copy box movieclip from the FLA file of TIP number 3 into the library.
  4. Add play_timer function.

Additional: You may download and see how Timer is used with play/pause buttons in Flash XML photo rotator

AS3 Timer Class

Download Source

To make things easier for you, we’ve got all tutorials’ source files compressed in one single download file so you don’t have to download them one by one. Download All Source Files

Article by: Min Thu – Founder of flashmo.com and koflash.com. Follow Min Thu in Twitter.

Related Contents

Sponsors

Posted by hongkiat in Tools , at 08.31.09

Tags: , , , , , ,

Comments

  1. Lit_TIger August 31st, 2009

    Wow, Useful for flash beginner.
    Thanks.

    Reply
  2. malaysia hosting August 31st, 2009

    great!very well written tutorial for beginner in flash.anyway is Min Thu guest writer for hongkiat or part of the team?

    Reply
  3. hongkiat August 31st, 2009

    Min Thu guest blog for Hongkiat :-) Gotta say, that’s quite an useful article, a lot of effort in it.

    Reply
  4. Too August 31st, 2009

    Great tips for me as a flash beginner. Quick ways.. Neat ways. I have been looking for things like them for a long time.
    Thanks.. keep on sharing.

    Reply
  5. Vivekanand September 1st, 2009

    Excellent Effort in it, yes! I would like to say openly since I am also a flash developer, I can understand the effort. Min Thu, Excellent Job… please do post your best and give us the best… on the whole all the best…

    Thanks,
    Vivek
    [http://www.developersnippets.com]

    Reply
  6. Lia Belle September 1st, 2009

    Learning flash is one of so many things on my To-Do-list. Very useful indeed! thanks ….

    Reply
  7. Mladen September 1st, 2009

    Thanks. I wanted to start again with Flash.

    Reply
  8. Edge Press September 1st, 2009

    Check out this sweet guide to Free Premium Menus from FlashVortex.com: http://edgepress.wordpress.com/2009/07/31/flashvortex-tip-get-premium-features-free/

    Reply
  9. miziology September 1st, 2009

    nice tips hk..thanks

    Reply
  10. rozy September 1st, 2009

    nice tips for flash
    thanks

    Reply
  11. Min Thu September 1st, 2009

    Thank you everyone. I am really happy to know your comments. :)

    Reply
  12. Tarek September 1st, 2009

    Nice tips. its useful .. thanks

    Hope we will get more like this from u :)

    Reply
  13. Wallpapers September 1st, 2009

    Thanks for the useful Tips

    Reply
  14. gregsmithsays September 1st, 2009

    Cool, thanks

    PS – Opera’s new browser is out today (Opera 10 RC) – Opera fans can download it here …

    Try it… you get hooked on it, for sure !

    http://opera.com

    Reply
  15. peshmerge September 1st, 2009

    thanks
    amazing

    Reply
  16. Robert September 1st, 2009

    Nice list of tips. Thanks for sharing.

    Reply
  17. yoshz September 1st, 2009

    thanks..very useful

    Reply
  18. Circle_L September 2nd, 2009

    Thank you soooooo much for the tips! time to pick up flash again for me now~! : )

    Reply
  19. Joseph September 2nd, 2009

    Thanks a lot made a mirror for the full file:

    http://www.mirrorfox.com/_y8rita9q

    Reply
  20. Vim September 2nd, 2009

    Great post min thu, really useful tips, the simple flash pre loader will come in use, thanks

    Reply
  21. myat thu hein September 2nd, 2009

    Very good for me ko min thu :).

    Reply
  22. devsoft.mobi September 2nd, 2009

    Cool tutorial, espacially the context menu one

    Reply
  23. Sam Logan September 2nd, 2009

    Great tutorials, some of these will come in very handy especially the buttons, considering I’m stuck in AS2!

    Reply
  24. Ray September 3rd, 2009

    Nice tutorials, you can add http://www.riacodes to your list

    Reply
  25. Ray September 3rd, 2009

    Sorry for the typo!
    Nice tutorials, you can add http://www.riacodes.com to your list

    Reply
  26. Stanley September 7th, 2009

    thanks ! ur information help me up!

    Reply
  27. supaat September 9th, 2009

    exciting…

    Reply
  28. Jayce September 10th, 2009

    Good for me ~ a very new flash user. :P

    Reply
  29. Hunson September 14th, 2009

    Dude, that’s very scattered of AS2 and AS3 tutorial, which are both almost a very different programming method. I said almost.

    Didn’t think you’re interested in flash btw, rejoice!

    ps: wonder if you’re interested in flash tutorial submission?

    Reply
  30. dizaiart September 30th, 2009

    thk u!

    Reply
  31. Carson Shold October 8th, 2009

    These are amazing. I’m just learning the basics of actionscript 3.0 so this exactly what I have been looking for.

    Thanks,
    Carson

    Reply
  32. Hemant October 10th, 2009

    thanks for this suggestions

    Reply

Leave a reply