AS3多个(动画片段按钮)可为一个动画片段设置动画

时间:2017-08-05 19:22:00

标签: actionscript-3 flash button actionscript movieclip

我正在开发桌面应用程序。我通过Adobe Animate CC使用ActionScript 3。我设计了应用程序,动画GUI,并开始编码。主要功能已成功编码,但我添加了一些超出应用程序原始目标范围的其他功能。所有这一切只是为了将应用程序链接到一个网站和其他一些信息,这让我完全疯了,因为我花了太多时间用非常简单的if语句LOGIC!

无论如何,我创建了一个包含三个MovieClip按钮的菜单。这些菜单按钮单击会影响一个MovieClip,其具有随每次单击而移动的白色背景。我需要有一个背景来显示easeIneaseOut动画补间在点击每个按钮时的美妙效果。

关于点击了 when About button is clicked

图库点击了 when Gallery button is clicked

点击

联系 when contact button is clicked

为了便于理解,我用一个非常简单的球和3个按钮重新创建了代码。如果单击第一个按钮,则球会移动到第二个按钮上方的右侧。然后第一个按钮应该是不可点击的,除非点击另一个按钮。如果单击第二个按钮,则球将移动到第三个按钮上方的右侧。然后第二个按钮也应该是不可点击的,除非点击另一个按钮。第三个按钮也是如此。

Ball Demonstration

现在,如果再次单击第一个按钮,则在启动应用程序时,白色背景的动画不应从默认位置开始! 它应该从当前位置动画回到默认位置......依此类推......

为了简单起见,我用球替换了白色背景

这很容易,但我在eventListenerseventHandlersif语句中丢失了它! :/

我还制作了这张研究案例的表格:

Clicking Possibilities

我知道我的编码技术不够聪明,但那是因为 I HATE 使用类,包,项目文件夹......等等。

即使代码运行时间太长&重复,对我而言简单,因为编程不是我的日常工作!

请高度赞赏任何帮助和快速回复!

代码:

import flash.ui.Mouse;
import flash.events.MouseEvent;

one.addEventListener(MouseEvent.CLICK, moveToSecondPos);
two.addEventListener(MouseEvent.CLICK, moveToThirdPos);
//three.addEventListener(MouseEvent.CLICK, moveToFirstPos);

var buttonState:Boolean;
one.buttonState = 0;
two.buttonState = 0;
//three.buttonState = 0;

function moveToSecondPos(event:MouseEvent){
    if(one.buttonState == 0){
    theBall.gotoAndPlay("go1");
    one.buttonState = 1;
    }
    else if(two.buttonState == 1){
    theBall.gotoAndPlay("backToOne");
//  two.buttonState = 0;
//  one.buttonState = 1;
    }
    else{
    //disable About Button
    one.removeEventListener(MouseEvent.CLICK, moveToSecondPos);     
    }   
}

function moveToThirdPos(event:MouseEvent){
    if((two.buttonState == 0)&&(one.buttonState == 0)){
    theBall.gotoAndPlay("goProducts");
    two.buttonState = 1;
    }
    else if(one.buttonState == 1){
    theBall.gotoAndPlay("go2");
//  two.buttonState = 1;
//  one.buttonState = 1;
    }
    else{
    two.removeEventListener(MouseEvent.CLICK, moveToThirdPos);      
    }
}

//function moveToFirstPos(event:MouseEvent){
//  if(three.buttonState == 0){
//  theBall.gotoAndPlay("go3");
//  three.buttonState = 1;
//  }
//  else{
//  three.removeEventListener(MouseEvent.CLICK, moveToFirstPos);        
//  }
//}

1 个答案:

答案 0 :(得分:0)

首先,你提到你想拥有

  

启动应用程序时,白色背景不应从默认位置开始

为此,您需要ShareObject或类似的保存和加载数据的方法。

其次,看起来你可能正试图用场景和时间线的帧来做一些。我强烈建议你不要追求这一点。

以下是您提到的问题的解决方案。请注意,没有您的项目,我不得不重新创建场景。你可以复制&将解决方案粘贴到新场景中并进行编译。

  • 要阻止单击按钮,可以通过调用myButton.removeEventListener("click")删除事件侦听器。或者,您可以通过将其mouseEnabled属性设置为false来停止对象响应鼠标事件。
  • 要平滑地为框设置动画,您可以使用内置的Tween class。或者,我会指导你Greensock's TweenLite
  • 因为您似乎想要根据单击的按钮显示一系列标签,所以我创建了一个数组,用于存储特定于每个按钮的数据(btns:Array)。通过使用有组织的结构,编写不依赖于显式函数的可重用代码更容易。请注意,只有一个btnListener()功能适用于所有按钮。

<强>解决方案

import flash.display.Sprite;
import flash.events.Event;
import flash.text.TextField;
import fl.motion.Color;
import fl.transitions.*;
import fl.transitions.easing.*;

// the list of buttons we want, along with the descriptions for each
var btns:Object = [
    {
        "label":"About",
        "desc":"Learn more about us",
        "btn":null
    },
    {
        "label":"Gallery",
        "desc":"See our photos",
        "btn":null
    },
    {
        "label":"Contact",
        "desc":"Write, call, or message",
        "btn":null
    }
];

var nav:Sprite; // our navigation bar of buttons
var whiteBox:Sprite; // the "ball" with the content text
// where we save the coordinates of the whiteBox between loads
var settings:Object = SharedObject.getLocal("foo");

init();
function init():void {
    // Create our navigation of three buttons

    // our container for buttons
    nav = new Sprite(); 

    // reference to the last button
    var last:Sprite = null; 

    // loop through the list of buttons
    for each (var entry:Object in btns) {
        // For each button, create a new button
        var btn:Sprite = createButton(entry.label);
        entry.btn = btn;
        nav.addChild(btn);

        // If there was a previous button, place this beside it.
        if (last != null) {
            btn.x = last.x + last.width + 1;
        }

        last = btn;
    }

    // Place the nav onscreen
    addChild(nav);
    nav.x = stage.stageWidth/2 - nav.width/2;
    nav.y = stage.stageHeight - nav.height*2;

    // Create the whitebox
    whiteBox = new Sprite();
    whiteBox.graphics.beginFill(0xFAFAFA);
    whiteBox.graphics.drawRect(0, 0, 150, 50);
    whiteBox.graphics.endFill();

    var txt:TextField = new TextField();
    txt.name = "txt";
    txt.width = 150;
    whiteBox.addChild(txt);
    nav.addChild(whiteBox);

    // Load the settings from the last run of the program.
    if (settings.data.hasOwnProperty("x")) {
        whiteBox.x = settings.data.x;
        whiteBox.y = settings.data.y;
    } 
}

function createButton(label:String):Sprite {
    // Creates a simple button

    // Create the label
    var txt:TextField = new TextField();
    txt.text = label;

    // Create the background
    var btn:Sprite = new Sprite();
    btn.graphics.beginFill(0xA1A1A1);
    btn.graphics.drawRect(0, 0, txt.width + 60, txt.height + 30);
    btn.graphics.endFill();
    btn.addChild(txt);
    btn.name = label;
    txt.x = 30;
    txt.y = 15;

    // Hookup events
    btn.addEventListener("mouseOver", btnListener);
    btn.addEventListener("mouseOut", btnListener);
    btn.addEventListener("click", btnListener);

    return btn;
}

function btnListener(e:Event):void {
    var btn:Sprite = e.currentTarget as Sprite;
    var c:Color = new Color();
    var entry:Object;

    // Find our button in the list.
    for each (entry in btns) {
        if (entry.label == btn.name) {
            break;
        }
    }

    switch (e.type) {
        case "mouseOver":           
            if (btn.mouseEnabled) {
                c.setTint(0x0096ff, 0.5);
                btn.transform.colorTransform = c;
            }
            break;
        case "mouseOut":
            if (btn.mouseEnabled) {
                c.setTint(0x00, 0);
                btn.transform.colorTransform = c;
            }           
            break;
        case "click":
            // Set the text, and position of our whitebox
            whiteBox.getChildAt(0)["text"] = entry.desc;
            whiteBox.y = -whiteBox.height;

            var tween:Tween = new Tween(whiteBox, "x", Regular.easeOut, whiteBox.x, btn.x, 0.35, true);
            tween.addEventListener("motionFinish", saveState);

            for each (var v:Object in btns) {
                if (v.btn == btn) {
                    // make our button unclickable
                    btn.mouseEnabled = false;
                    c.setTint(0xFFFFFF, 0.5);
                    btn.transform.colorTransform = c;
                } else {
                    // Make the other buttons clickable;
                    v.btn.mouseEnabled = true;
                    c.setTint(0x00, 0);
                    v.btn.transform.colorTransform = c;
                }
            }
            break;
    }   
}

function saveState(e:Event):void {
    settings.data.x = whiteBox.x;
    settings.data.y = whiteBox.y;
    settings.flush();
}
相关问题