【实现效果】
拖动右边绿色滑块,可以实现文的上下滚动。
【制作过程】
1.制作以下影片剪辑元件,并取好实例名称即mc、hk、jdt,mc即是我们要滚动的文本,所有元件注册点左上角。并把它们放于舞台之中,让它们的y值都为0,即对齐于舞台顶部,如图。
2.新建图层2为遮罩层,在场景中画一个影片剪辑为遮罩,注意其宽度和高度,不用取实例名称,如下图:
3.新建一层,在第一帧中编写代码:
hk.onPress = function() {
startDrag("hk",false,jdt._x,jdt._y,jdt._x,jdt._y+jdt._height-hk._height);
};
hk.onRelease = function() {
stopDrag();
};
hk.onReleaseOutside = function() {
stopDrag();
};
_root.onEnterFrame = function() {
mc._y = hk._y*(-252/156);
};
在代码中,关键的是mc._y = hk._y*(-252/156)如何计算,拖动滑块hk,mc文本滚动,也就是要求出mc在滚动中的y值,那么我们必须建立mc与hk之间的关系,它的公式是这样的mc._y = hk._y*( mc移动后的y值/ hk移动后的y值)。
具体做法是这样的:
在舞台中,将mc竖直向上移动,使其底部与jdt的底部对齐,然后再将hk向下移动,也使其底部与jdt的底部对齐。此时我们从属性面板中可以看到它们移动后的y值是多少,然后将其数值代入公式mc._y = hk._y*( mc移动后的y值/ hk移动后的y值)之中即可,如下图。
如向上移动mc:
我们可以看到其移动后的y值为-252。
如移动hk:
此时我们可以看到hk的y值为156。
所以将-252和156代入公式mc._y = hk._y*( mc移动后的y值/ hk移动后的y值),就得到了mc._y = hk._y*(-252/156),代码输入完毕后,再回到场景中,将mc和hk的y值设为0,让其对齐于舞台顶部,也就是让它还原。