Showing posts with label Embed. Show all posts
Showing posts with label Embed. Show all posts

11.5.09

AS3: Embedding Sounds in FlashDevelop

Embedding Sounds in FlashDevelop


Embedding sounds in an AS3 movie will give fast access with no preloading. As an alternative, the same sounds can be used in multiple movies. In order to update sounds without rebuilding your project, or to save space by using the same images in multiple movies, you may want to also check out a tutorial on how to load sounds from an external source here.

The Set Up:
  • Get yourself a soundclip. Flash supports many types of embedded sound including:

  • AAC, AIFF, MP3, AVI, WAV, AU

  • Create a new AS3 project space in FlashDevelop.

  • Right click on your "src" folder, in the dropdown menu click "add >> new folder"

  • Change the name of your New Folder to snd.

  • Now add your soundclip to the project in one of two ways:

  • A) Find your soundclip in the windows filesystem and drag it directly into your project and drop it on your "snd" folder.

  • B) Right click the "snd" folder, click "add >> existing item", select the soundclip you want to add.

Note: Creating the "snd" folder is not necessary, it is just good to get in the habit of organizing your projects. Alternately you could just store everything directly in the "src" folder.


Getting your image in the movie:

  1. Add the Embed tag:
    You need to create an embed tag in order to make your soundclip accessible to the movie:
    [Embed(source='snd/sound.mp3')]
    "snd" corresponds to the folder the clip is stored in, and "sound.mp3" should be replaced with the name of your file.


  2. Create a class for the Embed tag:
    In order to use the embed tag, a class variable must be defined directly below it. This class variable is instantiated to create the embedded sound. The signature of a variable used for embedding can vary, the example below is a class variable and should be added after the opening brackets of your class, before any function definitions:
    [[Embed(source='snd/sound.mp3')]

    private const embeddedSound:Class;

  3. Create an instance an embedded sound:
    In order to create a useable object from a soundclip class, you simply create a new instance if the soundclip's class, and cast it to an instance of Sound. This code should go after the //entry point comment in your AS3 project.
    var soundClip:Sound = new embeddedSound(); // Create an instance of the embedded sound

  4. Play the sound:
    All that is left is to play the sound. This code can be inserted directly below the code from step 3:
    soundClip.play(); // Play the sound

.zip source for this project can be found here

9.5.09

AS3: Embedding Images in FlashDevelop with AS3

Embedding Images in FlashDevelop with AS3

Embedding images in an AS3 movie will give faster access to images without preloading. As an alternative, the same images can be used in multiple movies. In order to update images without rebuilding your project, or save space by using the same images in multiple movies, you may want to also check out a tutorial on how to load images from an external source here.

The Set Up:

  • Get yourself an image. I haven't found a definite confirmation of formats supported for embedding anywhere, but from personal use I know "gif/jpg/png/svg" filetypes are supported. SVG is a vector graphic file, which I used Inkscape (a free open source vector art program) to create.
  • Create a new AS3 project space in FlashDevelop.
  • Right click on your "src" folder, in the dropdown menu click "add >> new folder"
  • Change the name of your New Folder to img.
  • Now add your image to the project in one of two ways:
  • A) Find your image in the windows filesystem and drag it directly into your project and drop it on your "img" folder.
  • B) Right click the "img" folder, click "add >> existing item", select the image you want to add.

Note: Creating the "img" folder is not necessary, it is just good to get in the habit of organizing your projects. Alternately you could just store everything directly in the "src" folder.

Getting your image in the movie:

  1. Add the Embed tag:
    FlashDevelop makes it easy to generate the necessary code to embed images. Place the typing cursor on an empty line above your main function. Next, in the Project View, right click on your image and click "Insert Into Document". FlashDevelop should add something like this at the cursor:
    [Embed(source='img/image.png')]
  2. Create a class for the Embed tag:
    In order to use the embed tag, a class variable must be defined directly below it. This class variable is instantiated to create the embedded image. The signature of a variable used for embedding can vary, the example below is a class variable and should be added after the opening brackets of your class, before any function definitions:
    [[Embed(source='img/image.png')]
    private const embeddedImage:Class;
  3. Create an instance an embedded image:
    In order to create a useable object from an image class, you simply create a new instance if the image class, and cast it to an instance of DisplayObject. This code should go after the //entry point comment in your AS3 project.
    // entry point
    var imgInstance:DisplayObject = new embeddedImage();
  4. Display the image:
    All that is left is to display the image. The position and rotation can be adjusted first, or they can be left to default (zero). This code can be inserted directly below the code from step 3:
       imgInstance.x = 50; // Set x coordinate of image
    imgInstance.y = 45; // Set y coordinate of image
    imgInstance.rotation = 45; // Set rotation to 45 degrees
    addChild(imgInstance); // Add this image to the Sprite object

.zip source for this project can be found here