Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
The Handle
Although an instance of the handle movie clip is on Frame 2, the component never actually goes to Frame 2. These movie clips are placed here to make editing more convenient and as a way to force them to be loaded into the SWF file without checking the Export in First Frame check box in the Symbol Properties dialog box (see Figure 11). You still must select the Export for ActionScript option, however.
)
Figure 11 Timeline of the SeekBar movie clip
You might notice that the handle movie clip has a rectangle in the background with alpha set to 0. This rectangle increases the size of the handle’s hit area, making it easier to grab without changing its appearance, similar to the hit state of a button. Because the handle is created dynamically at runtime, it must be a movie clip and not a button. This rectangle with alpha set to 0 is not necessary for any other reason and, generally, you can replace the inside of the handle with any image you want. It works best, however, to keep the registration point centered horizontally in the middle of the handle movie clip.
To manage the SeekBar Component handle, the following ActionScript code should be on Frame 1 of the SeekBar movie clip (See Figure 12):
stop(); handleLinkageID = "SeekBarHandle"; handleLeftMargin = 2; handleRightMargin = 2; handleY = 11;
The call to the stop() function is necessary to keep the playback head away from Frame 2.
)
Figure 12 The ActionScript that controls the handle of the Seekbar movie clip
The second line specifies which symbol to use as the handle, and you should not need to change it if you simply edit the handle movie clip instance on Frame 2. At runtime, the FLVPlayback component creates an instance of the specified movie clip on the Stage as a sibling of the Bar component instance, which means that they have the same parent movie clip. So, if your bar is at the root level, your handle must also be at the root level.
The variable handleLeftMargin determines the handle’s original location (0%), and the variable handleRightMargin determines where it is at the end (100%). The numbers give the offsets from the left and right ends of the bar control, with positive numbers marking the limits within the bar, and negative numbers marking the limits outside the bar. These offsets specify where the handle can go, based on its registration point. If you put your registration point in the middle of the handle, the handle’s far left and right sides will go past the margins. This is why a SeekBar movie clip must have its registration point at the upper-left corner of its content to work properly.
The variable handleY determines the y position of the handle relative to the bar instance. This is based on the registration points of each movie clip. The registration point in the sample handle is at the tip of the triangle to place it relative to the visible part, disregarding the invisible hit state rectangle. Also, the movie clip must keep its registration point at the upper-left corner of its content to work properly.
The best way to understand this script is to experiment with different offset values. For example, if the bar control is set at (100, 100), and it is 100 pixels wide, the handle can range from 102 to 198 horizontally and stay at 111 vertically. If you change the handleLeftMargin and handleRightMargin to -2 and handleY to -11, the handle can range from 98 to 202 horizontally and stay at 89 vertically. Try it and see for yourself the resulting behavior of the handle (see Figure 13).
)
Figure 13 The handle location with handleY = 11 (left) and handleY = 18 (right).
For more information about the inner workings of these FLVPlayback UI components see the "Using Components" section of Flash Help.
And for more general information about using and customizing the Flash FLVPlayback component, visit my web site.