logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
European Travel
Action Movies
Bible Basics
Houseplants
Romance Movies
Creativity
Family Travel


dailyclick
All times in EST

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

Building the Overlay Page Flash Storybook App


We will continue to work on the settings menu overlay page for the FlashR storybook app. In this tutorial, we will assemble the elements on the page.

  1. Now we will add two more layers to the Timeline. Our first layer will be a folder. Let's put all the elements for the settings menu on layers in this folder. Click on the pages layer and then on the folder icon to create a folder. You will see a new folder added just above the pages layer. Rename the folder "setMenu". The second layer will contain all the ActionScript for the main Timeline. Let's put this layer at the top of the stack and name it "actionsMain".

    We now have four layers and one folder on the Timeline.

    actionsMain
    setTogBtn
    folder - setMenu
    pages

  2. Inside the setMenu folder that we added to the Timeline layers we will add more layers for the background image for the settings menu overlay page and the png images that we will turn into buttons for the following links. Add six new layers inside the folder and give them the following names.

    indexBtn
    musicBtn
    creditsBtn
    moreAppsBtn
    websiteBtn
    setMenuBg

  3. Then import each corresponding png image to its layer and convert the png to a movie clip with a Name and Instance Name same as the layer name. Now that we are getting several png images in the Library, we should create a png folder to contain all of them.

    LayerLinked ToName of Movie ClipInstance Name
    indexBtn
    musicBtn
    creditsBtn
    moreAppsBtn
    websiteBtn
    setMenuBg
    Link to index page
    Link to toggle background music
    Link to credits page
    Link to advertising page
    Link to external website
    Background Image
    indexBtn
    musicBtn
    creditsBtn
    moreAppsBtn
    websiteBtn
    setMenuBg
    indexBtn
    musicBtn
    creditsBtn
    moreAppsBtn
    websiteBtn
    setMenuBg


  4. All of the elements for the settings menu overlay page are now on the stage. Position the button movie clips as needed over the background image. This will be the way the page will appear when it displays over the top of what's currently on the stage.

← Back | Next →


Join us in the Flash forum. | Join us in the Digital Art and Design forum.

|


Add Building+the+Overlay+Page+Flash+Storybook+App to Twitter Add Building+the+Overlay+Page+Flash+Storybook+App to Facebook Add Building+the+Overlay+Page+Flash+Storybook+App to MySpace Add Building+the+Overlay+Page+Flash+Storybook+App to Del.icio.us Digg Building+the+Overlay+Page+Flash+Storybook+App Add Building+the+Overlay+Page+Flash+Storybook+App to Yahoo My Web Add Building+the+Overlay+Page+Flash+Storybook+App to Google Bookmarks Add Building+the+Overlay+Page+Flash+Storybook+App to Stumbleupon Add Building+the+Overlay+Page+Flash+Storybook+App to Reddit



 



RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map


For FREE email updates, subscribe to the Flash and Animation Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

g


g features
Animating Color of Shapes in Motion 5

Motion 5 Parallax Effect - The Graphics

Animate Lower Third in Motion 5

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor