tutoriel TILED

commencer

TILED Tutoriel

Télécharger les logiciels nécessaires (Tiled)

Étape 1 :

1- Téléchargement

À noter que les fichiers TILED doivent impérativement être des fichier tmj pour être reconnus par Workadventure

Il faut créer le document .tmj de la carte dans le dossier où vous avez déposé les fichiers "maps"

Étape 2 :

Créer ou ouvrirun fichier TMJsur Tiled

2- Tiled

À noter que chaque jeu de tuile doit être embarqué pour que Workadventure puisse les afficher à partir du fichier .tmj

Étape 3 :

Edition préférences intégrer le jeu de tuiles

2- Tiled

Étape 4 :

Ajouter un nouveau calque:Faire clic droit ( ),Nouveau ( )Calque de tuiles ( )Calque d'objets ( )

2- Tiled

Ordre des calques et syntaxe du nom de calques

1. abovePlayer2
2. abovePlayer1
3. floorLayer
4. collisions
5. start

Étape 5 :

Pour commencer Workadventure,il faut ces calques de départ:

2- Tiled

Étape 6 :

Intégrer un nouveau jeu de tuiles

2- Tiled

Tous les assets (images) doivent être dans un dossier commun

Étape 6.1 :

Cliquer sur parcourir dans la fenêtre de dialogue qui s'ouvre, attention à bien cocher la case "embarquer dans la carte"

2- Tiled

Étape 6.2 :

Rechercher l'image voulue dans le dossier."Ce pc > Documents > Github > uni-rennes > tileset" dans le cas de Rennes2D

2- Tiled

La largeur de tuile et la hauteur de tuile doivent rester à 32 pix

Étape 6.3 :

Valider

2- Tiled

Appliquer les tuiles sur le calque choisi ( )

image 2

Choisir un calque(image 2) les nouvelles tuiles doivent être sur un calque de tuiles ( ) séparé de ceux de départ,attention à l'ordre des calques

image 3

image 1

Sélectionner les tuiles voulues sur le jeu de tuiles (image 1) en utilisant le clic gauche de la souris ( )

Étape 7 :

Utiliser les tuiles

2- Tiled

2. Cliquer sur "Éditer le jeu de Tuiles" ( )

3. Séléctionner la tuile

1. Intégrer le jeu de tuiles "WA_Special_Zones.png"

Étape 8 :

2- Tiled

Créer les tuiles de collisions

Cliquer sur le type de la propriété pour ouvrir le menu déroulant et séléctionner le type "bool"

Séléctionner le calque "collisions" et la tuile

Syntaxe

Ajouter une Propriété ( )

Appliquer les tuiles sur le calque collisions( )

Étape 8.1 :

2- Tiled

Créer les tuiles de collisions

Appliquer les tuiles sur le calque start ( )

Séléctionner le calque "start" et la tuile

Étape 9 :

2- Tiled

Créer les tuiles de début

Créer le calque "to-XXX", ajouter la propriété "exitUrl"

Créer le calque "from-XXX", ajouter la propriété "startLayer"

Étape 10 :

2- Tiled

Créer les tuiles d'entrée / sortie

Créer le calque "from-XXX" et la tuile

Séléctionner le calque "to-XXX" et la tuile

Étape 10.1 :

2- Tiled

Appliquer les tuiles d'entrée / sortie