Asset Layers

Asset layers are the things that display textures or text. They combine together to create assets.
Alignment
Whether the layer should align on the right, left, or center. The default alignment is right.
Alignment Types
Right
Left
Center
align: center
Outlined
This is either true or false if you want to have the layers outlined. This option only works on 1.19+.
outlined: true
Offset
If you would like to move a layer around relative to the other layers you would set the offset. Offset works through pixel perfect adjustments.
offset:
    x: -5
    y: 2
In this example, the layer would be moved to the left 5 pixels and up 2 pixels.
Texture Layer
This layer is used when you have a texture that you want to display.
Texture
Put the texture you would want to use in the HappyHud/textures directory and then input the path.
Scale
This is a decimal number determining the scale you would like to display. The default scale is 1.
scale: 1.5 #Scales the image up 1.5 times.
scale:
 x: 1.2 #Scales the x axis by 1.2 times.
 y: 0.5 #Scales the y axis by 0.5 times.
Color
You can use a named color such as "white" which will not change the color at all or use any hex code, such as "#ffbb00". You can find hex codes via a color picker found here.​
color: "#ffbb00"
Static Texture Layer
This layer is used when you just want to place an unchanging texture. The only parameters are the texture path, color, and the offset.
Layer Example
outline:
  texture:
    path: assets/vanilla/exp_bar_short_outline.png
  align: right
  outlined: false
  color: white
  offset:
    x: 0
    y: 0
Functional Texture Layer
This layer is used when you would like to display a segmented texture that is linked to a listener, such as a progress bar.
Listener
Listeners control what stage of increment this layer will display at the time being. You can read more about Listeners here.​
function:
    listener: health
Increment
The increment is the amount of sections your layer should split into.
function:
    increment: 13
Orientation
The way the layer should deplete from. Can either be Horizontal or Vertical.
function:
    orientation: horizontal
Reversed
Whether or not the layer should deplete the other way. This option defaults to false.
function:
    reversed: true
Layer Example
fill:
  texture:
    path: assets/vanilla/exp_bar_short_fill.png
  align: right
  outlined: false
  color: "#f23a3a"
  offset:
    x: 0
    y: 0
  function:
    listener: health
    increment: 13
    orientation: horizontal
    reversed: false
Text Layer
Text
The text that you want to display. This supports PlaceholderAPI placeholders as well as custom ones shown below.
Placeholder
Description
%{layer-key}-value%
The value of the defined layer's listener.
%{layer-key}-max%
The max of the defined layer's listener.
%{layer-key}-percent%
The percent of the defined layer's listener.
Font
The font that the text should be rendered in. You can read more about fonts here.​
font: "default-unicode"
Layer Example
text:
  text: "%fill-value%/%fill-max%"
  font: "default"
  align: center
  outlined: true
  offset:
    x: 10
    y: 2

Alignment Types
Right
Left
Center

Placeholder	Description
`%{layer-key}-value%`	The value of the defined layer's listener.
`%{layer-key}-max%`	The max of the defined layer's listener.
`%{layer-key}-percent%`	The percent of the defined layer's listener.

Last modified 1mo ago