Låsskärmen är en del av ett operativsystem, som oftast används i mobila enheter, som förhindrar oavsiktlig inmatning. Den här snabba tipsen visar hur du simulerar en Android Lock-skärm med ActionScript. Nu går vi!
Låt oss ta en titt på det slutliga resultatet vi ska arbeta för:
Det här är en väldigt enkel version av Android-skärmen. Dra musen längs prickarna i den väg som anges av de halvt transparenta vita linjerna för att "låsa upp" SWF: n. Naturligtvis finns de vita linjerna bara för demonstration!
Vi använder mushändelser och arrays för att lagra och jämföra användarinmatning och rätt mönster. En ny skärm visas när rätt mönster har angetts.
Starta Flash och skapa ett nytt Flash-dokument, sätt scenstorleken till 320x480px och bildhastigheten till 24fps.
Detta är gränssnittet vi ska använda, de vita prickarna i bilden heter MovieClips från vänster till höger ett två tre… och så vidare. Semi-transparenta vita linjer används för att ange rätt lösenord (du kanske vill ta bort det här för verklig användning).
Skapa en ny ActionScript-klass (Cmd + N), spara filen som Main.as och skriv följande rader, läs kommentarerna i koden för att förstå klassens beteende.
Ändra värdena i passera
array för att ändra upplåsningsmönstret.
paket import flash.display.Sprite; importera flash.events.MouseEvent; import fl.transitions.Tween; importera fl.transitions.easing.Strong; public class Main utökar Sprite private var dots: Array = []; // Lagrar filmklipp privatfilm i scenfilm: Array = []; // Mönstret inmatat av användaren privat var passera: Array = [1,2,3,6,9,8,5]; // Det korrekta mönstret för att fortsätta den offentliga funktionen Main (): void dots = [en, två, tre, fyra, fem, sex, sju, åtta, nio]; // lägg till klippen i steg addListeners (); privat funktion addListeners (): void // lägger till lyssnare till varje punkt var dotsLength: int = dots.length; för (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 var sView:SecondView = new SecondView(); //add a new view addChild(sView); var tween:Tween = new Tween(sView,"x",Strong.easeOut,320,0,0.8,true); pattern = []; //clears the user array
Kom ihåg att lägga till klassnamnet till Klass fält i Publicera del av Egenskaper panel.
Du har skapat en användbar låsskärm för dina applikationer eller till och med en webbplats. Du kan anpassa projektet för att möta dina behov eller använda den här tekniken för att bygga din anpassade LockScreen. Vad sägs om att använda ett grafiskt objekt för en Sprite för att rita linjer som följer musens väg?
Jag hoppas att du gillade den här handledningen, tack för att du läste!
Redaktörens anmärkning: Kan inte få nog av Android? Kolla in det senaste Envato ™ webbplats: Android.AppStorm.net!