Taterboy, Multimedia and Such

MoveThis: Another AS3 Tweening / Animation Engine – taterboy
February 1st, 2011 | Filed under: ActionScript 3, Flash, Flex, Free Components/Classes, Games, Tutorials

UPDATE 1.20, 4/21/11 : new source files below

Animation is the primary reason our clients choose Flash based applications over HTML or any other language. Creating applications that dance is the “Rich” in RIA development.

Great animation or tween engines are plenty, GTween, TweenLite and Tweener are just a few. They provide a simpler way of animating with code. The Flash IDE team has also gone to great lengths to make working with animation in code easier for the designers. Even Flash Builder 4, which one could argue is a programmers tool, has new animation classes that are far more powerful than their predecessors.

Interactive Demos below…

Animation is what makes Flash, Flash:
MoveThis has been around in many different forms as my personal tween engine for the last 8 years. I think it’s finally in a condition that it can be shared. The idea has always been one line of code to make something move, it’s extremely simple to use, yet supports many great features.
Read More »

Technorati Tags: ActionSript 3, animation, animation engine, AS3, class, Flash, Flex, games, tween, tween class, tween egine, tweener

| 2 Comments »

SoundTrack an AS3 Sound Helper Class – taterboy
January 4th, 2011 | Filed under: ActionScript 3, Audio, Flash, Flex, Free Components/Classes, Games, Tutorials

Working on games and other projects that include many audio streams and sound effects can require a fair amount of code to manage the numerous channels and soundTransforms. This helper class started as a way to provide simple pause, play, stop and resume controls without all the channel mess. Another requirement was to make adjusting the volume and panning easier, maybe even allowing the use of existing tween engines to fade volume which was achieved by using volume as a property, instead of a method or SoundTransform.

Volume and Panning:

^?View Code ACTIONSCRIPT

soundTrack.volume = 0; //(Number 0 - 1)
 
soundTrack.pan = -1; //(Number -1 - 1)

Tween engine sample using GTween:

^?View Code ACTIONSCRIPT

var tween:GTween = new GTween(soundTrack,2,{volume:0});

note: GTween by Grant Skinner can be found here: http://gskinner.com/libraries/gtween/

Once a sound object is created, it can be place into a SoundTrack.

How to use:

^?View Code ACTIONSCRIPT

//create a new sound and soundTrack
var audioFile:Sound = new Sound(new URLRequest("audio.mp3"));
var soundTrack = new SoundTrack(audioFile);

Technorati Tags: ActionSript 3, audio player, fade, Flash, Flex, Loops, panning, sound, volume

| 2 Comments »

HDSlide an AS2 Class For Making Things Slide – taterboy
January 7th, 2010 | Filed under: ActionScript 2, Flash, Free Components/Classes

HDSlide is a collection of code brought together in an effort to make one actionsScript 2 class that will fulfill all your actionScript sliding needs. This version is very versatile with two completely different animation modes.

Animation Modes:
One animation mode will change the speed of the sliding animation based on how far the mouse is moved away from the center. When the mouse is in the middle, the animation moves very slowly, then speeds up as the mouse moves toward the edges. The other mode is more like scrolling, if your mouse is at the left side or top of the slide area, the slide will be at the beginning. As the mouse is moved to the other side, the sliding MovieClip will scroll based on the mouses position between the two extremes.

Current Samples:
The FLA contains two samples that show off just a few usage variations. The FLA was built in a hurry, so it is not an example of how things should be done, it is just a sample of what is possible. There are many more possibilities, just download the source and experiment. One example not shown is the ability to pause the mouse move detection using “pauseSlide(true)” while still having the slideTo() method fully functional.

Usage:
1. Create a MovieClip to be scrolled.
2. Then mask that MovieClip with another MovieClip.
3. Give them both instance names.
4. Import the class

^?View Code ACTIONSCRIPT

 import com.hdi.as2.HDSlide;

5. Create a new instance of the class with the instance names above in the arguments.

^?View Code ACTIONSCRIPT

var hSlide:HDSlide  = new HDSlide(menuMC, menuMask);

That’s it to make a simple sliding movieClip.
Read More »

Technorati Tags: ActionScript 2, animation, AS2, easing, Flash, mask, movieclip, scroll, slide

| No Comments »

Create Adobe AIR Badges At Any Size – taterboy
December 16th, 2009 | Filed under: ActionScript 3, Design, Flash, Flex, Free Components/Classes

UPDATE: 2/17/10

We added a redirect option to the HDBadge that allows AIR application install badges that are too small (smaller than 214×137) to redirect to another page or call a javascript function. The size 214×137 was as small as I could shrink the badge before the AIR install dialog would not show up (tested on a Mac w/Safari). See updates below.

Are you sick of trying to design around the existing Adobe AIR badge templates. In most cases they are way too large or have a look and feel that does not really match your design. A few companies have their own custom solutions with AIR badges that are nicely integrated into their sites. I wanted that for the updated ChessJam site, but instead of building one badge for each size, I wanted a completely flexible (one size fits all) solution from one swf.

The HDBadge Features:
1. One Size Fits All – The size of the badge is determined by the size you use in the object/embed code of the swf. The swf does not stretch, so you could have a badge that is 40×20 and 800×600 from the same swf, depending on your needs.

2. Smaller Footprint – One of the reasons the current badges are so large is they display AIR/App install error messages. This version hides the button after clicking revealing a console type area behind it. The error text conforms to the size of the swf.
Read More »

Technorati Tags: Adobe AIR, AIR, AIR badge, bages, custom, Flash, Flex

| 11 Comments »

Flash AS2 Count Down Timer – taterboy
August 5th, 2009 | Filed under: ActionScript 2, Flash, Free Components/Classes

Here is a simple countdown timer that is easily configured using flashVars. Below are all the available settings.

On April 12, 2012 our blog will be 4 years old.

Read More »

Technorati Tags: ActionScript 2, AS2, countdown, custom, Flash, free, timer

| 5 Comments »

HDflix an AS2 FLV Player For Custom Skins – taterboy
May 10th, 2009 | Filed under: ActionScript 2, Design, Flash, Free Components/Classes, Tips, Video

There are many video players and player skins available online, but it can take hours to build something completely custom. Here is an AS2 FLV player that can make creating completely custom Flash video players a lot easier. HDflix is a fully functional player, but allows you to assign your own artwork to the player controls. This is not skinning an existing component, it is creating artwork, then assigning the artwork pieces to each control. Once a control is assigned, rollovers, button state events and control functions are automatically applied to your artwork.

See the Readme file and demo below.
Read More »

Technorati Tags: ActionScript 2, AS2, custom skins, flash video player, flv, skins, Video Player

| 11 Comments »

Flash AS2 Pro Video Player – taterboy
March 7th, 2009 | Filed under: ActionScript 2, Flash, Free Components/Classes, Tips, Video

There are a some really nice video/swf players out there already, here is mine. It was first built in 2005, thus the out-dated design, but has been upgraded with some nice features over the years.

Some of the features include dynamic colors on the LED display that can be easily updated to match a site color scheme. Dynamic video size, AutoLoad, Jpeg placeholder, cookie support, and can run standalone or loaded into your own Flash app.

Another interesting feature is a loading system that tries to figure out the client’s download speed and buffer the correct amount. This works pretty well in most cases but some web servers can be unreliable when it comes to streaming video with a consistent data rate. So buffer times will very with each download.

Included are FLAs to skin the GUI and update the display logos. This is the pro version we were planning on selling, but were too busy with other projects and never got around to it.

Just a heads up, I have another video app that will be released shortly. It is very similar to my Scrollbar class, in that you do not skin it, the code wraps around artwork that you create to control flvs and audio files. That way you can go crazy with the UI design and the layout of each control. It is written in AS2 and will be coming soon, so check back.

Below is a demo and the contents of the included readme.txt file.
Read More »

Technorati Tags: AS2, custom, Flash, flv, Loading, player, scrub, swf, Video Player, volume

| 7 Comments »

Animation and Tweens Class for AS2 – taterboy
February 25th, 2009 | Filed under: ActionScript 2, Animation, Flash, Free Components/Classes, Tutorials

This is a two in one post, the first half will demonstrate how to build a small but powerful animation engine. The second half is a demo and source for an expanded version of the same animation engine.

The goals for our engine are:
1. Light Weight – We do not want to apply an onEnterFrame event handler on every MovieClip. Each instance of an onEnterFrame event increases processor usage, so we will use one onEnterFrame event to process all animation.

2. Robust – Issues can arise with you try daisy chain onEnterFrame events, garbage collection and rendering sequences can cause the chain to break. So we need a powerful management system.

3. Flexible – Some projects we only need to animate _alpha, others will need to tween _x, _y, _rotation, _xScale or a combination of them all. With a little extra code we can make this animation engine process most MovieClip Properties.
Read More »

Technorati Tags: Action Script 2, alpha, animation, AS2, Flash, rotation, tween, xscale, yscale

| No Comments »

Easy Custom Scrollbar Class for TextFields (AS2) – taterboy
September 17th, 2008 | Filed under: ActionScript 2, Design, Flash, Free Components/Classes, Tips

Here is the twin brother of the Easy Scrollbar MovieClip Class that works with TextFields. It does not require the masking and is perfect for Input TextFields. It has all the features of the MovieClip version except for easing. TextFields scroll one line at a time which is not very smooth.
Read More »

Technorati Tags: ActionScript 2, easy, Flash, scroll, Scrollbar, TextField

| 2 Comments »

Easy Flash Custom Scrollbar Class (AS2) – taterboy
September 10th, 2008 | Filed under: ActionScript 2, Design, Flash, Free Components/Classes, Tips

I know there are some really nice scroll components similar to this on the web, but I think this still has merit. It seems like every job comes with a different scroll bar design, the buttons and scroll bar can be any shape, size or configuration. While most Flash scroll bar components are easily skinned, this is kind of the opposite of skinning. You create the artwork, convert each item to a MovieClip, then apply the class. The code wraps the artwork instead of the artwork skinning the code.

This class started around 3 years ago and has been modified for many different projects and continued to evolve into what we have today. It is not perfect, but it can handle most jobs needing custom scroll bars.
Read More »

Technorati Tags: ActionScript 2, ease, easing, Flash, resize, Scroll Bar, Scrollbar

| 84 Comments »