Skip to main content

Labeled Slider

  • Step Size
  • Min Value
  • max Value
  • Label Style - Common Text Style
  • Label Width
  • Label Height
  • Slider Style

BoundBtn_ActionButton_KSyn -Button Style Btn_ButtonBase_KSyn -Style -Text -Height -override Width -Width -Text Style -Text Style Hovered Btn_ResolutionButton_KSyn CUI_CheckBoxText_KSyn

  • Label Text
  • Height
  • Width
  • Check Box Style CUI_LabeledCheckBox_KSyn -Label Text

Labeled Slider (Common UI)

A compact label + slider widget for numeric settings (e.g., volume, brightness). Left side: text label. Right side: slider.

  • Widget class: WBP_LabeledSlider (name may vary)
  • Use for: 0–1 or bounded float values with a visible label
  • Navigation: Fully focusable; supports keyboard/gamepad/Mouse

Quick Use

  1. Drop Labeled Slider into your settings screen.
  2. Set is Variable
  3. Set Label Text and the value range (Min/Max).
  4. Set Step Size so left/right adjusts predictably.
  5. Bind On Slider Value Changed to apply your setting.
  6. Initilize slider position when the UI is activated, or the value changes.

Properties

  • Min Value (float)
    Lowest allowed value. The result is clamped to this.

  • Max Value (float)
    Highest allowed value. The result is clamped to this.

  • Step Size (float)
    Increment used for keyboard/gamepad nudging (and snapping while dragging).
    Tip: Choose a step that divides the range cleanly (e.g., 0.05 for 0–1).

  • Label Style (Common Text Style asset)
    Controls label font, size, color (e.g., UI/Styles/Text/TS_Label).

  • Label Width (number, px; 0 = auto)
    Fixed width for the label column. Use to align multiple rows.

  • Label Height (number, px; 0 = auto)
    Fixed height if you need a uniform row height.

  • Slider Style (Slate Widget Style asset: FSliderStyle)
    Controls thumb/track visuals (e.g., UI/Styles/Slider/SWS_Default).

Note: Styles are assets; swap them to re-skin without editing the widget.


Events

  • On Value Changed (float NewValue)
    Fires continuously while dragging or nudging. Use for live preview only.

  • On Value Committed (float NewValue)
    Fires when the user finishes adjusting (mouse release / gamepad confirm).
    Use this to save/apply settings.


  • 0–1 settings: Min=0.0, Max=1.0, Step=0.05 (or 0.01 for finer control).
  • Percent display: Store 0–1 internally; display Value * 100 with %.
  • Alignment: Give all labeled sliders the same Label Width for tidy columns.
  • Accessibility: Ensure label text clearly states the setting (e.g., Music Volume).

Example (Volume)

  • Label: Music Volume
  • Min/Max: 0.01.0
  • Step: 0.05
  • On Value Changed: Update preview volume
  • On Value Committed: Save to user settings, persist across levels

Troubleshooting

  • Value “jumps” on commit: Choose a Step Size that divides the range cleanly.
  • Label wraps/clips: Increase Label Width or shorten the label.
  • Slider visuals not changing: Point Slider Style to the desired style asset.
  • Gamepad left/right too slow/fast: Adjust Step Size.