Skip to content

GitLab

Last edited by Brickgard
Page history

HUD Components

MythicHUD generates two default HUDs (including all textures, assets, and configuration) when its initial folders and files are generated:

  • The default-layout HUD emulates the vanilla hotbar stats of health, armor, hunger, and air, a great example of linking existing stats like health to a MythicHUD.\
  • The sword-layout HUD is an upper-left visual showing a health and mana bar, showing how PlaceholderAPI values such as another plugin's mana stat can be implemented on a HUD.

Hud Components

HUDs are made of a collection of pieces built in configuration layers:

flowchart TD
  A1[Listener] -->|Displays Value| B3[Placeholders]
  A2[Listener] -->|Determines Bar Fill %| B4[Bar Texture]
  B1[Texts] -->|Layers| C1[Asset]
  B2[Icon] --> C1[Asset]
  B3[Placeholders] -->|Stat Value| C1[Asset]
  B4[Bar Fill] --> C1[Asset]
  B5[Bar Back] --> C1[Asset]
  B6[Shadows] -->|Layers| C1[Asset]
  C1[Asset] -->|Elements of| D1[HUD Layout] 
  C2[Asset] -->|e.g. Healthbar| D1[HUD Layout]
  C3[Asset] -->|e.g. Mana bar| D1[HUD Layout]

This looks like a lot, but we'll break each level down!

Listeners

Listeners are what "power" HUDs, bringing in the stats to compare and display. They provide text for functional text placeholders, and provide the numbers to compare to decide how full a stat display bar should be. The default-layout HUD has great examples of this, using some built-in listeners to hook right into some core gameplay stats. The sword-layout HUD shows an example of using a custom listener, mana

Asset Layers

Asset layers are the individual pieces that come together to make a finished asset; things like icons, text, and stat bars. The order of these layers a HUD Asset determines their the order they visually stack in. The first Asset Layers are on top, the lowest/last ones are on the bottom.
This is why the default assets tend to layer as icon > fill > outline, putting the bar's main frame in the back, it's fill before that, and the icon on top. Those asset layers then assemble the finished asset.

Assets

These are the "building blocks" of a HUD layout. Various assets are arranged together to build a HUD. This modular approach allows for various screen and GUI scale sizes of players to move asset layers around the screen proportionally, without rearranging the pieces of those assets.
i.e. The icon and bar Asset Layers of an asset won't separate if a player's screen is wider than another's, but two Assets of a HUD layout may move further apart on a wider screen.

The default-layout is built out of four assets - the health bar, hunger bar, armor bar and oxygen bar. The sword-layout is a single asset positioned in the upper-left of the screen.

HUD Layouts

And finally, the Asset pieces come together to create a HUD! A HUD's layout is built out of Asset elements, arranged based on screen percentages and offsets. This layout is what can be toggled for players in-game to see the various Asset bars, stats and icons all come together! Pop-Ups are assembled the same as Layouts, they just have the feature to be temporarily enabled for a duration, compared to layouts just being a toggle on/off.