HUD TREW (qbCore)

Hi all! The best HUD for QBCore is Trew HUD…

What a ride it’s been, diving into the world of GTA5 RP and learning LUA to create the Trew HUD UI! It was an awesome experience, but after facing quite a few hurdles with the FiveM community and the project itself, I’ve made the tough call to stop working on it. It’s been half a year since I last played GTA5 RP, and it just doesn’t make sense to keep this project going anymore.

Check Out the Trew HUD UI in Action

Before we get into the nitty-gritty, take a look at the Trew HUD UI doing its thing:

Pretty cool, right?

What’s Inside the Trew HUD UI?

The Trew HUD UI is packed with features to make your FiveM experience even better:

• Server logo to rep your community
• Job and job grade info
• Money, dirty money, bank, and society (ESX only)
• Health, armor, stamina, hunger, and thirst status
• Speedometer with seatbelt, fuel, lights, gear, alerts, and sirens for emergency vehicles
• Location and time display
• OneSync-ready voice controller
• Weapons UI
• Custom status support

Grabbing the Trew HUD UI

Ready to give the Trew HUD UI a spin? Snag it here:

Download Trew HUD (QBCore/ESX)

Getting the Trew HUD UI Up and Running

Setting up the Trew HUD UI is a breeze. Here’s how:

1. Unzip the file or open it directly
2. Toss the trew_hud_ui folder into your resources directory
3. Add “start trew_hud_ui” to your server.cfg file

If you’re using the ESX version, there are a few extra steps:

• Make sure you have es_extended, esx_society, and esx_addonaccount installed
• Optionally, grab esx_basicneeds, esx_status, and LegacyFuel (start it before trew_hud_ui)
• Turn off the default HUD in es_extended/config.lua by setting Config.EnableHud to false
• Swap out some code in esx_basicneeds/main.lua (check the full instructions for details)

For VRP/VRPEX users, don’t forget to:

• Configure your black money item ID in config.lua

Making the Trew HUD UI Your Own

The Trew HUD UI is super customizable. You can:

• Change the language
• Add your server logo
• Pick a custom font
• Tweak the date format
• Adjust voice, vehicle, and UI settings
• Create custom status indicators (like stress or drunkenness)

And if you’re a streamer, the /toggleui command lets you hide HUD elements on the fly.

PERGUNTAS FREQUENTES

Q: The HUD date is wrong! Can you fix it?

A: The HUD uses the game server’s time, so it’s not wrong. If you want to show the real date, you’ll need to edit app.js using JavaScript’s Date() function.

Q: How can I customize the /toggleui command?

A: To change which elements /toggleui hides, look for the element IDs in the ui.html files, then edit the command in client.lua.

Q: Will you make a version that supports [insert script here]?

A: Probably not, at least for now. LegacyFuel is listed as optional because it changes the fuel system but doesn’t need any special functions to work.

Q: How do I move the HUD elements around?

A: To reposition elements, edit their top, left, right, or bottom properties in main.css. Just be careful and read up on absolute positioning in CSS first!

And there you have it – the Trew HUD UI in a nutshell. It’s been a wild ride, and I’m grateful for everything I’ve learned along the way. Keep on modding, my friends!