{"id":145731,"date":"2024-07-03T11:25:41","date_gmt":"2024-07-03T09:25:41","guid":{"rendered":"https:\/\/hifivem.com\/?p=145731"},"modified":"2026-07-26T07:59:58","modified_gmt":"2026-07-26T05:59:58","slug":"trew-hud","status":"publish","type":"post","link":"https:\/\/fivemx.com\/fr\/trew-hud\/","title":{"rendered":"Trew HUD (qbCore\/ESX)"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Ce fut une excellente exp\u00e9rience de jouer \u00e0 GTA5 RP et d'apprendre le LUA pour coder le Trew HUD UI. Cependant, apr\u00e8s de nombreux d\u00e9fis avec la communaut\u00e9 FiveM et le projet lui-m\u00eame, j'ai d\u00e9cid\u00e9 d'arr\u00eater tout d\u00e9veloppement ult\u00e9rieur. Cela fait 6 mois que je n'ai pas jou\u00e9 \u00e0 GTA5 RP, et continuer ce projet n'a plus de sens.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Aper\u00e7u vid\u00e9o<\/h2>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<div class=\"video-container\"><iframe title=\"TREW HUD UI - Une interface utilisateur pour FiveM\" width=\"1170\" height=\"658\" src=\"https:\/\/www.youtube.com\/embed\/u1QTJ5aHcGA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/div>\n<\/div><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">T\u00e9l\u00e9charger Mirror<\/h2>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\"><\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Caract\u00e9ristiques<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Logo du serveur ;<\/li>\n\n\n\n<li>Emploi et cat\u00e9gorie d&#039;emploi;<\/li>\n\n\n\n<li>Argent, argent sale, banque et soci\u00e9t\u00e9 (ce dernier est r\u00e9serv\u00e9 \u00e0 ESX)\u00a0;<\/li>\n\n\n\n<li>Statuts tels que la sant\u00e9, l\u2019armure, l\u2019endurance, la faim et la soif\u00a0;<\/li>\n\n\n\n<li>Compteur de vitesse avec ceinture de s\u00e9curit\u00e9 <a class=\"wpil_keyword_link\" href=\"https:\/\/fivemx.com\/fr\/soutien\/\" title=\"soutien\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"1187\">soutien<\/a>, d\u00e9tection de carburant, \u00e9clairage, changement de vitesse, alertes et sir\u00e8nes (pour v\u00e9hicules d&#039;urgence) ;<\/li>\n\n\n\n<li>Localisation et heure ;<\/li>\n\n\n\n<li>Contr\u00f4leur vocal (compatible OneSync)\u00a0;<\/li>\n\n\n\n<li>Interface utilisateur pour les armes ;<\/li>\n\n\n\n<li>Inclusion du statut personnalis\u00e9.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Instructions d&#039;installation<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/fivemx.com\/fr\/comment-installer-le-hud-fivem\/\">Comment installer FiveM HUD<\/a><\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Extraire les fichiers :<\/strong>\n<ul class=\"wp-block-list\">\n<li>Extraire le <code>.fermeture \u00e9clair<\/code> fichier ou ouvrez-le directement.<\/li>\n\n\n\n<li>Lieu <code>trew_hud_ui<\/code> dans votre r\u00e9pertoire de ressources.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>Mise \u00e0 jour <code>serveur.cfg<\/code>:<\/strong>\n<ul class=\"wp-block-list\">\n<li>Ajoutez la ligne suivante \u00e0 votre <code>serveur.cfg<\/code> fichier:sqlCode copier<code>d\u00e9marrer trew_hud_ui<\/code><\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Instructions sp\u00e9ciales pour la version ESX<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Exigences:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>es_extended<\/code><\/li>\n\n\n\n<li><code>soci\u00e9t\u00e9_esx<\/code><\/li>\n\n\n\n<li><code>compte_addon_esx<\/code><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Facultatif:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>esx_basicneeds<\/code><\/li>\n\n\n\n<li><code>esx_status<\/code><\/li>\n\n\n\n<li><code>Carburant Legacy<\/code> (il devrait \u00eatre d\u00e9marr\u00e9 <strong>avant<\/strong> <code>trew_hud_ui<\/code>)<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>D\u00e9sactivation du HUD par d\u00e9faut\u00a0:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Aller \u00e0 <code>es_extended\/config.lua<\/code> et d\u00e9finir <code>Configuration.ActiverHud<\/code> \u00e0 <code>FAUX<\/code>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Remplacement du code dans <code>esx_basicneeds\/main.lua<\/code>:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Remplacer le code existant\u00a0: <code>TriggerEvent(&#039;esx_status:registerStatus&#039;, &#039;faim&#039;, 1000000, &#039;#CFAD0F&#039;, function(status) renvoie true fin, function(status) status.remove(1000) fin) TriggerEvent(&#039;esx_status:registerStatus&#039;, &#039;soif&#039;, 1000000, &#039;#0C98F1&#039;, function(status) renvoie true fin, function(status) status.remove(750) fin) <\/code>avec: <code>TriggerEvent(&#039;esx_status:registerStatus&#039;, &#039;faim&#039;, 1000000, &#039;#CFAD0F&#039;, function(status) return false end, function(status) status.remove(1000) end) TriggerEvent(&#039;esx_status:registerStatus&#039;, &#039;soif&#039;, 1000000, &#039;#0C98F1&#039;, function(status) return false end, function(status) status.remove(750) end)<\/code><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Instructions sp\u00e9ciales pour les versions VRP\/VRPEX<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Param\u00e8tres Config.vRP\u00a0:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Configurez les \u00e9l\u00e9ments n\u00e9cessaires comme l&#039;argent noir en sp\u00e9cifiant l&#039;ID de l&#039;\u00e9l\u00e9ment dans <code>config.lua<\/code>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Exemple de Config.vRP\u00a0:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><code>Configuration.vRP = {<br> blackMoney = &quot;dirty_money&quot; -- Remplacez ceci par votre identifiant d&#039;objet d&#039;argent noir<br>}<br><\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Configurations g\u00e9n\u00e9rales :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Configuration.Param\u00e8tres r\u00e9gionaux\u00a0:<\/strong> D\u00e9finir la langue (la valeur par d\u00e9faut est <code>fr<\/code>).<\/li>\n\n\n\n<li><strong>Config.serverLogo\u00a0:<\/strong> D\u00e9finissez l&#039;URL du logo de votre serveur.<\/li>\n\n\n\n<li><strong>Config.font:<\/strong> Personnaliser la police de l&#039;interface utilisateur (la valeur par d\u00e9faut est Montserrat).<\/li>\n\n\n\n<li><strong>Date de configuration\u00a0:<\/strong> D\u00e9finir le format de date pour la position GPS.<\/li>\n\n\n\n<li><strong>Config.voix\u00a0:<\/strong> Configurer les param\u00e8tres vocaux (compatible OneSync).<\/li>\n\n\n\n<li><strong>Configuration.v\u00e9hicule\u00a0:<\/strong> Configurer les param\u00e8tres du v\u00e9hicule et du compteur de vitesse.<\/li>\n\n\n\n<li><strong>Config.ui\u00a0:<\/strong> Basculer les \u00e9l\u00e9ments d&#039;affichage du HUD.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Ajout d&#039;un statut personnalis\u00e9<\/strong><\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Vous pouvez cr\u00e9er des indicateurs personnalis\u00e9s pour des statuts existants comme le stress ou l&#039;ivresse.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Exemple:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">n<code>exportations.trew_hud_ui.createStatus({<br> statut = &#039;stress&#039;,<br> couleur = &#039;#FF0090&#039;,<br> ic\u00f4ne = &#039;<i class=\"fas fa-brain\"><\/i> &#039;<br>});<br><\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Mise \u00e0 jour du statut personnalis\u00e9\u00a0:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><code>Citizen.CreateThread(function()<br> bien que ce soit vrai<br> Citoyen.Attendez(1000)<br> <br> \u00c9TAT DE STRESS local<br><br> TriggerEvent(&#039;esx_status:getStatus&#039;, &#039;stress&#039;, fonction(statut)<br> STRESS_STATUS = statut.getPercent()<br> fin)<br><br> exports.trew_hud_ui:setStatus({<br> nom = &#039;stress&#039;,<br> valeur = STRESS_STATUS<br> });<br> fin<br>fin)<br><\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Commandes de discussion\u00a0:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\/toggleui:<\/strong> Active\/d\u00e9sactive les \u00e9l\u00e9ments d&#039;information HUD, <a href=\"https:\/\/fivemx.com\/fr\/comment-devenir-createur-de-contenu-gta-rp\/\" id=\"498\">utile pour les streamers<\/a>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Exemple d&#039;utilisation\u00a0:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><code>\/toggleui<br><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">FAQ<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Q\u00a0: La date du HUD est erron\u00e9e\u00a0! Pouvez-vous la corriger\u00a0?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>UN:<\/strong> La date HUD utilise le jeu <a href=\"https:\/\/fivemx.com\/fr\/performance\/\" title=\"Performances et optimisation du serveur FiveM\" data-wpil-monitor-id=\"1519\">heure du serveur et fonctions par d\u00e9faut pour FiveM<\/a>, donc ce n&#039;est pas faux. Si vous souhaitez afficher la date r\u00e9elle, vous pouvez la modifier. <code>application.js<\/code> en utilisant JavaScript <code>Date()<\/code> Fonction. Recherchez sur Google pour plus d&#039;informations.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Q\u00a0: Comment puis-je modifier la commande \/toggleui pour masquer les \u00e9l\u00e9ments\u00a0?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>UN:<\/strong> Pour \u00e9diter le <code>\/toggleui<\/code> commande, va \u00e0 la <code>interface utilisateur.html<\/code> fichiers et recherchez le <code>identifiant<\/code> attribut des \u00e9l\u00e9ments que vous souhaitez masquer. Ensuite, modifiez le <code>basculeui<\/code> commande dans <code>client.lua<\/code> pour r\u00e9pondre \u00e0 vos besoins.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Q\u00a0: Avez-vous l\u2019intention de publier une version prenant en charge CE script ou CE script\u00a0?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>UN:<\/strong> Pas pour le moment. LegacyFuel est pr\u00e9sent\u00e9 comme une fonctionnalit\u00e9 optionnelle, car il modifie le comportement du carburant, mais ne n\u00e9cessite aucune fonction particuli\u00e8re pour fonctionner.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Q : Je souhaite modifier la position des \u00e9l\u00e9ments. Comment puis-je proc\u00e9der ?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>UN:<\/strong> Pour modifier les positions des \u00e9l\u00e9ments, v\u00e9rifiez le <code>main.css<\/code> fichier et modifier le <code>haut<\/code>, <code>gauche<\/code>, <code>droite<\/code>, ou <code>bas<\/code> propri\u00e9t\u00e9s des \u00e9l\u00e9ments que vous souhaitez. Soyez prudent et lisez les informations sur le positionnement absolu dans CSS. Par exemple, pour positionner un \u00e9l\u00e9ment en bas, utilisez le <code>BAS<\/code> propri\u00e9t\u00e9 au lieu de <code>HAUT<\/code>.<\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>Trew HUD est une ressource FiveM HUD abandonn\u00e9e dont les notes archiv\u00e9es couvrent l'ID du joueur, le code postal, l'argent, le travail, les affichages de faim et de soif.<\/p>","protected":false},"author":1,"featured_media":145732,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2297,2330,2877,2298],"tags":[2858,3001,2928,3000,2859],"class_list":["post-145731","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-free","category-hud","category-free-fivem-job-scripts","category-scripts","tag-esx","tag-fivem-script","tag-free","tag-free-script","tag-qbcore"],"_links":{"self":[{"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/posts\/145731","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/comments?post=145731"}],"version-history":[{"count":2,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/posts\/145731\/revisions"}],"predecessor-version":[{"id":214564,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/posts\/145731\/revisions\/214564"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/media\/145732"}],"wp:attachment":[{"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/media?parent=145731"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/categories?post=145731"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fivemx.com\/fr\/wp-json\/wp\/v2\/tags?post=145731"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}