Share
I denne Quick Tip, vil jeg vise deg hvordan du lager en slettings effekt inspirert av iPhone IOS-grensesnittet.
La oss se på det endelige resultatet vi vil jobbe for:
Trykk og hold "a" -ikonet, og klikk deretter på "x" når det vises ...
På et pre-laget iPhone-grensesnitt vil vi gjøre bruk av Timer, Tween og Mouse Events for å skape en fin utseende for grensesnitt.
Start Flash og opprett et nytt Flash-dokument, sett scenestørrelsen til 255x496px og bildesatsen til 24fps.
Dette er grensesnittet vi skal bruke, det inkluderer en iPhone 4-mal og noen GUI-elementer som du kan laste ned fra den respektive forfatterens nettsted.
Det er også et ikon som er et interaktivt element.
Dette er klassen som gjør alt arbeidet. Det viser bare den faktiske arbeidskoden, vennligst les kommentarene for å forstå hva som skjer ...
privat varetimer: Timer = ny Timer (1000); // Tiden for å holde museknappen nede på ikonet for å vise sletteknappen privat var tiltTimer: Timer = Ny Timer (80); // Tidspunktet for rotasjonsendringen, gjør shake-effekten privat var rotationValue: int = 2; // Den rotasjonen som er ønsket for shake private var mellom: Tween; // En tween-forekomst for å animere alarmenes dialogfunksjon Hovedfunksjon Main (): void / * Skjul elementer * / hideObjects (appIcon.deleteButton, deleteAlert, darkScreen); / * Legg til nødvendige lyttere * / deleteAlert.cancelBtn.addEventListener (MouseEvent.MOUSE_UP, avbryt); deleteAlert.deleteBtn.addEventListener (MouseEvent.MOUSE_UP, deleteApp); appIcon.deleteButton.addEventListener (MouseEvent.MOUSE_UP, displayAlert); appIcon.addEventListener (MouseEvent.MOUSE_UP, stopTimer); appIcon.addEventListener (MouseEvent.MOUSE_DOWN, pressAndHold); / * Skjul objekter funksjon * / privat funksjon hideObjects (... objekter): void for (var i: int = 0; i < objects.length; i++) objects[i].visible = false; /*Starts the timer when the mouse is down*/ private function pressAndHold(e:MouseEvent):void timer.start(); timer.addEventListener(TimerEvent.TIMER, showDeleteButton); /*If mouse up, timer stops*/ private function stopTimer(e:MouseEvent):void timer.stop(); /*if the hold timer completes, the delete button is shown and the icon shakes*/ private function showDeleteButton(e:TimerEvent):void timer.stop(); appIcon.deleteButton.visible = true; tiltTimer.addEventListener(TimerEvent.TIMER, tilt); tiltTimer.start(); /*The shake function, changes the rotation every time the tiltTimer completes*/ private function tilt(e:TimerEvent):void appIcon.rotation = rotationValue; rotationValue *= -1; /*if the delete button is pressed the alert is shown*/ private function displayAlert(e:MouseEvent):void deleteAlert.visible = true; darkScreen.visible = true; tween = new Tween(deleteAlert,"scaleX",Back.easeOut,0.3,1,0.5,true); tween = new Tween(deleteAlert,"scaleY",Back.easeOut,0.3,1,0.5,true); /*removes the icon if the delete button in the alert is clicked*/ private function deleteApp(e:MouseEvent):void hideObjects(appIcon, deleteAlert, darkScreen); /* removes the alert, stops the tilt and doesn't remove the icon, called by the cancel button*/ private function cancel(e:MouseEvent):void hideObjects(appIcon.deleteButton, deleteAlert, darkScreen); tiltTimer.stop(); appIcon.rotation = 0;
Husk å legge til klassenavnet i feltet Klasse i Publiser-delen av Egenskaper-panelet.
Så der har du det! En fin effekt som du kan legge til i dine applikasjoner, eksperimentere med bruken!
Jeg håper du likte denne opplæringen, takk for at du leste :)
Accentsconagua