动作脚本3：添加gotoAndStop动画 [英] Action Script 3: Adding an gotoAndStop Animation
本文介绍了动作脚本3：添加gotoAndStop动画的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
于是有一天，我发现了如何在动作脚本图案锁屏的教程。要做到这一点，我不得不创建一个类，我有一个很好的把握就如何类工作。但我想添加动画，所以当用户进入过的图案和动画播放的点。但我不知道怎么做这样的事情通过类。这里是code我曾经在我的课。
包
{
进口flash.display.Sprite;
进口flash.events.MouseEvent;
进口fl.transitions.Tween;
进口fl.transitions.easing.Strong;
公共类主要扩展Sprite
{
私人VAR点：数组= []; //存储的舞台影片剪辑
私人VAR模式：数组= []; //由用户输入的模式
私人VAR通：数组= [1,4,7,8,5,2,5] //正确的方式进行
公共函数main（）：无效
{
点= [一，二，三，四，五，六，七，八，九]; //在舞台中添加剪辑
addListeners（）;
}
私有函数addListeners（）：无效//添加了听众每个点
{
VAR dotsLength：INT = dots.length;
对于（VAR我：= 0; I＆LT; dotsLength;我++）
{
点[I] .addEventListener（的MouseEvent.MOUSE_DOWN，initiatePattern）;
点[I] .addEventListener（侦听MouseEvent.MOUSE_UP，stopPattern）;
}
}
/ *添加一个鼠标监听器，并用它来点的号码添加到图案* /
私有函数initiatePattern（E：MouseEvent）方法：无效
{
VAR dotsLength：INT = dots.length;
对于（VAR我：= 0; I＆LT; dotsLength;我++）
{
点[I] .addEventListener（的MouseEvent.MOUSE_OVER，addPattern）;
}
pattern.push（dots.indexOf（e.target）+1）; //添加剪辑加一的数组索引号，因为数组是从0开始
}
私有函数addPattern（E：MouseEvent）方法：无效
{
pattern.push（dots.indexOf（e.target）+1）; //加上鼠标模式在
}
私有函数stopPattern（E：MouseEvent）方法：无效//停止储存在鼠标向上的格局
{
VAR dotsLength：INT = dots.length;
对于（VAR我：= 0; I＆LT; dotsLength;我++）
{
点[I] .removeEventListener（的MouseEvent.MOUSE_OVER，addPattern）;
}
checkPattern（）;
}
私有函数checkPattern（）：无效//比较模式
{
VAR pLength：INT = pass.length;
VAR正确：= 0;
对于（VAR我：= 0; I＆LT; pLength;我++）//比较用户阵列中输入到通数组中的每个号码
{
如果（通过[I] ==模式[I]）
{
正确++;
}
}
如果（正确的== pLength）//如果数组比赛
{
//隐藏登录
影片剪辑（根）.LockScreen.visible = FALSE;
影片剪辑（根）.RTID.visible = FALSE;
影片剪辑（根）.SignIn.visible = FALSE;
//打开主菜单上
影片剪辑（根）.gamemenu_mc.visible = TRUE;
影片剪辑（根）.biggamesmenu_mc.visible = TRUE;
影片剪辑（根）.totaltextmenu_mc.visible = TRUE;
影片剪辑（根）.tmenu_mc.visible = TRUE;
影片剪辑（根）.smenu_mc.visible = TRUE;
影片剪辑（根）.optionsmenu_mc.visible = TRUE;
}
图案= []; //清除用户阵列
}
}
}
解决方案
最简单的我能想到做到这一点的方法是：
-
您点的影片剪辑中，把
停止（）动作在第一帧 -
创建动画的点时间轴上与动画的最后一帧上把另一个
停止（）。 -
在鼠标移到功能，告诉点播放。
私有函数addPattern（E：MouseEvent）方法：无效 { VAR点：影片剪辑=影片剪辑（e.currentTarget）; 如果（dot.currentFrame 2）dot.play（）;仅在第一帧//播放 pattern.push（dots.indexOf（点）+ 1）; //加上鼠标模式在 } -
复位点动画
私有函数stopPattern（E：MouseEvent）方法：无效//停止储存在鼠标向上的格局 { 对于（VAR我：= 0; I＆LT; dots.length;我++） { 点[I] .removeEventListener（的MouseEvent.MOUSE_OVER，addPattern）; 点[I] .gotoAndStop（1）; //返回到第一帧 } checkPattern（）; }
另外，如果你只是想简单的东西像一层的点淡入/输出，或点的大小增加，你可以只使用一个补间图书馆和吐温在鼠标悬停在相应的属性。
如果你想画线连接点，你可以这样做：
包
{
进口flash.display.Sprite;
进口flash.events.MouseEvent;
进口fl.transitions.Tween;
进口fl.transitions.easing.Strong;
进口flash.display.Shape;
公共类主要扩展Sprite
{
私人VAR lineContainer：形状=新形状（）;
私人VAR点：数组= []; //存储的舞台影片剪辑
私人VAR模式：数组= []; //由用户//输入的图案不使生活硬，只是存储索引的对象本身，而不是
私人VAR通：阵列;
公共函数main（）：无效
{
点= [一，二，三，四，五，六，七，八，九]; //在舞台中添加剪辑
通过= [一，四，七，八，五，二，五] //正确的方式进行
addChildAt（lineContainer，this.getChildIndex（1））; //该行容器后面的第一个点。
addListeners（）;
}
私有函数addListeners（）：无效//添加了听众每个点
{
VAR dotsLength：INT = dots.length;
对于（VAR我：= 0; I＆LT; dotsLength;我++）
{
点[I] .addEventListener（的MouseEvent.MOUSE_DOWN，initiatePattern）;
点[I] .addEventListener（侦听MouseEvent.MOUSE_UP，stopPattern）; //您可以附加为`的this`而不是每个点，同样的结果
}
}
/ *添加一个鼠标监听器，并用它来点的号码添加到图案* /
私有函数initiatePattern（E：MouseEvent）方法：无效
{
图案= []; //复位阵列
lineContainer.graphics.clear（）; //线条清晰
对于（VAR我：= 0; I＆LT; dots.length;我++）
{
点[I] .addEventListener（的MouseEvent.MOUSE_OVER，addPattern）;
}
addPattern（E）; //触发鼠标移到该元素
}
私有函数addPattern（E：MouseEvent）方法：无效
{
//如果（pattern.indexOf（e.currentTarget）== -1）{//包裹在这一点，如果statemnt如果只想要一个点被选择一次（如安卓）
pattern.push（e.currentTarget）; //加上鼠标模式在
drawLines（）;
VAR点：影片剪辑=影片剪辑（e.currentTarget）;
如果（dot.currentFrame 2）dot.play（）;仅在第一帧//播放
//}
}
私有函数drawLines（）：无效{
lineContainer.graphics.clear（）; //清除当前行
lineContainer.graphics.lineStyle（5，为0xFF0000）; //厚度（5像素）和行的颜色（红色）
如果（pattern.length→1）{//不如果没有在所述图案的至少两个点绘制
lineContainer.graphics.moveTo（模式[0] .X +模式[0] .WIDTH * 3.5，模式[0] .Y +模式[0] .height * .5）; //移动到第一
对于（VAR我：INT = 1; I＆LT; pattern.length;我++）{
lineContainer.graphics.lineTo（图案[我] .X +模式[I] .WIDTH * 5，图案[我] .Y +模式[I] .height * .5）; //画一条线，以当前点
}
}
lineContainer.graphics.endFill（）;
}
私有函数stopPattern（E：MouseEvent）方法：无效//停止储存在鼠标向上的格局
{
对于（VAR我：= 0; I＆LT; dots.length;我++）
{
点[I] .removeEventListener（的MouseEvent.MOUSE_OVER，addPattern）;
点[I] .gotoAndStop（1）; //返回到第一帧
}
checkPattern（）;
}
私有函数checkPattern（）：无效//比较模式
{
VAR pLength：INT = pass.length;
VAR正确：= 0;
对于（VAR我：= 0; I＆LT; pLength;我++）//比较用户阵列中输入到通数组中的每个号码
{
如果（通过[I] ==模式[I]）
{
正确++;
}
}
如果（正确的== pLength）//如果数组比赛
{
//隐藏登录
影片剪辑（根）.LockScreen.visible = FALSE;
影片剪辑（根）.RTID.visible = FALSE;
影片剪辑（根）.SignIn.visible = FALSE;
//打开主菜单上
影片剪辑（根）.gamemenu_mc.visible = TRUE;
影片剪辑（根）.biggamesmenu_mc.visible = TRUE;
影片剪辑（根）.totaltextmenu_mc.visible = TRUE;
影片剪辑（根）.tmenu_mc.visible = TRUE;
影片剪辑（根）.smenu_mc.visible = TRUE;
影片剪辑（根）.optionsmenu_mc.visible = TRUE;
}
图案= []; //清除用户阵列
lineContainer.graphics.clear（）; //清除行
}
}
}
So the other day I found a tutorial on how to create a pattern lock screen in action script. To do so I had to create a class, I have a good grasp on how the class is working. But I want to add an animation so when the user goes over the dots in the pattern and animation plays. But I have no idea how to do something like this through the class. Here is the code I used in my class.
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Strong;
public class Main extends Sprite
{
private var dots:Array = []; // Stores the in stage movieclips
private var pattern:Array = []; //The pattern entered by the user
private var pass:Array = [1,4,7,8,5,2,5]; //The correct pattern to proceed
public function Main():void
{
dots = [one,two,three,four,five,six,seven,eight,nine]; //add the clips in stage
addListeners();
}
private function addListeners():void //adds the listeners to each dot
{
var dotsLength:int = dots.length;
for (var i:int = 0; i < dotsLength; i++)
{
dots[i].addEventListener(MouseEvent.MOUSE_DOWN, initiatePattern);
dots[i].addEventListener(MouseEvent.MOUSE_UP, stopPattern);
}
}
/* Adds a mouse over listener and uses it to add the number of the dot to the pattern */
private function initiatePattern(e:MouseEvent):void
{
var dotsLength:int = dots.length;
for (var i:int = 0; i < dotsLength; i++)
{
dots[i].addEventListener(MouseEvent.MOUSE_OVER, addPattern);
}
pattern.push(dots.indexOf(e.target) + 1); //adds the array index number of the clip plus one, because arrays are 0 based
}
private function addPattern(e:MouseEvent):void
{
pattern.push(dots.indexOf(e.target) + 1); //adds the pattern on mouse over
}
private function stopPattern(e:MouseEvent):void //stops storing the pattern on mouse up
{
var dotsLength:int = dots.length;
for (var i:int = 0; i < dotsLength; i++)
{
dots[i].removeEventListener(MouseEvent.MOUSE_OVER, addPattern);
}
checkPattern();
}
private function checkPattern():void //compares the patterns
{
var pLength:int = pass.length;
var correct:int = 0;
for (var i:int = 0; i < pLength; i++) //compares each number entered in the user array to the pass array
{
if (pass[i] == pattern[i])
{
correct++;
}
}
if (correct == pLength) //if the arrays match
{
//Hides Sign In
MovieClip(root).LockScreen.visible = false;
MovieClip(root).RTID.visible = false;
MovieClip(root).SignIn.visible = false;
//Turns On Main Menu
MovieClip(root).gamemenu_mc.visible = true;
MovieClip(root).biggamesmenu_mc.visible = true;
MovieClip(root).totaltextmenu_mc.visible = true;
MovieClip(root).tmenu_mc.visible = true;
MovieClip(root).smenu_mc.visible = true;
MovieClip(root).optionsmenu_mc.visible = true;
}
pattern = []; //clears the user array
}
}
}
解决方案
Easiest way I can think to do this is:
inside your dot movie clip, put a
stop()action on the first framecreate your animation on the dot timeline and on the last frame of the animation put another
stop().In your mouse over function, tell the dot to play.
private function addPattern(e:MouseEvent):void { var dot:MovieClip = MovieClip(e.currentTarget); if(dot.currentFrame < 2) dot.play(); //play only if on the first frame pattern.push(dots.indexOf(dot) + 1); //adds the pattern on mouse over }Reset the dots animation
private function stopPattern(e:MouseEvent):void //stops storing the pattern on mouse up { for (var i:int = 0; i < dots.length; i++) { dots[i].removeEventListener(MouseEvent.MOUSE_OVER, addPattern); dots[i].gotoAndStop(1); //go back to the first frame } checkPattern(); }
Alternatively, if you're just want something simple like a layer of the dot fading in/out or the size of the dot increasing, you could just use a tweening library and tween the appropriate property on mouse over.
If you wanted to draw lines to connect the dots, you could do this:
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Strong;
import flash.display.Shape;
public class Main extends Sprite
{
private var lineContainer:Shape = new Shape();
private var dots:Array = []; // Stores the in stage movieclips
private var pattern:Array = []; //The pattern entered by the user //don't make life hard, just store the object itself instead of the index
private var pass:Array;
public function Main():void
{
dots = [one,two,three,four,five,six,seven,eight,nine]; //add the clips in stage
pass = [one,four,seven,eight,five,two,five]; //The correct pattern to proceed
addChildAt(lineContainer, this.getChildIndex(one)); //the line container right behind the first dot.
addListeners();
}
private function addListeners():void //adds the listeners to each dot
{
var dotsLength:int = dots.length;
for (var i:int = 0; i < dotsLength; i++)
{
dots[i].addEventListener(MouseEvent.MOUSE_DOWN, initiatePattern);
dots[i].addEventListener(MouseEvent.MOUSE_UP, stopPattern); //you could attach this to `this` instead of each dot, same result
}
}
/* Adds a mouse over listener and uses it to add the number of the dot to the pattern */
private function initiatePattern(e:MouseEvent):void
{
pattern = []; //reset array
lineContainer.graphics.clear(); //clear lines
for (var i:int = 0; i < dots.length; i++)
{
dots[i].addEventListener(MouseEvent.MOUSE_OVER, addPattern);
}
addPattern(e); //trigger the mouse over for this element
}
private function addPattern(e:MouseEvent):void
{
//if (pattern.indexOf(e.currentTarget) == -1) { //wrap in this if statemnt if only wanted a dot to be selected once (like Android)
pattern.push(e.currentTarget); //adds the pattern on mouse over
drawLines();
var dot:MovieClip = MovieClip(e.currentTarget);
if(dot.currentFrame < 2) dot.play(); //play only if on the first frame
//}
}
private function drawLines():void {
lineContainer.graphics.clear(); //clear the current lines
lineContainer.graphics.lineStyle(5, 0xFF0000); //thickness (5px) and color (red) of the lines
if (pattern.length > 1) { //don't draw if there aren't at least two dots in the pattern
lineContainer.graphics.moveTo(pattern[0].x + pattern[0].width * .5, pattern[0].y + pattern[0].height * .5); //move to first
for (var i:int = 1; i < pattern.length; i++) {
lineContainer.graphics.lineTo(pattern[i].x + pattern[i].width * .5, pattern[i].y + pattern[i].height * .5); //draw a line to the current dot
}
}
lineContainer.graphics.endFill();
}
private function stopPattern(e:MouseEvent):void //stops storing the pattern on mouse up
{
for (var i:int = 0; i < dots.length; i++)
{
dots[i].removeEventListener(MouseEvent.MOUSE_OVER, addPattern);
dots[i].gotoAndStop(1); //go back to the first frame
}
checkPattern();
}
private function checkPattern():void //compares the patterns
{
var pLength:int = pass.length;
var correct:int = 0;
for (var i:int = 0; i < pLength; i++) //compares each number entered in the user array to the pass array
{
if (pass[i] == pattern[i])
{
correct++;
}
}
if (correct == pLength) //if the arrays match
{
//Hides Sign In
MovieClip(root).LockScreen.visible = false;
MovieClip(root).RTID.visible = false;
MovieClip(root).SignIn.visible = false;
//Turns On Main Menu
MovieClip(root).gamemenu_mc.visible = true;
MovieClip(root).biggamesmenu_mc.visible = true;
MovieClip(root).totaltextmenu_mc.visible = true;
MovieClip(root).tmenu_mc.visible = true;
MovieClip(root).smenu_mc.visible = true;
MovieClip(root).optionsmenu_mc.visible = true;
}
pattern = []; //clears the user array
lineContainer.graphics.clear(); //clear the lines
}
}
}
这篇关于动作脚本3：添加gotoAndStop动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
