Importation et utilisation des animations

Avec hyperPad, vous pouvez créer des objets avec des animations personnalisées. Vous avez deux choix en ce qui concerne les animations. Vous pouvez importer des animations sous forme de cadres individuels ou d'une feuille de sprite complète.

Cadres individuels :

Vous pouvez créer un cycle d'animation en important une séquence d'images de cadres individuels.

Pour commencer, vous devez importer votre premier cadre ou une image pour représenter votre objet depuis la "Bibliothèque d'Assets" (voir Importer des Assets). Une fois que vous avez importé votre objet, appuyez et maintenez votre doigt sur l'objet auquel vous souhaitez ajouter des animations, cela fera apparaître le Menu des Assets.

Dans le Menu des Assets, sélectionnez "Ajouter Animation", cela fera apparaître l'option d'importation depuis la Pellicule photo ou Dropbox. Voir "Importer des Assets" pour plus de détails sur ces options.

Une fois que vous avez sélectionné votre source d'importation souhaitée, vous pouvez sélectionner tous les cadres de l'animation, puis appuyer sur "Terminé" dans le coin supérieur droit pour continuer à importer ces cadres.

On vous demandera ensuite de saisir un nom pour le cycle d'animation.

Une fois que vous avez entré le nom du cycle, hyperPad créera une feuille de sprite avec tous les cycles d'animation pour cet asset (y compris le graphique d'asset original). Gardez à l'esprit qu'hyperPad générera uniquement une feuille de sprite avec une résolution maximale de 2048x2048 pixels. Cela signifie que la taille totale de chaque cadre importé (y compris l'asset original) ne peut pas dépasser la taille maximale de la feuille de sprite.

Si vous traitez avec des images plus grandes, de nombreux cadres d'animation, ou les deux. Vous allez probablement rencontrer une erreur indiquant que vous avez dépassé la taille maximale de la feuille de sprite. Si vous tenez absolument à utiliser de tels graphiques de grande taille, alors il existe quelques solutions.

1. Divisez vos séquences d'animation à travers plusieurs objets. Chacun finira par avoir sa propre feuille de sprite de 2048x2048. Ainsi, ayez un objet "marcher", ayez un objet "sauter", etc. Où chaque objet stocke le cycle d'animation (ou plusieurs cycles). De cette façon, vous générez plusieurs feuilles de sprite de 2048x2048.

2. Ne les importez pas comme des cycles d'animation. Importez simplement chaque cadre d'animation comme leur propre image. Ensuite, utilisez le comportement Jouer Animation et ajoutez chaque cadre manuellement à la chronologie d'animation dans les propriétés du comportement.

Feuilles de sprite :

Vous pouvez créer des feuilles de sprite personnalisées et les importer dans hyperPad en liant votre projet avec Dropbox. Pour en savoir plus sur le lien de votre projet avec Dropbox, voir "Importer des Assets".

Pour créer des feuilles de sprite personnalisées, vous pouvez utiliser n'importe quel outil capable de créer une feuille de sprite compatible avec "Cocos2D". Toutes les feuilles de sprite doivent avoir un fichier PLIST associé contenant les métadonnées de la feuille de sprite. Vous pouvez consulter l'article d'aide "Types d'Assets pris en charge" pour en savoir plus sur les feuilles de sprite compatibles.

Aperçu des Animations :

Si votre asset a des animations, il sera étiqueté dans la "Bibliothèque d'Assets" comme un asset "Animé".

Pour prévisualiser les animations d'un asset, ouvrez le "Menu des Assets" en appuyant et maintenant votre doigt sur l'asset animé puis sélectionnez "Aperçu des Animations".

D'ici, vous pouvez faire apparaître à nouveau le "Menu des Assets", et sélectionner "Aperçu de l'Animation". La fenêtre contextuelle lira l'animation et vous montrera également des informations utiles.

Si vous appuyez et maintenez votre doigt sur un cycle d'animation, cela ouvrira le Menu des Assets vous permettant de voir les cadres individuels pour ce cycle.

Utilisation des Animations :

Vous pouvez ajouter un asset animé directement sur le canevas, ou utiliser le comportement "Jouer Animation" pour exécuter une animation à la demande.

Pour ajouter un asset animé directement sur le canevas, lancez la "Bibliothèque d'Assets" et visualisez les animations de l'asset animé. Si vous sélectionnez un cycle d'animation, il sera ajouté au "Dock", vous permettant de le faire glisser directement dans votre scène.

Lorsque vous ajoutez un cycle d'animation au canevas, il créera un objet et ajoutera automatiquement le comportement "Jouer Animation" à celui-ci. Si vous avez besoin de modifier les paramètres de lecture de l'animation pour cet objet, vous pouvez le faire depuis les comportements de l'objet.

Utilisation du Comportement "Jouer Animation" :

Si vous avez besoin de jouer une animation lors d'un événement, comme lorsque l'utilisateur appuie sur un bouton ou déplace un joystick, alors vous pouvez utiliser le comportement "Jouer Animation".

Commencez par ajouter un asset animé au canevas. Ensuite, sélectionnez l'objet et lancez l'"Éditeur de Comportement" à partir des "Propriétés de l'Objet".

Dans cet exemple, nous allons faire jouer l'animation à l'objet lorsqu'il est pressé. Commencez par ajouter le comportement "Toucher Démarré".

Ensuite, ajoutez le comportement "Jouer Animation" de la catégorie FX, et connectez-le au comportement "Toucher Démarré" que vous avez ajouté précédemment.

Une fois connecté, appuyez sur le comportement "Jouer Animation" pour voir les "Propriétés du Comportement". Dans les propriétés du comportement, vous pouvez modifier quel objet animer, quelle animation jouer, et d'autres paramètres divers qui affectent la lecture des animations.

Dans les propriétés du comportement, appuyez sur la case étiquetée "Sélectionner Animation". Cela fera apparaître la chronologie d'animation, vous permettant d'ajouter des cadres ou un cycle d'animation.

Pour ajouter des animations à la chronologie, vous pouvez appuyer sur l'icône "Bibliothèque d'Assets" pour ouvrir la bibliothèque d'assets. Tout asset graphique sur lequel vous appuyez sera automatiquement sélectionné et ajouté à la chronologie.

Si vous souhaitez ajouter un cycle d'animation, appuyez et maintenez sur un asset animé pour ouvrir le "Menu des Assets". Dans le Menu des Assets, sélectionnez "Aperçu des Animations". La Bibliothèque d'Assets vous montrera maintenant tous les cycles d'animation que vous avez précédemment ajoutés à l'asset. Appuyer sur un cycle l'ajoutera à la chronologie.

Une fois que vous avez terminé d'ajouter des animations à la chronologie, vous pouvez appuyer sur l'écran de comportement pour fermer la chronologie et revenir à l'éditeur de comportement.

Si vous appuyez sur "Jouer", l'objet ne s'animera qu'une fois que vous l'aurez touché.