Init

2026-01-20 20:33:59 +01:00
commit b16a40e431
583 changed files with 87339 additions and 0 deletions
--- a/content/ui-systems/ui-files.fr.md
+++ b/content/ui-systems/ui-files.fr.md
@@ -0,0 +1,161 @@
+---
+title: Fichiers UI
+type: docs
+weight: 10
+---
+
+Les fichiers UI (`.ui`) sont le langage de balisage déclaratif de Hytale pour définir les interfaces utilisateur. Ils décrivent la structure, la disposition et le style des éléments UI qui peuvent être chargés par les plugins via `UICommandBuilder.append()`.
+
+## Emplacement des Fichiers
+
+Les fichiers UI sont généralement stockés dans le répertoire Assets :
+
+```
+Assets/
+  Common/UI/Custom/           # UI personnalisée côté serveur
+    Pages/                    # Templates de pages personnalisées
+    Hud/                      # Éléments HUD personnalisés
+    Common.ui                 # Définitions partagées
+    Sounds.ui                 # Définitions de sons
+  Client/Interface/           # UI côté client
+    InGame/Hud/               # Composants HUD
+    Common/                   # Composants communs
+    Common.ui                 # Définitions partagées client
+```
+
+## Structure de Base
+
+Un fichier `.ui` se compose de définitions de variables et de déclarations de widgets :
+
+```
+// Importer des définitions externes
+$Common = "../Common.ui";
+
+// Définir des variables locales
+@ButtonHeight = 44;
+@TextColor = #96a9be;
+
+// Définir un arbre de widgets
+Group #Container {
+  Anchor: (Width: 400, Height: 300);
+  Background: (Color: #000000(0.8));
+
+  Label #Title {
+    Text: "Bonjour le monde";
+    Style: (FontSize: 24, TextColor: @TextColor);
+  }
+}
+```
+
+## Charger des Fichiers UI depuis les Plugins
+
+Utilisez `UICommandBuilder.append()` pour charger un fichier UI :
+
+```java
+@Override
+public void build(Ref<EntityStore> ref, UICommandBuilder builder,
+                  UIEventBuilder events, Store<EntityStore> store) {
+    // Charger le template UI (extension .ui OBLIGATOIRE)
+    builder.append("Pages/MyPage.ui");
+
+    // Ajouter à un élément spécifique
+    builder.append("#ContentList", "Pages/ListItem.ui");
+
+    // Définir des valeurs dynamiques avec des sélecteurs
+    builder.set("#Title", "Bienvenue, " + playerRef.getUsername());
+}
+```
+
+### Résolution des Chemins
+
+Le chemin est relatif à `Common/UI/Custom/`. L'extension `.ui` est **obligatoire**.
+
+| Chemin dans `append()` | Emplacement Résolu |
+|------------------------|-------------------|
+| `Pages/MyPage.ui` | `Common/UI/Custom/Pages/MyPage.ui` |
+| `Common.ui` | `Common/UI/Custom/Common.ui` |
+
+### Pour les Plugins Java (Mods)
+
+Lors de la création d'un plugin Java avec une UI personnalisée, placez vos fichiers `.ui` dans le dossier resources :
+
+```
+your-plugin/
+  src/main/
+    java/                           # Code source Java
+    resources/
+      Common/UI/Custom/             # Les fichiers UI vont ici
+        Pages/
+          MyPage.ui
+          MyButton.ui
+        Common.ui                   # Vos définitions partagées
+      plugin.json                   # Manifeste du plugin
+```
+
+Définissez `"IncludesAssetPack": true` dans votre `plugin.json` pour activer le chargement des assets :
+
+```json
+{
+  "Group": "MyGroup",
+  "Name": "MyPlugin",
+  "Version": "1.0.0",
+  "Main": "com.example.MyPlugin",
+  "IncludesAssetPack": true
+}
+```
+
+{{< callout type="info" >}}
+Le serveur cherche automatiquement les fichiers UI dans `Common/UI/Custom/` au sein de l'asset pack de votre plugin. C'est pourquoi des chemins comme `Pages/MyPage.ui` fonctionnent sans spécifier le chemin complet.
+{{< /callout >}}
+
+## Concepts Clés
+
+### Variables
+
+Les variables stockent des valeurs réutilisables :
+
+```
+@Height = 50;                           // Nombre
+@Color = #ff5500;                       // Couleur
+@Style = (FontSize: 16, RenderBold: true);  // Objet
+```
+
+### Imports
+
+Importer des définitions depuis d'autres fichiers :
+
+```
+$Common = "Common.ui";                  // Importer un fichier
+$Common.@DefaultButtonStyle             // Référencer une variable importée
+```
+
+### IDs de Widget
+
+Utilisez `#` pour assigner des IDs ciblables depuis Java :
+
+```
+Label #PlayerName {
+  Text: "Inconnu";
+}
+```
+
+```java
+builder.set("#PlayerName", player.getUsername());
+```
+
+### Localisation
+
+Utilisez le préfixe `%` pour les clés de traduction :
+
+```
+Label {
+  Text: %server.ui.welcome.title;
+}
+```
+
+## Étapes Suivantes
+
+- [Syntaxe UI](ui-syntax) - Référence de syntaxe détaillée
+- [Widgets UI](ui-widgets) - Types de widgets disponibles
+- [Propriétés UI](ui-properties) - Propriétés communes
+- [Styles UI](ui-styles) - Système de styles