Use Scrollbar Component
Go to Component panel and select component Scrollbar. Drag the component to the canvas or double click it in the panel, then set its properties and parameters in Properties panel.
If you want to learn the details about the properties and parameters of Scrollbar component, you may click here.
In Properties panel, you may set the general properties of the component under tab Properties. And the parameters are set under tab Parameters.
horizontal:
Here you may decide the scroll bar is oriented horizontally (true) or vertically (false).
lineScrollSize:
Input the number of lines or pixels scrolled when the user clicks the arrow buttons of the scroll bar.
pageScrollSize:
Input the number of lines or pixels scrolled when the user clicks the track of the scroll bar.
pageSize:
Input the number of items that can be viewed in the display area.
minPos:
Here you may set the lowest numbered line of text when the scroll bar is used vertically, or the lowest numbered pixel in the text field’s bounding box when the scroll bar is used horizontally. The value is usually 0.
maxPos:
Here you may set the highest numbered line of text when the scroll bar is used vertically, or the highest numbered pixel in the text field’s bounding box when the scroll bar is used horizontally.
enabled:
Here you may decide whether the component can receive focus and input. “true” means that the component is in the enabled state and it receives focus if you click it or tab to it while “false” means that the component is in the disabled state and it doesn’t receive mouse or keyboard input.
color:
You may edit the color of the component. Choose the color in the color box or customize one.
Save as default:
If you want to use the color you chose next time, you may click button Save as default for convenience.
As for event and method of Scrollbar, you may set under tab Action.
Here is a simple tutorial telling you how to create a scrollbar controlling an image scrolling as the example below.
AC_FL_RunContent( ‘codebase’,'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0′,’width’,’300′,’height’,’200′,’src’,’../c-image/scrollbar1′,’quality’,'high’,'pluginspage’,'http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash’,'movie’,’../c-image/scrollbar1′ ); //end AC code
1. Set properties of the canvas.
Click the canvas and the Properties panel turns to be the one for the whole animation. Under tab Properties, set Width:300, Height: 200.
2. Import an image and name it.
Click button Import and select an image in your computer. Set it fit the movie. Then go to the Properties panel of the image, under tab Properties, input the image’s name as “image”.
3. Add mask.
Click button Rectangle on the Toolbar, draw a rectangle on the image. Go to the Properties panel of the rectangle, under tab Properties, set X: 100, Y: 75, Width: 200, Height: 150. Tick the checkbox Serve as mask.
4. Add a horizontal scrollbar component.
Go to Component panel and drag Scrollbar to the canvas. Go to the Properties panel of the scrollbar, under tab Properties, set X: 0, Y: 150, Width: 200. Go to tab Parameters, set as the following picture:
Then go to tab Action, select “scroll” in the Event list, and input the following action script:
_root.image._x=-this.scrollPosition+150;
5. Add a vertically scrollbar component.
Go to Component panel and drag Scrollbar to the canvas. Go to the Properties panel of the scrollbar, under tab Properties, set X: 100, Y: 75, Height: 200. Go to tab Parameters, set as the following picture:
Then go to tab Action, select “scroll” in the Event list, and input the following action script:
_root.image._y=-this.scrollPosition+100;
6. Check the action script and preview the animation.
Go to tab Output and check whether there is error information there. If there is none information, it means you did not add wrong action script to the components. Click button Preview on Toolbar and preview your animation.