于是有一天,我发现了如何在动作脚本图案锁屏的教程。要做到这一点,我不得不创建一个类,我有一个很好的把握就如何类工作。但我想添加动画,所以当用户进入过的图案和动画播放的点。但我不知道怎么做这样的事情通过类。这里是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< dotsLength;我++)
{
点[I] .addEventListener(的MouseEvent.MOUSE_DOWN,initiatePattern);
点[I] .addEventListener(侦听MouseEvent.MOUSE_UP,stopPattern);
}
}
/ *添加一个鼠标监听器,并用它来点的号码添加到图案* /
私有函数initiatePattern(E:MouseEvent)方法:无效
{
VAR dotsLength:INT = dots.length;
对于(VAR我:= 0; I< 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< dotsLength;我++)
{
点[I] .removeEventListener(的MouseEvent.MOUSE_OVER,addPattern);
}
checkPattern();
}
私有函数checkPattern():无效//比较模式
{
VAR pLength:INT = pass.length;
VAR正确:= 0;
对于(VAR我:= 0; I< 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< 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< dotsLength;我++)
{
点[I] .addEventListener(的MouseEvent.MOUSE_DOWN,initiatePattern);
点[I] .addEventListener(侦听MouseEvent.MOUSE_UP,stopPattern); //您可以附加为`的this`而不是每个点,同样的结果
}
}
/ *添加一个鼠标监听器,并用它来点的号码添加到图案* /
私有函数initiatePattern(E:MouseEvent)方法:无效
{
图案= []; //复位阵列
lineContainer.graphics.clear(); //线条清晰
对于(VAR我:= 0; I< 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< pattern.length;我++){
lineContainer.graphics.lineTo(图案[我] .X +模式[I] .WIDTH * 5,图案[我] .Y +模式[I] .height * .5); //画一条线,以当前点
}
}
lineContainer.graphics.endFill();
}
私有函数stopPattern(E:MouseEvent)方法:无效//停止储存在鼠标向上的格局
{
对于(VAR我:= 0; I< dots.length;我++)
{
点[I] .removeEventListener(的MouseEvent.MOUSE_OVER,addPattern);
点[I] .gotoAndStop(1); //返回到第一帧
}
checkPattern();
}
私有函数checkPattern():无效//比较模式
{
VAR pLength:INT = pass.length;
VAR正确:= 0;
对于(VAR我:= 0; I< 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 frame
create 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
}
}
}
相关推荐
最新文章