Editing Interface modding (section)

=== Element Attributes ===
These are the attributes mentioned in the table above, and their functions when used properly.
{| class="wikitable sortable"
!Attribute
!Required
!Description
!Value(s)
!Default State
! style="min-width:335px;"| Example
|-
| name
| '''Yes'''
| Name of element. Must be unique in its sibling group.
| Text
|
| name = "planet_view"
|-
| position
| No
| Position of element, relative to parent.
| [x] [y]
| 0
| position = { x = 100 y = -50 }
|-
| size
| No
| Size of element. Do note that some elements use width and height, whilst others use x and y. There are 4 different types of values that can manipulate the size, but x/y elements only supports positive integers.
*<code>height = 100</code> is the standard static value.
*<code>height = 100%</code> is relative to parent size.
*<code>height = 100%%</code> is relative to parent size, minus this element's <code>position</code>.
*<code>height = -10</code> is relative to parent size, minus this element's <code>position</code> and the specified value.
| [width] [height] or [x] [y] (Depends on the element type)
| 0
| size = { width = 850 height = 890 }
|-
| moveable
| No
| If element is movable. Requires the background attribute.
| yes or no
| no
| moveable = yes
|-
| clipping
| No
| If content should clip if outside size limits.
| yes or no
| no
| clipping = yes
|-
| orientation
| No
| Anchor point of element, relative to parent element. Use <code>origo</code> to define the reference point.
| upper_left, upper_right, lower_left, lower_right, center, center_up, center_down
| upper_left
| orientation = lower_right
|-
| origo
| No
| Reference point for element's anchor point when using orientation.
| upper_left, upper_right, lower_left, lower_right, center, center_up, center_down
| upper_left
| origo = center_up
|-
| alwaysTransparent
| No
| Toggles if element should be transparent towards mouse over focus. This helps with tooltip focus on larger elements or backgrounds.
| yes or no
| no
| alwaysTransparent = yes
|-
| background
| No
| Background of element. Has its own attributes.
| [name] [position] [quadTextureSprite or spriteType] [alwaysTransparent]
|
|
 background = {
 	name = "background"
 	position = { x = 0 y = 0 }
 	spriteType = "GFX_tiles_frame"
 	alwaysTransparent = yes
 }
|-
| spriteType
| No
| Defines the element's background graphics.
| Valid reference
|
| spriteType = "GFX_tiles_frame"
|-
| quadTextureSprite
| No
| Defines the element's background graphics.
| Valid reference
|
| quadTextureSprite = "GFX_tiled_window_transparent"
|-
| frame
| No
| Defines if element should use a specific frame from the graphical element.
| Number
| 1
| frame = 3
|-
| scale
| No
| Scales the element relative to the full size.
| Number
| 1
| scale = 0.75
|-
| pdx_tooltip
| No
| Adds a hoverable tooltip, which supports localisation references.
| Text or valid reference
|
| pdx_tooltip = "my_tooltip"
|-
| pdx_tooltip_delayed
| No
| Defines the delayed text in tooltips, which is displayed below <code>pdx_tooltip</code>, separated by a horizontal dash line.
| Text or valid reference
|
| pdx_tooltip_delayed = "my_delayed_tooltip"
|-
| pdx_tooltip_anchor_offset
| No
| Defines if the tooltip position relative to the mousepointer.
| [x] [y]
| 0
| pdx_tooltip_anchor_offset = { x = 25 y = 25 }
|-
| pdx_tooltip_anchor_orientation
| No
| Defines the anchor point for the tooltip, similar to the <code>orientation</code> attribute.
| upper_left, upper_right, lower_left, lower_right, center, center_up, center_down
| upper_left
| pdx_tooltip_anchor_orientation = lower_left
|-
| font
| No
| Specifies the font style, usually <code>cg_16b</code> for normal text or <code>malgun_goth_24</code> for headers.
| Valid reference
|
| font = "cg_16b"
|-
| buttonFont
| No
| Specifies the font style for <code>buttonType</code> elements, usually <code>cg_16b</code> for normal text or <code>malgun_goth_24</code> for headers. List of default fonts are located in <code>/interface/fonts.gfx</code>.
| Valid reference
|
| font = "malgun_goth_24"
|-
| text
| No
| Defines the displayed text for the element, which supports localisation references.
| Text or valid reference
|
| text = "my_text"
|-
| buttonText
| No
| Defines the displayed text for <code>buttonType</code> elements, which supports localisation references.
| Text or valid reference
|
| buttonText = "my_text"
|-
| appendText
| No
| Adds text to the end of <code>text</code> attribute.
| Text or valid reference
|
| appendText = "my_text"
|-
| oversound
| No
| Defines if a sound should be played when mousepointer hovers over.
| Valid reference
|
| oversound = mouse_over
|-
| clicksound
| No
| Defines if a sound should be played when clicking the element.
| Valid reference
|
| clicksound = "tab_click"
|-
| show_sound
| No
| Defines if a sound should be played when the window is opened.
| Valid reference
|
| show_sound = "select_starbase"
|-
| shortcut
| No
| Attaches a keyboard shortcut to the element. There's no limit on the amount of combinations, but special letters and symbols will display as a question mark in the tooltip. The supported buttons can be located in <code>/Stellaris/gfx/keyicons</code>
| Key stroke(s)
|
| shortcut = "ALT+F4"
|-
| maxWidth
| No
| Specifies max width of element.
| Number
|
| maxWidth = 250
|-
| maxHeight
| No
| Specifies max height of element.
| Number
|
| maxHeight = 285
|-
| fixedSize
| No
| Specifies if text element size is fixed to max size limitations, or should increase with text content.
| yes or no
| no
| fixedSize = yes
|-
| format (text & buttons)
| No
| Specifies horizontal text alignment
| left, right or center
| left
| format = center
|-
| vertical_alignment
| No
| Specifies vertical text alignment
| top, center or bottom
| top
| vertical_alignment = bottom
|-
| text_color_code
| No
| Specifies the color for the text. List of default colors are located in <code>/interface/fonts.gfx</code>, but can also be found on the [[Localisation modding#Color Codes|Localisation Page]]
| Valid reference
|
| text_color_code = "M"
|-
| tooltip_mode_enabled
| No
| ?
| yes or no
| ?
| tooltip_mode_enabled = yes
|-
| show_position
| No
| Used with <code>hide_position</code> to animate the window transition when it opens.
| [x] [y]
| 0
| show_position = { x = -260 y = -76 }
|-
| hide_position
| No
| Used with <code>show_position</code> to animate the window transition when it closes.
| [x] [y]
| 0
| show_position = { x = -260 y = -76 }
|-
| animation_time
| No
| Specifies how long the transition animation should take.
| Number
| 0
| animation_time = 200
|-
| animation_type
| No
| Specifies what type of animation should be used when transitioning the window element.
| accelerated, decelerated, linear, smoothstep, smoothstep
|
| animation_type = decelerated
|-
| borderSize
| No
| Adds a padding inside the element border and the content.
| [x] [y]
| 0
| borderSize = { x = 10 y = 10 }
|-
| spacing
| No
| Specifies if child elements should have space between them.
| Number
| 0
| spacing = 5
|-
| offset
| No
| Specifies the scrollbar position, relative to its original one.
| [x] [y]
| 0
| offset = { x = -5 y = 10 }
|-
| defaultSelection
| No
| ⁇
| yes or no
| no
| defaultSelection = yes
|-
| priority
| No
| ⁇
| Number
| 0
| priority = 100
|-
| autohide_scrollbar
| No
| Specifies if the scrollbar should always be visible, or only when the content exceeds the size constraints.
| yes or no
| yes
| autohide_scrollbar = yes
|-
| slotsize
| No
| Specifies the size of each slot in <code>gridBoxType</code>.
| [width] [height]
| 0
| slotsize = { width = 100 height = 120 }
|-
| format (gridBox)
| No
| Specifies the starting point for the grid items.
| UPPER_LEFT, UPPER_RIGHT, LOWER_LEFT, CENTER_UP
| CENTER_UP
| format = "UPPER_RIGHT"
|-
| add_horizontal
| No
| Specifies if the grid items should be added horizontally or vertically.
| yes or no
| no
| add_horizontal = yes
|-
| max_slots_horizontal
| No
| Specifies the maximum horizontal length of the grid.
| Number
|
| max_slots_horizontal = 4
|-
| max_slots_vertical
| No
| Specifies the maximum vertical length of the grid.
| Number
|
| max_slots_vertical = 9
|-
| web_link
| No
| Specifies if clicking the button should open up the integrated web browser with the URL
| Valid URL string
|
| <nowiki>web_link = "https://stellaris.paradoxwikis.com/Stellaris_Wiki"</nowiki>
|-
| rotation
| No
| Rotates the element relative to its initial position using the [[wikipedia:radian|radian]] unit.
| Number (radian)
| 0
| rotation = 3.14159
|-
| centerPosition
| No
| Specifies if the iconType element should be centered relative to its position. Best used with <code>orientation = center_up / center_down</code>
| yes or no
| no
| centerPosition = yes
|-
| margin
| No
| Specifies if the element should have a margin between the size constraints and the internal content.
| [top] [bottom] [left] [right]
| 0
| margin = { top = 1 bottom = 2 left = 3 right = 4}
|-
| click_to_front
| No
| Places the window above anything else when clicked by the mouse pointer.
| yes or no
| no
| click_to_front = yes
|-
| allow_multi_line
| No
| Defines if the <code>editBoxType</code> element should have multiple lines.
| yes or no
| no
| allow_multi_line = yes
|-
| max_characters
| No
| Sets a character limit to a <code>editBoxType</code> element.
| Number
| 
| max_characters = 1000
|-
| limited_height
| No
| Limits the height of a <code>instantTextBoxType</code> element according to the character limit.
| yes or no
| no
| limited_height = yes
|-
| dynamic_extra_height
| No
| Added in [[Patch 3.2]], this defines if the element should dynamically resize itself according to the available height, relative to its parent. Note, requires activation through the [[Defines|defines]], by changing <code>GUI_EXTRA_HEIGHT_MAX</code> to a fixed pixel number, as this is set to 0 by default.
| Number (decimal)
| 0
| dynamic_extra_height = 0.5
|-
| dynamic_extra_height_max
| No
| Specifies the maximum height in pixels the element can grow with <code>dynamic_extra_height</code>.
| Number
| 
| dynamic_extra_height_max = 1000
|-
| dynamic_extra_y
| No
| Moves the element vertically depending on available height, relative to its parent.
| Number (decimal)
| 0
| dynamic_extra_y = 0.25
|-
| dynamic_extra_y_max
| No
| Specifies the maximum distance the element can move in pixels with <code>dynamic_extra_y</code>.
| Number
| 0
| dynamic_extra_y_max = 200
|}