Astuce Supprimer un objet, style d'application iPhone

Dans cette astuce, je vais vous montrer comment créer un effet de suppression inspiré de l'interface iPhone iOS..


Aperçu du résultat final

Jetons un coup d'œil au résultat final sur lequel nous allons travailler:

Appuyez et maintenez le "a" icône, puis cliquez sur le "x" quand il apparaît ...


Étape 1: bref aperçu

Sur une interface iPhone prédéfinie, nous utiliserons les événements Timer, Tween et Mouse pour créer un effet esthétique pour les interfaces..


Étape 2: Configurez votre fichier Flash

Lancez Flash et créez un nouveau document Flash, réglez la taille de la scène sur 255x496px et la cadence sur 24 images par seconde..


Étape 3: interface

Voici l'interface que nous allons utiliser. Elle comprend un modèle pour iPhone 4 et certains éléments de l'interface graphique que vous pouvez télécharger depuis le site de l'auteur.

Il y a aussi une icône qui est un élément interactif.


Étape 4: ActionScript

C'est la classe qui fait tout le travail. Il ne montre que le code de travail réel, veuillez lire les commentaires pour bien comprendre ce qui se passe…

 var timer privé: Timer = new Timer (1000); // Le temps nécessaire pour maintenir le bouton de la souris enfoncé sur l'icône afin d'afficher le bouton de suppression private var tilt tilt: Minuteur = new Minuteur (80); // L'heure du changement de rotation rend l'effet de secousse private var rotationValue: int = 2; // Rotation souhaitée pour le shake private var tween: Tween; // Une instance d'interpolation pour animer le dialogue d'alerte, fonction publique Main (): void / * Masquer les éléments * / hideObjects (appIcon.deleteButton, deleteAlert, darkScreen); / * Ajouter les écouteurs nécessaires * / deleteAlert.cancelBtn.addEventListener (MouseEvent.MOUSE_UP, cancel); 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);  / * Fonction de masquage d'objets * / fonction privée hideObjects (… objets): void pour (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; 

Étape 5: Classe de document

N'oubliez pas d'ajouter le nom de la classe au champ Classe de la section Publier du panneau Propriétés..


Conclusion

Donc là vous l'avez! Un bel effet que vous pouvez ajouter à vos applications, expérimentez ses utilisations!

J'espère que vous avez aimé ce tutoriel, merci d'avoir lu :)