En poursuivant votre navigation sur ce site ou en cliquant sur la croix, vous acceptez le dépôt de cookies destinés à réaliser des statistiques de visites ainsi qu'à vous proposer des vidéos, des boutons de partage, des publicités personnalisées et un service de chat. Pour en savoir plus et paramétrer les cookies X

FR EN DE ES IT PT
Naviguer dans les forums 
Trackers Ankama
Epinglé

Premiers pas

Par - PRODUCER - 31 Août 2016 - 12:11:57
AnkaTracker

Activer le mode "dev"


Tout d'abord, la création de thème d'interface ne peut se faire que sur la version bêta du client. Vous devez apporter une petite modification au client pour pouvoir tester facilement vos créations sans par le système de distribution classique : activer le mode "dev".

Le mode développement débloque les outils suivants :

  • Une petite interface de contrôle affichant les FPS et performances du client, ainsi que des raccourcis pour ouvrir les différentes consoles.
  • Affichage de la console permettant d'exécuter un certain nombre de commandes telles que le déchargement d'interface ou encore le rechargement d'un module (ouverture via Ctrl + ² par défaut).

Pour le débloquer il suffit d'ajouter une ligne au fichier de configuration de Dofus secondaire nommé config-custom.xml :

Si le fichier n'existe pas, il faut le créer dans le dossier où se trouve le fichier "config.xml" (dofus app/ sous Windows) et ajouter dedans :

[code]
        true
        true [/code]

s'il existe déjà, ajoutez simplement les lignes suivantes après :
[code]
        true
        true
[/code]

Que puis-je modifier ?


Via le système de thème, vous allez pouvoir modifier :

  • Les textures des interfaces (hors textures de type icone d'objets, sorts, ...)
  • Le style des textes (taille, type, couleur, ...)

Vous ne pouvez pas modifier (liste non exhaustive) :

  • La position des éléments
  • La taille éléments lorsqu'elle est fixée dans le code des interfaces
  • Les paramêtres des éléments qui n'utilisent pas les fichiers themeData


Mise en place du thème


Le plus simple pour commencer est de dupliquer le thème par défaut, à savoir darkStone. Pour cela, allez dans le dossier ou le jeu est installé puis dans le dossier contenant les thèmes (app/content/themes) puis dupliquez et renommer le dossier (via un copier/coller par exemple). Pour faciliter

Une fois cela fait, vous allez devoir renommer le fichier darkStone.dt avec le nouveau nom du dossier. Vous pouvez maintenant éditer ce fichier pour personnaliser les informations qui seront affichées dans l'interface du choix de thème. Enfin, supprimez le fichier signature.xmls.


Résumé

  • Si ce n'est pas fait, activer le "devMode" (voir plus haut)
  • Dupliquer le dossier darkStone
  • Renommer le fichier darkStone.dt
  • Editer le fichier darkStone.dt
  • Supprimer le fichier signature.xmls


Les différents types de fichiers


Fichier DT


[blockquote]Localisation : à la racine du dossier de thème

But : Informations sur le module, principalement utile pour l'interface de choix de thème. Vous pouvez y indiquer le nom, la description du module tel que vu dans l'interface de choix de thème. Vous pouvez également mettre une image servant de prévisualisation (cette dernière devra se trouver dans le dossier "bitmap")
[/blockquote]


Fichier PNG/JPG


[blockquote]Localisation : Dossiers bitmap, texture, common, illu

But : Ce sont les images qui vont être utilisées par le client. Vous allez devoir modifier ces fichiers pour personnaliser les interfaces.
[/blockquote]


Fichiers CSS


[blockquote]Localisation : dans le dossier nommé "css"

But : Définir les différents style de polices utilisées (type de police, couleurs, tailles, etc.).

Informations

Liste des polices disponibles : Eras, Tahoma, Verdana, Gadugi, Roboto, RobotoCondensed, BebasNeue, GoodyBookletter.

Pour le moment, il n'est pas possible d'utiliser d'autres polices.
[/blockquote]


Fichier colors.xml


[blockquote]Localisation : à la racine du dossier de thème.

But : Déclaration des couleurs qui seront utilisées dynamiquement.

Informations

L'encodage utilise la base 16 et les formats autorisés sont : 0xRRGGBB et 0xAARRGGBB (A: Alpha, R: Rouge, G: Vert, B: Bleu). Exemple d'outil pour obtenir les codes couleurs : Cliquez ici
[/blockquote]


Fichiers themeData.JSON


[blockquote]Localisation : à la racine du dossier de thème

But : Définir la façon d'utiliser certaines textures

Informations

Tous les fichiers commençant par themeData et de type JSON sont automatiquement chargés au démarrage du client. Attention : s'il y a une erreur de formatage dans le fichier, il ne sera pas chargé et le client n'affichera de message d'erreur.

Le fichier permet de modifier les propriétés du composant sur lequel le style sera appliqué. En général les composants qui utilisent ces propriétés sont des TextureBitmap

Généralement :

[/blockquote]
  • uri : chemin vers la texture
  • scale9Grid : un rectangle qui indique comment la texture doit être redimensionner (chercher scale 9 grid sur google). Exemple : scale9Grid:{x:[marge gauche], y:[marge haut], width:[taille - marge gauche - marge droite], height:[hauteur - marge haut - marge bas]}
  • colorTransform: Applique une transformation de couleur (voir Cliquez ici pour le détail des propriétés utilisables).
  • align : Alignement de la texture (TOPLEFT, TOP, TOPRIGHT, LEFT, CENTER, RIGHT, BOTTOMLEFT, BOTTOM, BOTTOMRIGHT)
  • alpha : Valeur de 0 à 1 indiquant la transparence (0 pour invisible, 1 pour sans transparence)
  • bgColor : Valeur de type 0xRRGGBB ou 0xAARRGGBB permettant de définir la couleur de fond du composant
  • bgAlpha : Valeur de 0 à 1 indiquant la transparence du fond du composant (0 pour invisible, 1 pour sans transparence)
2 -1
Première intervention Ankama
Score : 6045

Un bug empêchait d'afficher la liste des thèmes disponibles. Un patch vient de corriger ce problème.

Voir le message dans son contexte
0 0
Réactions 3
Score : 6045

Un bug empêchait d'afficher la liste des thèmes disponibles. Un patch vient de corriger ce problème.

0 0
Score : 6045

La commande /uiinspector (via la console) permet de voir le chemin et les css utilisé par de nombreux composant. Cet outil pourra vous être utile si vous cherchez quels sont les ressources utilisées.

0 0

Si vous éditez les fichiers CSS, il y a une commande utile /clearcsscache
Utilisez cette commande, fermez puis rouvrez l'interface sur laquelle vous travaillez, et normalement le client va recharger les fichiers CSS nécessaires et ainsi sera à jour avec vos dernières modifications.