Dans cette astuce, je vais vous montrer comment utiliser le tout nouveau panneau d'extraits de code Flash CS5 pour ajouter facilement une interaction clavier-souris à vos projets, sans avoir nécessairement besoin d'apprendre l'AS3. Nous allons jeter un coup d'oeil!
Voici le résultat final que nous allons atteindre. À l'aide du panneau d'extraits de code, nous utilisons Click Movie Clip comme bouton pour lancer l'animation. De plus, avec les flèches du clavier, vous pouvez déplacer le logo "active.tutsplus.com". Si vous cliquez dessus, vous accédez au site. Ces fonctions sont exécutées à l’aide du panneau Extraits de code..
Téléchargez le fichier zip source en utilisant le lien ci-dessus et extrayez-le quelque part.
Ouvrez Adobe Flash Professional, puis cliquez sur Fichier> Ouvrir..
Sélectionnez le fichier source téléchargé "Quick_Tip_Code_Snippets.fla".
Ici à notre disposition est une bannière Flash. Afin de lui donner certaines fonctionnalités, nous allons utiliser le nouveau Panneau d'extraits de code de Flash CS5. Commençons par "Cliquez" Movie Clip. Choisissez le calque "Cliquez" puis le clip avec l'outil de sélection (raccourci V). Dans la fenêtre Propriétés, donnez-lui le nom de l'instance "Click".
Ouvrez maintenant votre panneau d’extraits de code (si vous ne le voyez pas, sélectionnez Fenêtre> Extraits de code). Sélectionnez une catégorie Navigation dans la timeline> Cliquez pour aller à Image et lecture. Double-cliquez dessus.
P.S. N'oubliez pas qu'avant d'ouvrir le panneau d'extraits de code, le clip "Cliquez" doit être sélectionné..
Après cela, le panneau Action s’ouvrira et vous verrez du code avec des instructions. Suivons les instructions et modifions le nombre 5 entre crochets en numéro 2. Cela entraînera la lecture de notre animation à partir de l'image 2 si nous cliquons sur notre clip "Cliquez sur"..
J'ai ajouté des animations à la timeline à partir de l'image 2 et vous les verrez jouer une fois le bouton cliqué..
La prochaine chose que nous devrions faire est de donner quelques fonctions à notre clip ActiveTuts. Sélectionnez-le sur la scène et donnez-lui le nom d'instance "ActiveTuts".
Lorsque le clip "ActiveTuts" est sélectionné, sélectionnez Panneau de fragments de code> Animation> Déplacer avec les flèches du clavier. Nous ne changerons pas les paramètres par défaut du code car ils servent bien. Cette fonction nous permettra de déplacer notre clip ActiveTuts avec les flèches du clavier..
De plus, faisons en sorte que notre clip ActiveTuts se comporte comme un lien. Encore une fois sélectionné, sélectionnez Panneau de fragments de code> Actions> Cliquez pour aller à la page Web..
Vous devriez avoir le code suivant dans votre panneau Actions:
Notre panneau Actions s'ouvrira et nous verrons quelques instructions sur la façon de modifier l'URL dont nous avons besoin. Dans mon cas, je le changerai en "http://active.tutsplus.com".
La dernière chose dont nous avons besoin est d’écrire un Arrêtez()
fonction à la fin du code sur l'image 1. Après cela, vous pouvez prévisualiser ce que nous avons réalisé.
Vous savez maintenant comment utiliser le nouveau panneau d'extraits de code! C'est utile à la fois pour les personnes qui connaissent AS3 (permet d'économiser du temps) et pour celles qui commencent à s'y plonger. Cela donne l’occasion d’ajouter des actions aux objets sans écrire une seule ligne de code!
J'espère que vous avez aimé ce petit conseil et qu'il vous aidera. Merci d'avoir lu!
Éditeur: Une dernière chose - n'oubliez pas que vous pouvez stocker et partager tous vos extraits de code sur snipplr.com, le dernier-né du réseau Envato!