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:
- Unzip the file or open it directly
- Toss the trew_hud_ui folder into your resources directory
- 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.
PERTANYAAN YANG SERING DIAJUKAN
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!