Dans cette série, nous nous concentrons sur les outils d'animation 2D basés sur l'os fournis par le moteur Unity. L'idée principale est de présenter et d'enseigner les bases de l'animation 2D afin de pouvoir l'appliquer à vos propres jeux. Dans ce tutoriel, nous utiliserons l'excellent outil Mecanim d'Unity pour mélanger des animations et ajouterons quelques scripts simples pour illustrer le résultat final..
Avant de commencer le tutoriel, nous voudrions remercier Chenguang (DragonBonesTeam) pour nous avoir fourni l’art du jeu utilisé pour produire cette série de tutoriels..
Dans les tutoriels précédents, nous avons configuré le projet, assemblé un personnage de dragon 2D et créé trois animations différentes. Si vous n'avez pas encore terminé les tutoriels précédents, nous vous recommandons fortement de le faire avant de continuer..
Cette démo montre le dragon animé que nous visons Espace pour le faire sauter:
À ce stade, votre dragon est complètement assemblé avec trois animations définies. Cependant, il n'y a pas de lien entre eux. Notre objectif initial est donc de connecter les différents clips d’animation et de les mélanger. Pour cela, Unity fournit un outil génial appelé Mecanim qui fait exactement ce dont vous avez besoin..
Mecanim est un système d’animation puissant et flexible. Depuis qu'il est intégré à Unity lui-même, aucun logiciel tiers n'est nécessaire. Vous pouvez facilement animer n'importe quoi, des images-objets au mélange de formes et même de lumières. Mecanim vous permet de créer des machines à états et de mélanger des arbres pour contrôler votre personnage..
Mais avant d'aller plus loin, parlons un peu de fusion des animations et des machines d'état afin que vous compreniez mieux ce que nous allons faire..
Dans Unity, vous pouvez mélanger deux mouvements similaires ou plus. Par exemple, vous pouvez fusionner les animations de course et de marche en fonction de la vitesse actuelle du personnage. En gros, vous avez deux façons différentes de mélanger des animations dans Unity. Dans certaines situations, vous voudrez peut-être utiliser Les transitions; dans d'autres, vous devrez utiliser Mélanger des arbres:
Une machine à états stocke l'état d'une entité à un moment donné et peut réagir à une entrée pour modifier l'état de cette entité ou provoquer une action ou une sortie. Pour plus d'informations, voir Machines à états finis: théorie et implémentation..
Dans Unity, vous utilisez des machines à états pour contrôler l'état des personnages du jeu. Par exemple, un état pour un personnage pourrait être Marche
, et un autre pourrait être Saut
. Le personnage peut changer de la Marche
état à la Saut
Etat basé sur les entrées du joueur (probablement en appuyant sur le bouton Jump).
Vous pouvez voir ici un exemple de machine à états (plus complexe) dans la documentation de Unity. Chaque case représente un état et les flèches représentent les transitions possibles entre eux:
Nous allons créer une machine à états avec nos animations existantes, puis utiliser des transitions pour les mélanger..
Si vous vérifiez le Animations dossier où vous avez sauvegardé votre .animer
fichiers, vous trouverez un Dragon.controller
fichier. Il s'agit du fichier mecanim associé au personnage généré automatiquement par Unity lors de l'enregistrement de votre première animation..
Double-cliquez sur le Dragon.controller
fichier et Unity ouvrira un Animateur Voir l'onglet à côté de votre Scène et Jeu onglets.
Comme vous pouvez le constater, Unity a déjà ajouté les trois animations au fichier. Les animations étant déjà en place, il n’est pas nécessaire de les ajouter, mais si vous souhaitez ajouter une animation supplémentaire au contrôleur, il vous suffit de faire glisser le curseur. .animer
déposer au Animateur vue. De la même manière, si vous souhaitez supprimer une animation existante du contrôleur, vous devez simplement sélectionner le Animateur voir et appuyer sur Effacer. N'hésitez pas à essayer cela par vous-même.
Nous avons quatre boîtes différentes dans le Animateur:
Tout état est l'état par défaut créé par mecanim et vous ne l'utiliserez pas. Vous pouvez le faire glisser à n’importe quel coin de la Animateur fenêtre et le laisser là.
Les trois autres cases font référence aux trois animations que nous avons créées. Comme vous pouvez le constater, Tourner au ralenti est de couleur orange, tandis que les deux autres sont gris. C'est parce que Tourner au ralenti est l'animation racine; c'est l'animation que le personnage va jouer par défaut. Si vous appuyez sur le bouton de lecture de votre éditeur et le testez, vous verrez que le personnage le fait Tourner au ralenti animation. Dans ce cas particulier, c'est exactement le comportement que nous souhaitons; cependant, si vous vouliez, disons, le Tomber animation pour être l'animation racine, tout ce que vous auriez à faire est de cliquer dessus avec le bouton droit de la souris Définir par défaut.
Comme vous pouvez le voir, le Tomber l'animation est maintenant orange et le Tourner au ralenti est gris.
Puisque tu veux Tourner au ralenti pour être l'animation racine, il suffit de répéter le processus pour le rendre à nouveau orange.
Il est maintenant temps de connecter les animations. Clic-droit Tourner au ralenti et sélectionnez Faire la transition.
Cela va créer une petite flèche qui commence à partir de Tourner au ralenti. Clique sur le Saut animation pour faire la flèche relier les deux animations.
Si vous sélectionnez la flèche que vous venez de créer, vous verrez que de nouvelles propriétés apparaissent dans Inspecteur languette.
Comme vous pouvez le voir, vous avez une chronologie et les animations Tourner au ralenti et Saut. Il y a un bandeau bleu sur les animations qui commence le Tourner au ralenti mais passe ensuite à Saut. De plus, il y a une période de temps pendant laquelle les deux animations se chevauchent.
Depuis le Aperçu la zone est vide, même si vous cliquez sur le bouton de lecture au-dessus de l'aperçu, vous ne pouvez pas voir ce qui se passe.
Pour prévisualiser la transition sur laquelle vous travaillez, il suffit de sélectionner le Dragon objet de jeu de la Hiérarchie onglet et faites-le glisser vers le Aperçu surface. Maintenant, vous pouvez voir le personnage dans l'aperçu et, si vous appuyez sur Play, vous pouvez voir la transition entre les deux animations..
dans le Inspecteur, la zone où la bande bleue change de Tourner au ralenti à Saut est notre transition:
Vous pouvez modifier les transitions en faisant glisser les deux flèches bleues sur la timeline limitant la zone de transition. En modifiant leur position, vous pouvez rendre la transition plus rapide ou plus douce.
La prochaine chose que vous devez faire est de définir quand vous voulez que cette transition se produise. Pour cela, créez un nouveau paramètre en cliquant sur le bouton + signer dans le Paramètres liste.
Ensuite, sélectionnez le Flotte option et appelez-le Mouvement vertical
:
Maintenant, retournez à la Inspecteur, et sous Conditions la variable Mouvement vertical
va apparaître. Sélectionnez le.
Vous venez de définir la condition pour déterminer quand modifier l'état dans la machine à états: si la valeur de Mouvement vertical
est supérieur à 0
, alors le personnage va commencer le Saut animation.
Nous voulons aussi une transition entre le Saut l'animation et la Tomber animation:
La valeur maximale que Mouvement vertical
va atteindre est 1
, donc, pour la transition entre Saut et Tomber, nous pouvons l'activer lorsque cette valeur est inférieure à 0.5
.
Maintenant, nous devons faire revenir le personnage à la Tourner au ralenti animation après la chute. Puisque Tourner au ralenti devrait jouer lorsque le personnage est sur le sol, vous devez créer une transition entre Tomber et Tourner au ralenti.
Pour finir, vous devez vous assurer qu'il s'active lorsque le personnage est au sol. Vous pouvez le faire en définissant le paramètre de transition de Mouvement vertical
à moins que 0,1
-cela signifie fondamentalement que le Mouvement vertical
est 0
, ce qui signifie que le personnage est sur le terrain.
Nous devons maintenant nous assurer que nous ne voyons aucune Tourner au ralenti animations pendant que le personnage est dans l'air entre le Saut et Tomber animations. Pour ce faire, créez un nouveau paramètre, cette fois un Bool.
Appeler Sur le sol
.
Sélectionnez la transition entre Saut et Tomber. Vous voulez que cette transition se produise lorsque le personnage est toujours dans les airs, n'est-ce pas? Alors allez au Inspecteur, clique le +, et ajoutez un nouveau paramètre à la transition. Fondamentalement, vous voulez que cela se produise lorsque la valeur de Sur le sol
est faux
.
Ensuite, sur la transition de Tomber à Tourner au ralenti, ajouter le paramètre Sur le sol
et définissez la valeur sur vrai
:
Notre travail avec Mecanim est terminé. Il est maintenant temps de passer au script.
Dans votre répertoire de ressources, créez un nouveau dossier appelé Les scripts
. Ensuite, créez un nouveau script C # appelé CharacterMove.cs
. Notez que le script que vous êtes sur le point de créer est très simple et que l'objectif principal est de montrer comment vous pouvez modifier les animations du personnage par code..
La meilleure pratique consiste à utiliser la physique de Unity lorsque vous souhaitez créer des jeux robustes. Cependant, dans un souci de simplicité et de compréhension, nous allons créer une petite simulation..
Créez quatre variables dans le script: une pour référencer le Animateur composant, un autre pour la vitesse de la chute, un troisième pour la quantité de mouvement vertical, et un drapeau pour vérifier si le personnage est au sol.
Classe publique CharacterMove: MonoBehaviour // Variables public Animator anim; // Référence à l'animateur private float fallSpeed; // La vitesse à laquelle le personnage tombe privé float verticalMovement; // La quantité de mouvement vertical private bool onGround; // Flag pour vérifier si le personnage est au sol
dans le Début()
méthode, vous devez vous assurer que la vitesse est réglée sur 0,03
(ou toute autre valeur que vous jugez adaptée à vos animations) et que le personnage est ancré.
void Start () // Le personnage commence au sol onGround = true; // Définir la vitesse de chute fallSpeed = 0.03f;
Maintenant, sur le Mettre à jour()
méthode, il y a plusieurs choses que vous devez vérifier. Tout d’abord, vous devez détecter quand le Barre d'espace est pressé pour faire sauter le personnage. Lorsque vous appuyez dessus, réglez le mouvement vertical sur 1
et le sur le sol
drapeau à faux
.
void Update () // Si la barre d'espace est enfoncée et que le caractère est au sol if (Input.GetKeyDown (KeyCode.Space) == true && onGround == true) verticalMovement = 1f; onGround = false;
Qu'est-ce qui se passe quand le Barre d'espace n'est pas pressé? Eh bien, vous devez vérifier si le personnage est dans les airs et si son mouvement vertical est supérieur à 0
; si c'est le cas, vous devez réduire le mouvement vertical en soustrayant la vitesse de chute.
void Update () // Si la barre d'espace est enfoncée et que le caractère est au sol if (Input.GetKeyDown (KeyCode.Space) == true && onGround == true) verticalMovement = 1f; onGround = false; else // Vérifie si le personnage est dans les airs et si le mouvement vertical est supérieur à 0 if (onGround == false && verticalMovement> 0) // Réduit le mouvement vertical verticalMovement - = fallSpeed;
Comme vous vous en souviendrez, une fois mouvement vertical
tombe au-dessous 0.5
, la Tomber l'animation commencera à jouer.
Cependant, nous ne voulons pas soustraire FallSpeed
de mouvement vertical
pour toujours, puisque le personnage atterrira à un moment donné. Si la valeur du mouvement vertical est égale ou inférieure à 0
, nous dirons que cela signifie que le personnage a touché le sol.
void Update () // Si la barre d'espace est enfoncée et que le caractère est au sol if (Input.GetKeyDown (KeyCode.Space) == true && onGround == true) verticalMovement = 1f; onGround = false; else // Vérifiez si le personnage est dans les airs et si le mouvement vertical est supérieur à 0 if (onGround == false && verticalMovement> 0) // Réduit le mouvement vertical verticalMovement - = fallSpeed // Si le mouvement vertical est inférieur ou égal à 0, le caractère est à l'étage si (verticalMovement < 0) verticalMovement = 0; onGround = true;
Pour terminer le Mettre à jour()
méthode, vous devez passer les valeurs de mouvement vertical
et sur le sol
au Animateur composant:
void Update () // Si la barre d'espace est enfoncée et que le caractère est au sol if (Input.GetKeyDown (KeyCode.Space) == true && onGround == true) verticalMovement = 1f; onGround = false; else // Vérifie si le personnage est dans les airs et si le mouvement vertical est supérieur à 0 if (onGround == false && verticalMovement> 0) // Réduit le mouvement vertical verticalMovement - = fallSpeed; // Si le mouvement vertical est inférieur ou égal à 0, le personnage est au sol si (verticalMovement < 0) verticalMovement = 0; onGround = true; // Update the animator variables anim.SetFloat("VerticalMovement", verticalMovement); anim.SetBool("OnGround", onGround);
Le script est fini. Maintenant, vous devez l'ajouter à la Dragon
objet de jeu et ajouter la référence à la Animateur composant. Pour ce faire, une fois le script ajouté, faites glisser le curseur. Animateur dans le champ approprié du script.
Si vous appuyez sur play et que vous le testez, les animations devraient changer comme elles sont supposées le faire. Le dragon commence Tourner au ralenti, mais une fois que vous appuyez sur le Barre d'espace ce sera Saut puis commencez à jouer le Tomber animation avant de retourner à Tourner au ralenti.
Bien que, dans cette série de didacticiels, nous n'utilisions que les outils par défaut fournis avec Unity, le logiciel Unity Asset Store contient de nombreux excellents outils 2D qui peuvent vous aider à rendre ce processus encore plus simple et plus rapide. Smooth Moves et Puppet 2D sont deux bons exemples. Chacun de ces outils peut vous aider à définir les personnages, la hiérarchie et les animations de manière intuitive et simple..
Des plug-ins comme ceux-ci offrent des extras, comme la possibilité d'ajouter des "os" 2D, facilitant ainsi le processus d'animation et rendant les déformations plus réalistes. Si votre idée est d'utiliser des animations 2D avec plusieurs degrés de détail, nous vous recommandons fortement de vérifier ces plugins..
Ceci conclut notre série de didacticiels sur la création d’une animation 2D à base d’os avec Unity. Nous avons couvert beaucoup de terrain dans cette courte série et vous devriez maintenant en savoir assez pour vous lancer dans vos animations 2D. Si vous avez des questions ou des commentaires, comme toujours, n'hésitez pas à nous laisser un mot dans les commentaires..