La schermata di blocco fa parte di un sistema operativo, principalmente utilizzato nei dispositivi mobili, che impedisce l'input accidentale. Questo suggerimento rapido ti mostrerà come simulare un blocco schermo Android con ActionScript. Muoviamoci!
Diamo un'occhiata al risultato finale su cui lavoreremo:
Questa è una versione molto semplice della schermata di blocco del modello Android. Trascina il mouse lungo i punti nel percorso indicato dalle linee bianche semitrasparenti per "sbloccare" il file SWF. Naturalmente, le linee bianche sono solo lì a scopo dimostrativo!
Faremo uso di Mouse Events e Arrays per archiviare e confrontare l'input dell'utente e il pattern corretto. Verrà visualizzata una nuova schermata quando viene immesso il modello corretto.
Avvia Flash e crea un nuovo documento Flash, imposta le dimensioni dello stage su 320x480px e la frequenza fotogrammi su 24 fps.
Questa è l'interfaccia che useremo, i punti bianchi nell'immagine sono MovieClip nominati da sinistra a destra uno due tre… e così via. Le linee bianche semitrasparenti sono utilizzate per indicare la password corretta (è possibile rimuoverla per un uso reale).
Creare una nuova classe ActionScript (Cmd + N), salvare il file come Main.as e scrivi le seguenti righe, leggi i commenti nel codice per comprendere appieno il comportamento della classe.
Cambia i valori nel passaggio
matrice per cambiare il modello di sblocco.
pacchetto import flash.display.Sprite; import flash.events.MouseEvent; importare fl.transitions.Tween; importare fl.transitions.easing.Strong; public class Main estende Sprite private var dots: Array = []; // Memorizza il pattern var privato in movieclips: Array = []; // Il modello immesso dall'utente var var privato: Array = [1,2,3,6,9,8,5]; // Il modello corretto per procedere alla funzione pubblica Main (): void dots = [uno, due, tre, quattro, cinque, sei, sette, otto, nove]; // aggiungi le clip nello stage addListeners (); private function addListeners (): void // aggiunge gli ascoltatori a ogni punto var dotsLength: int = dots.length; per (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
Ricorda di aggiungere il nome della classe al Classe campo nel Pubblicare sezione del Proprietà pannello.
Hai creato un utile blocco schermo per le tue applicazioni o anche per un sito web. Puoi adattare il progetto alle tue esigenze o utilizzare questa tecnica per costruire il tuo LockScreen personalizzato. Che ne dici di utilizzare l'oggetto grafico di uno Sprite per disegnare linee che seguono il percorso del tuo mouse?
Spero che questo tutorial ti sia piaciuto, grazie per la lettura!
Nota dell'editore: Non ne hai mai abbastanza di Android? Guarda le ultime Envato ™ sito: Android.AppStorm.net!