Tutoriel: Créer l'eau effet de réflexion avec animation
Ecrire un commentaire Novembre 18th, 2008
Résumé
Dans ce tutoriel, vous apprendrez comment créer une réflexion de l'eau à appliquer sur un MovieClip en mouvement.
Voici le résultat final:
Exigences
Flash 8, Flash CS3 ou Flash CS4.
Note: Les captures d'écran dans ce tutoriel sont faites dans Flash CS3. Il fonctionne exactement de la même dans Flash 8. Ce tutoriel est ActionScript 2 (Bien qu'aucune ActionScript est nécessaire).
élément Étape 1 - Installer l'effet
Télécharger la réflexion Effet de l'eau ici . S'il vous plaît suivez les instructions d'installation et faites glisser le composant du panneau composant dans la bibliothèque de votre fichier. fla.
Étape 2 - Créer un canard MovieClip
Importer le canard image appuyez sur [Ctrl-R] ou "Fichier" -> "Importer" -> "Importer sur la scène ...». Assurez-vous que l'image est un canard. PNG avec fond transparent.
Sélectionnez cette image et la convertir en une] [MovieClip appuyez sur F8 ou cliquez droit sur le MovieClip -> "Convertir en symbole ...». Donner le MovieClip le nom de «canard».
Étape 3 - Créer MovieClip Animation
Créez un nouveau MovieClip appuyez sur [Ctrl-F8] ou «Insertion ->" Nouveau symbole ... ». Nommez ce MovieClip "animation".
Faites glisser le MovieClip de canard à partir de votre bibliothèque à la première image sur la timeline. Maintenant, cliquez sur l'image 60 et créez une nouvelle image-clé appuyez sur [F6] ou clic droit et "Insert Keyframe".
Cliquez sur l'image-clé nouvellement créé et sélectionnez le MovieClip de canard sur la toile. Maintenant, déplacez ce MovieClip avec la touche curseur vers la droite (disons 100px). Vous pouvez vérifier la nouvelle position dans le panneau d'information.
Retour à la première image clé de la chronologie. Sur le panneau de propriété Select Tween: "Motion". Si vous cliquez quelque part dans le calendrier maintenant, vous voyez que le MovieClip de canard se déplace de gauche à droite.
Étape 4 - Mettre MovieClip animation sur le scénario principal
Maintenant, cliquez sur "Scène 1" pour revenir au scénario principal. Si le MovieClip canard est toujours là, le retirer.
Déplacez le MovieClip l'animation de votre bibliothèque à la première image de la timeline.
Définissez le nom de l'instance MovieClip pour "animation_mc" (vous pouvez choisir un nom différent si vous voulez. Assurez-vous que le nom d'instance est unique). Sans un nom d'instance, l'élément n'est pas en mesure de détecter les MovieClip.
Étape 5 - Appliquer un effet composante
Créez un nouveau calque, sélectionnez la première image et faites glisser le composant effet de votre bibliothèque sur le MovieClip animation. Le composant logiciel enfichable automatiquement.
Définissez le paramètre de la composante à l'intérieur du panneau Inspecteur de composants comme la capture d'écran. MovieClips Tous les noms par exemple dans ce cadre sont énumérées dans la "cible MovieClip" liste de sélection. Puisque vous avez un seul MovieClip, la composante suppose, que vous souhaitez appliquer l'effet sur le MovieClip "animation_mc".
Note: Ces paramètres ne sont appliquées à cette instance un des composants d'effet. Si vous dessinez le composant sur un autre MovieClip (ailleurs dans le fla. Ou dans un nouveau projet), vous devez définir les paramètres à nouveau.
Maintenant à l'exportation (appuyez sur [Ctrl-ENTRER] ou ...). Vous verrez que la tête du canard est en quelque sorte coupé. Thats parce que le composant a exactement la taille de la MovieClip canard. Mais depuis la vague de réflexion sera d'augmenter la taille ne correspond pas à la présente plus.
Étape 6 - Régler animation MovieClip
Pour résoudre ce problème, vous insérez une forme invisible en arrière-plan du canard, MovieClip dont la taille le MovieClip un peu.
Retournez à la MovieClip de canard en double-cliquant dessus dans votre bibliothèque.
Créez un nouveau calque en dessous de la couche d'interpolation.
Sélectionnez l'outil Rectangle et dessinez une forme à la largeur du canard. La hauteur doit être un peu plus haut pixel puis le canard (environ 10 pixel). Il pourrait aider à définir l'icône aperçu dans la chronologie, à ne voir que les dimensions de l'image de canard.
Avec la forme sélectionnée ouvrir le panneau de la couleur et mettre l'alpha à 0.
Lorsque vous testez votre film maintenant, vous verrez que la réflexion est appliqué sur le canard trou.
Étape 6 - Ajouter une image de fond
Créez un nouveau calque sous le calque d'animation et de composants. Importer une image correspondant. Maintenant vous pouvez changer la position du MovieClip animation pour le faire rentrer dans le milieu environnant.
Télécharger
Cliquez ici pour télécharger le fla de ce tutoriel. Note: L'. Fla comprend la version d'essai de la composante effet, ce qui ne fonctionne que dans l'IDE de Flash (Flash 8, Flash CS3 ou Flash CS4), mais pas dans le navigateur.
Vous pouvez également télécharger la réflexion Effet de l'eau ici .






















Ecrire un commentaire