flash - 分阶段创建复杂的 Flash 翻转(循环 > 翻转动画 > 定时动画)

    2026-01-24 09:49:19

    更新:根据 OP 的评论,下面概述了一个新的建议解决方案。

    我在下面写了一个改进(但未经测试)的解决方案。由于您对 Flash 比较陌生,我添加了一些小“弯路”,希望能阐明 ActionScript 3 的各个部分是如何工作的,尤其是在事件处理方面。

    从头开始,这就是我设置您的主要 FLA 时间线的方式:

    在主时间线上创建 4 个图层 - 动作、热点、循环和卷曲,按从上到下的顺序

    在热点层上,创建一个覆盖剪辑“可鼠标”区域的矩形。将矩形的颜色设置为 alpha = 0 并删除它的所有边框。然后将其转换为 MovieClip 元件并将舞台实例命名为“hotspot_mc”。

    将循环影片剪辑放在循环图层上并将其命名为“loop_mc”。

    将卷曲电影剪辑放在卷曲层上,并将其命名为“curl_mc”。

    按照以下几行将代码添加到操作层的第一个关键帧:

    import flash.external.ExternalInterface;

    import flash.events.MouseEvent;

    import flash.events.Event;

    //Stops the main timeline on the first frame

    stop();

    //Makes the curl_mc invisible

    //(Note: alpha varies from 0 to 1, so for instance you can make any

    //clip half-transparent by typing clipName.alpha = 0.5)

    curl_mc.alpha = 0;

    //Stop the curl_mc clip from playing initially, we only want it to begin

    //playing on rollover

    curl_mc.stop();

    //Make your hotspot look like a button when users mouse over it

    //by setting these properties on it

    hotspot_mc.useHandCursor = true;

    hotspot_mc.buttonMode = true;

    //We attach our event handlers to the hotspot. Because the hotspot is a

    //rectangle of specific position and size it lets us control exactly where

    //mouse actions will trigger events. You *could* attach the handlers to

    //loop_mc instead, so a hotspot clip isn't strictly necessary, but it's

    //handy. You can also make the shape in the hotspot_mc any shape you

    //want, it does not need to be a rectangle.

    hotspot_mc.addEventListener(MouseEvent.ROLL_OVER, onLoopRollover, false, 0, true);

    hotspot_mc.addEventListener(MouseEvent.ROLL_OUT, onLoopRollout, false, 0, true);

    //Lastly, to be extra fancy, let's trigger your lightbox when

    //the user clicks the hotspot OR when the curl_mc dispatches

    //the 'curlComplete' event (which you will set up yourself on

    //the last frame of the curl_mc timeline).

    hotspot_mc.addEventListener(MouseEvent.CLICK, showLightbox, false, 0, true);

    curl_mc.addEventListener('curlComplete', showLightbox, false, 0, true);

    //When we roll over the hotspot, hide the loop and show the curl

    function onLoopRollover(e:MouseEvent):void

    {

    //Hide the loop animation so we can see the curl beneath it

    loop_mc.alpha = 0;

    loop_mc.stop();

    //Show the curl animation and play it

    curl_mc.alpha = 1;

    curl_mc.gotoAndPlay(1);

    }

    //When we roll out of the hotspot, hide the curl and show the loop

    function onLoopRollout(e:MouseEvent):void

    {

    loop_mc.alpha = 1;

    loop_mc.gotoAndPlay(1);

    curl_mc.alpha = 0;

    curl_mc.stop();

    }

    //Shows the JavaScript-based lightbox

    function showLightbox(e:Event = null):void

    {

    ExternalInterface.call('JS_ShowLightbox');

    }

    ...最后,在 curl_mc 时间线的最后一帧(在您的倒计时序列之后),将此代码添加到该时间线的动作层上的关键帧:

    import flash.events.Event;

    dispatchEvent(new Event('curlComplete'));

    stop();

    //dispatchEvent() is a function that sends an event out to be

    //handled by any listening handler functions (like the ones on

    //frame 1 of the main timeline). dispatchEvent() accepts an Event

    //as a parameter, which we create new for this purpose. In turn,

    //when creating a new Event, you pass in the name of the event so

    //that handlers can tell them apart. This matches the event name

    //passed in to addEventListener(eventName, eventHandler, false, 0, true).

    //This is how event handlers basically work in AS3. By putting this

    //code on the last frame of curl_mc, we use a new event to signal to

    //our application that the curl animation is done.

    当然,编码这种情况的方法不止一种。然而,通过这种方法,您将了解如何从应用程序的一个区域创建和“分派”事件,并让它们由您在不同位置编写的函数处理。

    原始答案:

    在鼠标悬停之前,我无法弄清楚如何制作初始循环,然后在鼠标悬停时播放回弹。如果用户滚下,则返回初始动画循环。

    使用 ActionScript 函数 gotoAndPlay() 和 gotoAndStop()。

    您可以使用这两个函数来创建循环并控制动画的播放。例如,如果您创建一个关键帧,选择它,然后打开“动作”窗口,您可以添加这个动作脚本:

    gotoAndPlay(1);

    一旦播放头到达这个关键帧,时间线就会跳到第 1 帧并从第 1 帧开始播放。这将创建从第 1 帧到关键帧的无限播放循环。每次播放头点击此关键帧时,它都会跳回并重新启动。

    如果在时间轴上定义了帧标签,您也可以使用它们,例如:

    gotoAndPlay('rolloverStart');

    gotoAndStop() 的工作方式相同,除了它会跳转到给定的帧并在那里停止动画。

    如果用户一直呆在角落里直到它被完全剥离,我需要在启动灯箱之前做一个小的倒计时(有点像 3、2、1 的情况)显示(这必须是 jQuery,还是可以完成在 Flash 中?)在浏览器中提供内容。

    澄清一下,有两个功能需要执行:

    当用户将鼠标悬停在角落(“热点”)上时,将开始播放辅助动画并在完成后执行操作

    Flash 必须在网页上引发灯箱

    回复:功能#1,我能想到的最简单的方法是将倒计时动画添加到翻转动画的末尾。这有效地创建了一个长的翻转动画,最后有一个动作。

    回复:函数#2,你可以使用Flash调用Javascript函数,包括一个显示灯箱的函数。在倒计时动画结束时,您可以添加一个关键帧并使用此 ActionScript 3 代码:

    import flash.external.ExternalInterface;

    ExternalInterface.call('JS_ShowLightbox');

    如果您的网页中有一个名为 JS_ShowLightbox() 的 Javascript 函数,它将在 Flash 到达此关键帧时调用。

    高温下,

    罗斯