Exclusive Freebie: Custom AS3 Slider
High time we featured another exclusive freebie on Activetuts+ eh? Well here’s a great little AS3 powered Slider, completely free for use in any project you like!
AS3 Custom Slider
Here’s the sider in its simplest form:
And here it is in action, altering the contSL (contrast) property of the AdjustColor class, updating a bitmap as it does so. Check out my previous tut on the ColorMatrixFilter class to learn more about how this is done.
Features
This Slider includes the following options:
- Custom minimum range.
- Custom maximum range.
- Clean and good-looking skin.
- Displays current value.
Usage
Drag the source MovieClip and the Main.as file to your project folder and edit the desired options.
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.geom.Rectangle;
public final class Main extends Sprite
{
public final function Main():void
{
addListeners();
}
private final function addListeners():void
{
slider.head.addEventListener(MouseEvent.MOUSE_DOWN, initDrag);
slider.addEventListener(MouseEvent.MOUSE_UP, terminateDrag);
stage.addEventListener(MouseEvent.MOUSE_UP, terminateDrag);
}
private final function initDrag(e:MouseEvent):void
{
slider.head.startDrag(false, new Rectangle(0, 0, slider.width - slider.head.width, 0));
slider.addEventListener(MouseEvent.MOUSE_MOVE, onSliderMove);
stage.addEventListener(MouseEvent.MOUSE_MOVE, onSliderMove);
}
private final function onSliderMove(e:MouseEvent):void
{
slider.head.txtTF.text = slider.head.x; //Use your custom range here
slider.head.txt2TF.text = slider.head.x; //Use your custom range here
/* Live Action here: this action will be updated as soon as you move the slider */
}
private final function terminateDrag(e:MouseEvent):void
{
slider.head.stopDrag();
slider.removeEventListener(MouseEvent.MOUSE_MOVE, onSliderMove);
stage.removeEventListener(MouseEvent.MOUSE_MOVE, onSliderMove);
/* Action here: this action will be updated when the mouse button is released */
}
}
}
View full post on Activetuts+
