Awesome! I found a great tutorial to build a custom scrollbar for text and tile list movies.
read more here: Go to tutorial. I’ve played around with it and it works great. It creates dynamic graphics that you can modify color, size and everything. Hope this is helpful someone else… I know it was a great find for me!
enjoy~
——————————————————————————————————————————————————-
TUTORIAL:
Scrollbars and Sliders
At the core of just about every scrollbar is the slider. A slider can be described as a track and a marker. The marker can be dragged along the length of the track where it’s position along the track is the visual representation of some percentage that we can read and write.
To promote a more flexible design we will be decoupling the way in which anything becomes aware of the scrollbar. Instead of the scrollbar modifying an object based on it’s percentage we will instead notify objects that the scrollbar has changed, providing them with the new percentage.
At this point we are discussing two agents in the design, a slider (which is itself a component that can be used 100% independently of the scrollbar ), and the event which our slider will broadcast.
These can be defined programatically as Slider and SliderEvent with the following classes:
ACTIONSCRIPT - Slider.as
————————————————————————————————————————————————————————————————————————-
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.geom.Rectangle;
/**
* Represents the base functionality for Sliders.
*
* Broadcasts 1 event:
* -SliderEvent.CHANGE
*/
public class Slider extends Sprite
{
// elements
protected var track:Sprite;
protected var marker:Sprite;
// percentage
protected var percentage:Number = 0;
/**
* The percent is represented as a value between 0 and 1.
*/
public function get percent():Number { return percentage; }
/**
* The percent is represented as a value between 0 and 1.
*/
public function set percent( p:Number ):void
{
percentage = Math.min( 1, Math.max( 0, p ) );
marker.y = percentage * (track.height - marker.height);
dispatchEvent( new SliderEvent( SliderEvent.CHANGE, percentage ) );
}
/**
* Constructor
*/
public function Slider()
{
createElements();
}
// ends the sliding session
protected function stopSliding( e:MouseEvent ):void
{
marker.stopDrag();
stage.removeEventListener( MouseEvent.MOUSE_MOVE, updatePercent );
stage.removeEventListener( MouseEvent.MOUSE_UP, stopSliding );
}
// updates the data to reflect the visuals
protected function updatePercent( e:MouseEvent ):void
{
e.updateAfterEvent();
percentage = marker.y / (track.height - marker.height);
dispatchEvent( new SliderEvent( SliderEvent.CHANGE, percentage ) );
}
// Executed when the marker is pressed by the user.
protected function markerPress( e:MouseEvent ):void
{
marker.startDrag( false, new Rectangle( 0, 0, 0, track.height - marker.height ) );
stage.addEventListener( MouseEvent.MOUSE_MOVE, updatePercent );
stage.addEventListener( MouseEvent.MOUSE_UP, stopSliding );
}
/**
* Creates and initializes the marker/track elements.
*/
protected function createElements():void
{
track = new Sprite();
marker = new Sprite();
track.graphics.beginFill( 0xCCCCCC, 1 );
track.graphics.drawRect(0, 0, 10, 100);
track.graphics.endFill();
marker.graphics.beginFill( 0x333333, 1 );
marker.graphics.drawRect(0, 0, 10, 15);
marker.graphics.endFill();
marker.addEventListener( MouseEvent.MOUSE_DOWN, markerPress );
addChild( track );
addChild( marker );
}
}
}
ACTIONSCRIPT -SliderEvent.as
————————————————————————————————————————————————————————————————————————-
package
{
import flash.events.Event;
public class SliderEvent extends Event
{
// events
public static const CHANGE:String = "change";
protected var percentage:Number;
/**
* Read-Only
*/
public function get percent():Number
{
return percentage;
}
/**
* Constructor
*/
public function SliderEvent( type:String, percent:Number )
{
super( type );
percentage = percent;
}
}
}
This code should be failry intuitive and require very little explanation if at all, so if there is something that is not understood, please ask and I will explain it.
Scrollbars
Since scrollbars are a composite of simpler components, the definition of a scrollbar is going to simply manage these components. We will talk about this design before showing the code.
Think about what differentiates a scrollbar and a slider (minus the context within which they operate). In data scrollbars and sliders represent the same thing, some percentage. The difference is the means in which the percentage can be modified.
A slider has a marker and a track, where the marker’s position is the ‘visual’ representation of the slider’s percentage. This marker can be dragged, allowing the user to modify the percentage.
A scrollbar is everything that a slider is in addition to allowing the user to press ‘arrows’ that increment/decrement the percentage by some predefined or calculated amount. You can remember in the design of the slider we allowed ourselves a means of modifying a sliders percentage programatically. This flexibility is what will allow us to implement the scrollbar.
Since what the scrollbar and slider represent in data are the same thing, we can use the same means of notifying a listener about changes in data. So our scrollbar class will be used merely to encapsulate the composition of the arrows and track. Remember that the way in which we notify the objects is the same, as a note instead of re-broadcasting the events we will simply register listeners for the Slider directly.
A simple implementation of the Scrollbar follows.
ACTIONSCRIPT - Scrollbar.as
————————————————————————————————————————————————————————————————————————-
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
public class Scrollbar extends Sprite
{
// elements
protected var slider:Slider;
protected var up_arrow:Sprite;
protected var down_arrow:Sprite;
protected var scrollSpeed:Number = .1;
// read/write percentage value relates directly to the slider
public function get percent():Number { return slider.percent; }
public function set percent( p:Number ):void { slider.percent = p; }
/**
* Constructor
*/
public function Scrollbar()
{
createElements();
}
// executes when the up arrow is pressed
protected function arrowPressed( e:MouseEvent ):void
{
var dir:int = (e.target == up_arrow) ? -1 : 1;
slider.percent += dir * scrollSpeed;
}
/**
* Create and initialize the slider and arrow elements.
*/
protected function createElements():void
{
slider = new Slider();
up_arrow = new Sprite();
up_arrow.graphics.beginFill( 0x666666, 1 );
up_arrow.graphics.drawRect( 0, 0, 10, 10 );
up_arrow.graphics.endFill();
down_arrow = new Sprite();
down_arrow.graphics.beginFill( 0x666666, 1 );
down_arrow.graphics.drawRect( 0, 0, 10, 10 );
down_arrow.graphics.endFill();
slider.y = up_arrow.height;
down_arrow.y = slider.y + slider.height;
up_arrow.addEventListener( MouseEvent.MOUSE_DOWN, arrowPressed );
down_arrow.addEventListener( MouseEvent.MOUSE_DOWN, arrowPressed );
addChild( slider );
addChild( up_arrow );
addChild( down_arrow );
}
/**
* Override the add and remove event listeners, so that SliderEvent.CHANGE events will be
* subscribed to the Slider directly.
*
* There is issues with this however, Event.CHANGE events will get subscribed directly too Slider as well.
*/
public override function addEventListener( type:String, listener:Function, useCapture:Boolean=false, priority:int=0, useWeakReference:Boolean=false ):void
{
if ( type === SliderEvent.CHANGE )
{
slider.addEventListener( SliderEvent.CHANGE, listener, useCapture, priority, useWeakReference );
return;
}
super.addEventListener( type, listener, useCapture, priority, useWeakReference );
}
public override function removeEventListener( type:String, listener:Function, useCapture:Boolean=false ):void
{
if ( type === SliderEvent.CHANGE )
{
slider.removeEventListener( SliderEvent.CHANGE, listener, useCapture );
return;
}
super.removeEventListener( type, listener, useCapture );
}
}
}
Once again this code should be failry intuitive, but I will actually go over this one.
Pretty much all we are doing here is creating the slider and the arrows and assigning their functionality. When either of the arrows are pressed the arrowPressed method gets invoked, we see which arrow was pressed, then we update the slider accordingly. The slider retains all of it’s previous functionality… because we haven’t touched it.
So now we have all of this… but still, it’s really not a scrollbar.
Content?
This part is by far the easiest, and can be thought of as yet another abstraction. We can build a ScrollContent class that is a composition of a scrollbar and some content.
We will assume that all content wishing to be scrolled is a Sprite. We will utilize various properties of the sprite to set up the scroll. The method in which we will scroll the content is simple and is explained in this post: http://www.createage.com/blog/?p=105.
Here is a simple implementation of the ScrollContent class.
ScrollContent
ACTIONSCRIPT - ScrollContent.as
————————————————————————————————————————————————————————————————————————-
package
{
import flash.display.Sprite;
import flash.geom.Rectangle;
public class ScrollContent extends Sprite
{
// elements
protected var content:Sprite;
protected var scrollbar:Scrollbar;
protected var contentHeight:Number;
/**
* Constructor
*/
public function ScrollContent( clip:Sprite, scroller:Scrollbar, scrollRect:Rectangle )
{
content = clip;
contentHeight = clip.height;
content.scrollRect = scrollRect;
scrollbar = scroller;
scrollbar.addEventListener( SliderEvent.CHANGE, updateContent );
}
public function updateContent( e:SliderEvent ):void
{
var scrollable:Number = contentHeight - content.scrollRect.height;
var sr:Rectangle = content.scrollRect.clone();
sr.y = scrollable * e.percent;
content.scrollRect = sr;
}
}
}
You can see that this is yet again another simple abstraction. It was a little more of a process to get started, but once complete you have a very flexible, very reusable base from which you can implement many different kinds of scrolling components.
The main class that was used to test this follows (it’s simple, you shouldn’t have an issue understanding it).
ACTIONSCRIPT - ScrollbarExample.as
————————————————————————————————————————————————————————————————————————-
package {
import flash.display.Sprite;
import flash.events.Event;
import flash.geom.Rectangle;
public class ScrollbarExample extends Sprite
{
public function ScrollbarExample()
{
var content:Sprite = new Sprite();
var scrollbar:Scrollbar = new Scrollbar();
var scroll_rect:Rectangle = new Rectangle( 0, 0, 100, 50 );
content.graphics.beginFill( 0xFF0000, 1 );
content.graphics.drawRect( 0, 0, 100, 50 );
content.graphics.beginFill( 0x00FF00, 1 );
content.graphics.drawRect( 0, 50, 100, 50 );
content.graphics.beginFill( 0x0000FF, 1 );
content.graphics.drawRect( 0, 100, 100, 50 );
content.graphics.endFill();
var rect:Rectangle = new Rectangle( 0, 0, 100, 50 );
var sc:ScrollContent = new ScrollContent( content, scrollbar, rect );
scrollbar.x = content.width;
addChild( content );
addChild( scrollbar );
}
}
}
Hi Hae Jeanson,
Great tutorial, I followed you instructions and it works perfectly. However, I’m having problems incorporating you code(which btw is perfect) into mine. I am new to actionscript, and thus having this problem. I wondering if you could have a look at my code, (which I know is far from perfect) and make any suggestion. I would deeply appreciate any help with this problem.
Thank you,
Kamran
My code is as follows:
package {
import caurina.transitions.*;
import flash.geom.Rectangle;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.*;
import flash.net.*;
import flash.text.*;
import flash.utils.*;
[SWF (/*width="1024", height="768",*/ framerate="31", backgroundColor="#FFFFFF" )]
public class PainSolutions2 extends Sprite
{
private var content:TextField;
private var content1:TextField;
private var xml:XML;
private var xmlList:XMLList;
private var nameLoader:Loader;
private var format:TextFormat;
private var button:Sprite;
private var button1:Sprite;
private var scrollbar:Scrollbar;
private var sc:ScrollContent;
private var rect:Rectangle;
private var scroll_rect:Rectangle;
public function PainSolutions2()
{
var xmlloader:URLLoader = new URLLoader();
xmlloader.addEventListener( Event.COMPLETE,xmlLoaded );
xmlloader.load( new URLRequest(”assets/text3.xml”));
format = new TextFormat();
format.font = “Helvetica Neue Light”;
format.size = 8;
content1 = new TextField();
scrollbar = new Scrollbar();
}
private function xmlLoaded(event:Event):void
{
xml = new XML (event.target.data);
xmlList = xml.children();
for(var i:int = 0; i < xmlList.length(); i++)
{
button = new Sprite();
content = new TextField();
content.text = xmlList[i].attribute(”title”);
button.x = 0;
button.y = i * 12 + 150;
content.autoSize = TextFieldAutoSize.LEFT;
content.selectable = false;
content.alpha = 1;
button.name = xmlList[i].attribute(”passage”);
content.setTextFormat(format);
button.addEventListener(MouseEvent.CLICK, showText);
addChild(button)
button.addChild(content);
button.buttonMode = true;
button.mouseChildren = false;
scroll_rect = new Rectangle( 0, 0, 100, 50 );
rect = new Rectangle( 0, 0, 200, 50 );
sc = new ScrollContent( button, scrollbar,rect );
scrollbar.x = 165;
scrollbar.y = 150;
addChild( scrollbar );
}
}
private function showText(event:MouseEvent):void
{
button1 = new Sprite();
content1.text = event.target.name;
content1.x = 180;
content1.y = 150;
content1.width = 400;
content1.height = 800;
content1.wordWrap = true;
content1.setTextFormat(format);
content1.selectable = false;
//addChild(content1);
addChild(button1)
button1.addChild(content1);
}
}
}
Hi Kamran! I need more of your code to test… But why don’t you try something like this?
package {
import caurina.transitions.*;
import flash.geom.Rectangle;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.*;
import flash.net.*;
import flash.text.*;
import flash.utils.*;
[SWF (/*width="1024", height="768",*/ framerate="31", backgroundColor="#FFFFFF" )]
public class PainSolutions2 extends Sprite
{
private var content:TextField;
private var content1:TextField;
private var xml:XML;
private var xmlList:XMLList;
private var nameLoader:Loader;
private var format:TextFormat;
private var button:Sprite;
private var button1:Sprite;
private var scrollbar:Scrollbar;
private var sc:ScrollContent;
private var rect:Rectangle;
private var scroll_rect:Rectangle;
public function PainSolutions2()
{
var xmlloader:URLLoader = new URLLoader();
xmlloader.addEventListener( Event.COMPLETE,xmlLoaded );
xmlloader.load( new URLRequest(”assets/text3.xml”));
format = new TextFormat();
format.font = “Helvetica Neue Light”;
format.size = 8;
content1 = new TextField();
button = new Sprite();
//scrollbar = new Scrollbar();
}
private function xmlLoaded(event:Event):void
{
xml = new XML (event.target.data);
xmlList = xml.children();
for(var i:int = 0; i < xmlList.length(); i++)
{
/*button = new Sprite();
content = new TextField();
content.text = xmlList[i].attribute(”title”);
button.x = 0;
button.y = i * 12 + 150;
content.autoSize = TextFieldAutoSize.LEFT;
content.selectable = false;
content.alpha = 1;
button.name = xmlList[i].attribute(”passage”);
content.setTextFormat(format);
button.addEventListener(MouseEvent.CLICK, showText);
addChild(button)
button.addChild(content);
button.buttonMode = true;
button.mouseChildren = false;*/
//scroll_rect = new Rectangle( 0, 0, 100, 50 );
//rect = new Rectangle( 0, 0, 200, 50 );
//sc = new ScrollContent( button, scrollbar,rect );
//scrollbar.x = 165;
//scrollbar.y = 150;
//addChild( scrollbar );
buildList(i, xmlList[i].attribute(”title”), xmlList[i].attribute(”passage”));
}
createScrollBar();
}
public function buildList(curIndex:int, titles:String, passages:String):void
{
content = new TextField();
content.autoSize = TextFieldAutoSize.LEFT;
content.selectable = false;
content.alpha = 1;
content.text = titles;
content.setTextFormat(format);
if(curIndex == 0)
{
content.y = 0;
}
else
{
content.y = button.height+3;
}
//button.x = 0;
//button.y = i * 12 + 150;
button.name = passages;
button.addEventListener(MouseEvent.CLICK, showText);
addChild(button);
button.addChild(content);
button.buttonMode = true;
button.mouseChildren = false;
}
public function createScrollBar():void
{
scrollbar = new Scrollbar();
rect = new Rectangle( 0, 0, 100, 50 );
sc = new ScrollContent( button, scrollbar,rect);
scrollbar.x = 165;
scrollbar.y = 150;
addChild(scrollbar);
}
private function showText(event:MouseEvent):void
{
button1 = new Sprite();
content1.text = event.target.name;
content1.x = 180;
content1.y = 150;
content1.width = 400;
content1.height = 800;
content1.wordWrap = true;
content1.setTextFormat(format);
content1.selectable = false;
//addChild(content1);
addChild(button1)
button1.addChild(content1);
}
}
}
Hi Hae Jeanson,
Thank you for your quick response. Your improved code did fix the problem. However, now when you click on the list, only the content for the last item shows. I’m going to give you my full code this time and will be eternally grateful for your help in this matter.
Thanks for your help,
Kamran
My code is as follows:
XML:
FireWorks
Actionscript:
package {
import caurina.transitions.*;
import flash.geom.Rectangle;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.*;
import flash.net.*;
import flash.text.*;
import flash.utils.*;
[SWF (/*width="1024", height="768",*/ framerate="31", backgroundColor="#FFFFFF" )]
public class PainSolutions2 extends Sprite
{
private var content:TextField;
private var content1:TextField;
private var xml:XML;
private var xmlList:XMLList;
private var nameLoader:Loader;
private var format:TextFormat;
private var button:Sprite;
private var button1:Sprite;
private var scrollbar:Scrollbar;
private var sc:ScrollContent;
private var rect:Rectangle;
private var scroll_rect:Rectangle;
public function PainSolutions2()
{
var xmlloader:URLLoader = new URLLoader();
xmlloader.addEventListener( Event.COMPLETE,xmlLoaded );
xmlloader.load( new URLRequest(”assets/text3.xml”));
format = new TextFormat();
format.font = “Helvetica Neue Light”;
format.size = 8;
content1 = new TextField();
scrollbar = new Scrollbar();
}
private function xmlLoaded(event:Event):void
{
xml = new XML (event.target.data);
xmlList = xml.children();
for(var i:int = 0; i < xmlList.length(); i++)
{
button = new Sprite();
content = new TextField();
content.text = xmlList[i].attribute(”title”);
button.x = 0;
button.y = i * 12 + 150;
content.autoSize = TextFieldAutoSize.LEFT;
content.selectable = false;
content.alpha = 1;
button.name = xmlList[i].attribute(”passage”);
content.setTextFormat(format);
button.addEventListener(MouseEvent.CLICK, showText);
addChild(button)
button.addChild(content);
button.buttonMode = true;
button.mouseChildren = false;
scroll_rect = new Rectangle( 0, 0, 100, 50 );
rect = new Rectangle( 0, 0, 200, 50 );
sc = new ScrollContent( button, scrollbar,rect );
scrollbar.x = 165;
scrollbar.y = 150;
addChild( scrollbar );
}
}
private function showText(event:MouseEvent):void
{
button1 = new Sprite();
content1.text = event.target.name;
content1.x = 180;
content1.y = 150;
content1.width = 400;
content1.height = 800;
content1.wordWrap = true;
content1.setTextFormat(format);
content1.selectable = false;
//addChild(content1);
addChild(button1)
button1.addChild(content1);
}
}
}
Sorry, It seems as though my Xml code did not go through. Here it is:
FireWorks
One more time:
FireWorks
package
{
import flash.display.Sprite;
import flash.display.MovieClip;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.display.Loader;
import flash.events.Event;
import flash.filters.BitmapFilter;
import flash.filters.DropShadowFilter;
import flash.text.TextFormat;
import flash.text.TextField;
import flash.text.AntiAliasType;
import flash.events.MouseEvent;
//import fl.transitions.Tween;
//import fl.transitions.easing.Strong;
//import fl.transitions.TweenEvent;
import flash.xml.*;
//import fl.controls.Slider;
//import fl.controls.SliderDirection;
//import flash.display.Sprite;
//import flash.events.MouseEvent;
//import flash.geom.Rectangle;
//import SliderEvent;
public class Main extends MovieClip
{
var xml:XML;
var images:Array;
var imagesLoaded:int=0;
var imagesTitle:Array=new Array();
//var tween:Tween;
var zoomed:Boolean=false;
var canClick:Boolean=false;
var lastX:int=10;
var lastY:int=50;
var i:int = 0;
var display_image:int;
//var scrollbar:ScrollBar;
//var tick:Sprite;
//var marker:Sprite;
//var percentage:Number=0;
//var maxscroll=4;
//var minscroll=0;
//var dragging:Boolean=false;
var textformat:TextFormat=new TextFormat();
var screen:Sprite=new Sprite();
//var formatForm:Avenir=new Avenir();
public function Main():void
{
screen.graphics.beginFill(0×111111)
screen.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
screen.graphics.endFill();
loadXML(”images.xml”);
//for slider
//createElements();
}
private function loadXML(file:String):void
{
var urlloader:URLLoader=new URLLoader();
var urlrequest:URLRequest=new URLRequest(file);
urlloader.load(urlrequest);
urlloader.addEventListener(Event.COMPLETE,handledXML);
}
private function handledXML(e:Event):void
{
xml = new XML(e.target.data);
images=new Array();
for (var i:int =0;i< xml.children().length(); i++)
{
var loader:Loader = new Loader();
var req:URLRequest =new URLRequest(String(xml.children()[i].@src));
loader.load(req);
images.push(loader);
imagesTitle.push(xml.children()[i].@title);
}
loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loaded);
}
private function loaded(e:Event):void
{
for (i=0;i<images.length;i++)
{
trace(i);
lastX=15;
lastY= 10;
lastY= lastY +60*i;
prepareImages(lastX,lastY,i );
}
}
private function prepareImages(lastX,lastY,i):void
{
var container:Sprite=new Sprite();
var frame:Sprite =new Sprite();
var infoArea:Sprite=new Sprite();
var infoField:TextField=new TextField();
var button_up:Sprite=new Sprite();
var button_down:Sprite=new Sprite();
button_up.graphics.beginFill(0×000000)
button_up.graphics.drawRect(40,2,20,20);
button_up.graphics.endFill();
button_up.buttonMode=true;
addChild(button_up);
button_down.graphics.beginFill(0×000000);
button_down.graphics.drawRect(40,380,20,20);
button_down.graphics.endFill();
button_down.buttonMode=true;
addChild(button_down);
//slider
/*var slider:Slider=new Slider();
slider.direction=SliderDirection.VERTICAL;
slider.tickInterval=1;
slider.move(20,10);
addChild(slider);
*/
//Frame
frame.graphics.beginFill(0xFFFFFF);
frame.graphics.drawRect(-20,-20,images[i].width+40, images[i].height+80);
frame.graphics.endFill();
//Background
infoArea.graphics.beginFill(0×111111,0.75);
infoArea.graphics.drawRect(0,0,images[i].width,60);
infoArea.graphics.endFill();
infoArea.y=images[i].height - 60;
infoField.defaultTextFormat = textformat;
infoField.embedFonts = true;
infoField.antiAliasType = AntiAliasType.ADVANCED;
infoField.width = images[i].width - 5;
infoField.height = 20;
infoField.text = imagesTitle[i];
//REsizing the images
container.scaleX=0.2;
container.scaleY=0.2;
//Position
//container.x=stage.stageWidth/4 + Math.floor(Math.random()* (stage.stageWidth/4));
//container.y=stage.stageHeight/5+Math.floor(Math.random()* (stage.stageWidth/5));
container.x=lastX;
container.y=(lastY );
//show filter
var shadowFilter:BitmapFilter = new DropShadowFilter(3, 90, 0×252525, 1, 2, 2, 1, 15);
var filterArray:Array = [shadowFilter];
container.filters = filterArray;
//add on stage
infoArea.addChild(infoField);
container.addChild(frame);
//var display_data:Array=new Array();
//display_data.splice(0,3);
//trace(display_data);
container.addChild(images[i]);
//trace(images[i]);
infoArea.visible = false;
container.addChild(infoArea);
//Add Listener
/*container.getChildAt(1).addEventListener(MouseEvent.MOUSE_UP, zoomHandler);
container.getChildAt(0).addEventListener(MouseEvent.MOUSE_DOWN, dragImage);
container.getChildAt(0).addEventListener(MouseEvent.MOUSE_UP, stopDragImage);
container.getChildAt(0).addEventListener(MouseEvent.MOUSE_UP, stopDragImage);
*/
button_up.addEventListener(MouseEvent.MOUSE_DOWN,ScrollPress);
button_up.addEventListener(MouseEvent.MOUSE_UP,ScrollLeave);
button_down.addEventListener(MouseEvent.MOUSE_DOWN,ScrollPress);
button_up.addEventListener(MouseEvent.MOUSE_UP,ScrollLeave);
addChild(container);
//scrollbar
/*scrollbar=new ScrollBar();
scrollbar.x=20;
scrollbar.y=300;*/
//Scrolling
function ScrollPress(e:MouseEvent):void
{
//container.scrollV -=1;
//container.scroll=container.scroll-1
}
function ScrollLeave(e:MouseEvent):void
{
//container.scrollV +=1;
}
//Drag Function
/*
function dragImage(e:MouseEvent):void
{
e.target.parent.startDrag();
}
function stopDragImage(e:MouseEvent):void
{
e.target.parent.stopDrag();
}
*/
//Zoom
/*function zoomInFinished(e:TweenEvent):void
{
zoomed = true;
canClick = true;
tween.obj.getChildAt(2).visible = true;
}
function zoomOutFinished(e:TweenEvent):void
{
zoomed = false;
removeChild(screen);
tween.obj.getChildAt(0).addEventListener(MouseEvent.MOUSE_DOWN, dragImage);
}
*/
}
//slider
/*public function get percent():Number
{
return percentage;
}
public function set percent( p:Number ):void
{
percentage = Math.min( 1, Math.max( 0, p ) );
marker.y = percentage * (track.height - marker.height);
dispatchEvent( new SliderEvent( SliderEvent.CHANGE, percentage ) );
}
*/
}
}
i have this Main class and i have to add slider.as and sliderEvent.as so, i am new can u tell me how can do this…
Thnx