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
Romance Movies
Creativity
Family Travel
Southwest USA
Irish Culture
Home Finance
Comedy Movies


dailyclick
All times in EST

Low Carb: 8:00 PM

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

Flash Catalyst and Artwork


One great feature of FlashR CatalystTM CS5 is that you can turn any static artwork into an interactive component such as a button, text input box or slider. Another great feature of Flash Catalyst is that it not only writes the code to program the interactive components but its menu-driven interface makes creating these components an almost full-proof process.

Let's walk through the process of converting two small graphics into a slider component. We have already created these two graphics in PhotoshopR. The first thing that we need to do is import our artwork into Catalyst. When we do, you will notice that the elements in the artwork maintain their layer positions. Catalyst also maintains any filters, effects and editable text.

The control center for working with artwork in Catalyst is the HUD (Head-up Display). This box will change as needed as you work indicating what your next step should be and giving you the menus you need for that step. Let's use the HUD to convert our arrow line and cat into a horizontal slider component.

Once we select both the arrow line and cat, the HUD changes to tell us that we have 2 items selected and gives us a menu list of possible components. Once we choose the Horizontal Slider component from the Convert Artwork to Component Choose Component menu, the cat and arrow line in the Layers panel have been combined and renamed 'Horizontal Slider" and the HUD changes to tell us that the next step is to define the parts of the slider.

A slider has two parts which are the Thumb (the object that slides along the horizontal line) and the Track. We need to tell Catalyst that we want our cat to be the Thumb and the arrow line to be the Track. When we click the Edit Parts button in the HUD, the workspace changes to "editing mode" for the Horizontal Slider. Just as in Flash, you can see where you are by watching the "breadcrumbs" at the upper left. You will also notice that the Layers panel now shows the cat and arrow line as two elements inside the HorizontalSlider.

Next, the HUD tells us that we need to select one of the elements and convert it to one of the Horizontal Slider's parts. Let's select the cat and choose Thumb from the Choose Part menu. The Layers panel changes the name of our first element from cat to Thumb. We will repeat this for the arrow line to make it the Track. The only thing left to do is to test our new component.

*Adobe provided a review copy to me free of charge.



Join us in the Flash forum.




Add Flash+Catalyst+and+Artwork to Twitter Add Flash+Catalyst+and+Artwork to Facebook Add Flash+Catalyst+and+Artwork to MySpace Add Flash+Catalyst+and+Artwork to Del.icio.us Digg Flash+Catalyst+and+Artwork Add Flash+Catalyst+and+Artwork to Yahoo My Web Add Flash+Catalyst+and+Artwork to Google Bookmarks Add Flash+Catalyst+and+Artwork to Stumbleupon Add Flash+Catalyst+and+Artwork 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
Drop Zones and Transitions in Motion 5

Craft Product Template - Background Layer

Craft Product Template Layers

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