ultimateScroller ActionScript Reference

 

 

 

Introduction

 

Properties

 

horizontal       

scrollTarget

size

scrollWidth  NEW

scrollBuffer      

scrollAmount

easing

useMask

borderStyle
dragVisible
setDragHeight

dragHeightAuto

scrollSide

 

Style Properties 

 

face

shadow

darkshadow

highlight

highlight3d

arrow

foregroundDisabled

scrollTrack          

 

Border Color Properties

 

borderColorTop

borderColorBottom

borderColorLeft

borderColorRight

 

            Skin Customization Properties

                       

scrollTrackVisible  NEW

buttonsVisible  NEW

arrowsVisible  NEW

arrowDefaultColor  NEW

useDisabledColor  NEW

 

Methods

 

scrollUp

scrollDown

pageUp

pageDown

scrollToTop

scrollToBottom

getScrollPosition

setScrollPosition

                  

 


Introduction

 

The following document details the use of the properties and methods of the ultimateScroller Component via ActionScript.

 

If you don’t want to use ActionScript, all of the following properties and methods can be set within Flash MX by dropping the ultimateScroller Component onto the scroll target, scaling the component to the desired size and setting the properties shown in the Parameters Panel.

All examples are based on the ultimateScroller component having an instance name of ‘myScroller’. In your own movie, you will replace this with whatever you name the instance of the ultimateScroller Component.

 

Properties

 

horizontal      

 

If set to true the scroller is displayed horizontally. The scroller will scroll the target across the X axis.

 

myScroller.horizontal = true;// turns horizontal scrolling on.

 

If set to false (Default), the scroller is displayed vertically. The scroller will scroll the target across the Y axis.

 

myScroller.horizontal = false;// turns vertical scrolling on (Default).

 

trace(myScroller.horizontal); // outputs the current value;

 

scrollTarget    

 

Sets the target movie clip.

 

myScroller.scrollTarget = _root.myMovie; // sets the scrollTarget to myMovie on the root timeline.

 

trace(myScroller.scrollTarget); // traces the value of the scrollTarget property;

 

size

 

Sets the size (width if horizontal or height if vertical) of the scroller in pixels.

 

myScroller.size = 220; // sets the size of the scroller to 220 pixels.

 

trace(myScroller.size); // traces the value of the size property;

 

scrollWidth

 

Sets the width of the ultimateScroller.

 

myScroller.scrollWidth = 10; // sets the width of the utlimateScroller to 10.

 

trace(myScroller.scrollWidth); // traces the value of the scrollWidth property;

 

scrollBuffer    

 

Sets the number of pixels to buffer/margin the scrolling of the target.

 

myScroller.scrollBuffer = 40;// sets the scroll buffer to be 40 pixels.

 

trace(myScroller.scrollBuffer); // traces the value of the scrollBuffer property;

 

scrollAmount

 

Sets the number of pixels the scroll target is scrolled by when the up or down buttons are pressed.

 

myScroller.scrollAmount = 80;// sets the scroll amount to 80 pixels.

 

trace(myScroller.scrollAmount); // traces the value of the scrollAmount property;

 

easing

 

If set to low the scroll target will gently ease into position.

 

myScroller.easing = “low”; // turns easing on low.

 

If set to med the scroll target will more slowly ease into position.

 

myScroller.easing = “med”; // turns easing on med.

 

If set to high the scroll target will very slowly ease into position.

 

myScroller.easing = “high”; // turns easing on med.

 

If set to none the scroll target not ease, but will snap into position.

 

myScroller.easing = “none”; //turns easing off.

 

trace(myScroller.easing); // traces the value of the easing property;

 

useMask

 

If set to true the scroll target will be masked.

 

myScroller.useMask = true; // turns masking on.

 

If set to false the scroll target will not be masked.

 

myScroller.useMask = false; //turns masking off.

 

trace(myScroller.useMask); // traces the value of the useMask property;

 

borderStyle

 

If set to none no border will be drawn around the scroll target.

 

myScroller.borderStyle = “none”; // turns border off.

 

If set to 3d an inset 3D border will be drawn around the scroll target.

If borderStyle is 3d then the border colors will be inherited from the Style Properties (shadow, highlight3d etc).

 

myScroller.borderStyle = “3d”; // sets border style to 3D.

 

If set to line a standard line border will be drawn around the scroll target.

If borderStyle is line then the border colors can be set using the Border Color Properties (borderColorTop, borderColorLeft etc).

 

myScroller.borderStyle = “line”; // sets border style to line.

 

trace(myScroller.borderStyle); // traces the value of the borderStyle property;

 

dragVisible

 

If set to false, the dragbar will not be visible.

 

myScroller.dragVisible = false; // turns dragbar visibility off.


myScroller.dragVisible = true; // turns dragbar visibility on.

 

trace(myScroller.dragVisible); // traces the value of the dragbar visibility;

 

 

setDragHeight

 

Defines a fixed height for the dragbar.

 

myScroller.setDragHeight(myHeight); // defines the height in pixels.

 

 

dragHeightAuto

 

Sets the dragbar height to resize automatically or to be at a fixed height.

 

myScroller.dragHeightAuto = true; // turns the auto-height for the dragbar on.

 

myScroller.dragHeightAuto = off; // turns the auto-height for the dragbar off.

 

trace(myScroller.dragHeightAuto); // traces the value of the dragbar auto-height;

 

 

scrollSide

 

Defines whether the scroller is on the left or right of the movieClip.

 

myScroller.scrollSide = “left”; // sets the mask and borders for scrollbar positioned on left.

 

myScroller.scrollSide = “right”; // sets the mask and borders for scrollbar positioned on right (this is the default).

 

trace(myScroller.scrollSide); // traces the value of the scrollbar position setting;

 

Style Properties

 

These properties set the colors of the scroller elements (buttons, scroll-track,drag-bar and border(if borderStyle is ‘3d’)).

 

face

 

Sets the color of the ‘face’ elements of the scroller.

 

myScroller.face = 0xCCCCCC; // sets the face color to Silver.

 

trace(myScroller.face); // traces the value of the face property;

 

shadow

 

Sets the color of the ‘shadow’ elements of the scroller.

 

myScroller.shadow = 0x848284; // sets the shadow color to Dark Grey.

 

trace(myScroller.shadow); // traces the value of the shadow property;

 

darkshadow

 

Sets the color of the ‘darkshadow’ elements of the scroller.

 

myScroller.darkshadow = 0x808080; // sets the darkshadow color to Dark Grey.

 

trace(myScroller.darkshadow); // traces the value of the darkshadow property;

highlight

 

Sets the color of the ‘highlight’ elements of the scroller.

 

myScroller.highlight = 0xFFFFFF; // sets the highlight color to White.

 

trace(myScroller.highlight); // traces the value of the highlight property;

highlight3d

 

Sets the color of the ‘highlight3d’ elements of the scroller.

 

myScroller.highlight3d = 0xD6D3CE; // sets the highlight3d color to Light Grey.

 

trace(myScroller.highlight3d); // traces the value of the highlight3d property;

 

arrow (the arrows on the buttons)

 

Sets the color of the ‘arrow’ elements of the scroller.

 

myScroller.arrow = 0x000000; // sets the arrow color to Black.

 

trace(myScroller.arrow); // traces the value of the arrow property;

foregroundDisabled (the arrows on the buttons when disabled)

 

Sets the color of the ‘foregroundDisabled’ elements of the scroller.

 

myScroller.foregroundDisabled = 0x999999; // sets the face color to Grey.

 

trace(myScroller.foregroundDisabled); // traces the value of the foregroundDisabled property;

scrollTrack

 

Sets the color of the ‘scrollTrack’ element of the scroller.

 

myScroller.scrollTrack = 0xFFFFFF; // sets the scrollTrack color to White.

 

trace(myScroller.scrollTrack); // traces the value of the scrollTrack property;

 

Border Color Properties

 

These properties set the colors of the border lines (when borderStyle is set to ‘line’).

 

borderColorTop

 

Sets the color of the top line of the border.

 

myScroller.borderColorTop = 0xFFFF00; // sets the borderColorTop color to Yellow.

 

trace(myScroller.borderColorTop); // traces the value of the borderColorTop property;

 

borderColorBottom

 

Sets the color of the bottom line of the border.

 

myScroller.borderColorBottom = 0xFF0000; // sets the borderColorBottom color to Red.

 

trace(myScroller.borderColorBottom); // traces the value of the borderColorBottom property;

 

borderColorLeft

 

Sets the color of the left line of the border.

 

myScroller.borderColorLeft = 0xFFFF00; // sets the borderColorLeft color to Yellow.

 

trace(myScroller.borderColorLeft); // traces the value of the borderColorLeft property;

 

borderColorRight

 

Sets the color of the right line of the border.

 

myScroller.borderColorRight = 0xFF0000; // sets the borderColorRight color to Red.

 

trace(myScroller.borderColorRight); // traces the value of the borderColorRight property;

 

Skin Customization Properties

 

These properties define the visibility and of the scroll elements for skin customization purposes.

 

scrollTrackVisible

 

Sets the visibility of the scrollTrack.

 

myScroller.scrollTrackVisible = false; // sets the scrollTrack visibility to false.

 

trace(myScroller.scrollTrackVisible); // traces the value of the scrollTrackVisible property;

 

buttonsVisible

 

Sets the visibility of the scroll buttons.

 

myScroller.buttonsVisible = false; // sets the visibility of the buttons to false.

 

trace(myScroller.buttonsVisible); // traces the value of the buttonsVisible property;

 

arrowsVisible

 

Sets the visibility of the scroll arrows.

 

myScroller.arrowsVisible = false; // sets the arrow visibility to false.

 

trace(myScroller.arrowsVisible); // traces the value of the arrowsVisible property;

 

arrowDefaultColor

 

Sets whether the arrows appear in their default color or in the color defined for them.

 

myScroller.arrowDefaultColor = true; // sets the arrows to use their default color.

 

trace(myScroller.arrowDefaultColor); // traces the value of the arrowDefaultColor property;

 

useDisabledColor

 

Sets whether arrows use the defined disabled color or the color of the arrow movieClip.

 

myScroller.useDisabledColor = false; // sets the arrows not to use predefined disabled color.

 

trace(myScroller.useDisabledColor); // traces the value of the useDisabledColor property;

 

Methods

scrollUp

 

Scrolls the scrollTarget up by the scrollAmount value.

 

myScroller.scrollUp(); // scrolls up

scrollDown

 

Scrolls the scrollTarget down by the scrollAmount value.

 

myScroller.scrollDown(); // scrolls down

pageUp

 

Scrolls the scrollTarget up by a whole page.

 

myScroller.pageUp(); // scrolls up by whole page

pageDown

 

Scrolls the scrollTarget down by a whole page.

 

myScroller.pageDown(); // scrolls down by whole page

scrollToTop

 

Scrolls the scrollTarget to the top.

 

myScroller.scrollToTop(); // scrolls to top

scrollToBottom

 

Scrolls the scrollTarget to the bottom.

 

myScroller.scrollToBottom(); // scrolls to bottom

 

getScrollPosition

 

Gets the current position of the scroller.

 

myScroller.getScrollPosition(); // gets the current scroll position

setScrollPosition

 

Scrolls to a defined position.

 

myScroller.setScrollPosition(scrollPos); // scrolls to the position defined by scrollPos