Skip to content
DevGeniusCode edited this page Mar 14, 2025 · 1 revision

Slider Control

The Slider control is used for creating sliders that allow users to select a value from a range. There are two types of sliders: horizontal (HORZSLIDER) and vertical (VERTSLIDER). You can define the position, size, and appearance of the slider, and it updates automatically as the user interacts with it.

Available Tags

In addition to the default control tags, the Slider control has the following unique tags:

TagDescription
SLIDERDATADefines specific properties of the slider, such as the minimum and maximum value.
SLIDERTHUMBENABLEDDRAWDATAVisual texture for the slider thumb (handle) when enabled.
SLIDERTHUMBDISABLEDDRAWDATAVisual texture for the slider thumb (handle) when disabled.
SLIDERTHUMBHILITEDRAWDATAVisual texture for the slider thumb (handle) when highlighted.

Default Values and Usage

The following section list the default values and available textures for each tag

SLIDERDATA

  • MINVALUE: The minimum value for the slider (e.g., 10).
  • MAXVALUE: The maximum value for the slider (e.g., 145).

ENABLEDDRAWDATA, DISABLEDDRAWDATA, HILITEDRAWDATA (Track)

  • hilightedbox / dehilightedbox / NoImage
  • linebox/ arrow / NoImage

SLIDERTHUMBENABLEDDRAWDATA, SLIDERTHUMBDISABLEDDRAWDATA, SLIDERTHUMBHILITEDRAWDATA

  • NoImage / NoImage / arrow
  • WindowResizeEnabled / WindowResizeDisabled / WindowResizeHilite
  • WindowResizePushed / NoImage / WindowResizePushed

How it Works

The Slider control consists of the following parts:

  • Track: The track represents the line or area that the thumb moves on.
  • Thumb: The thumb is the interactive handle that the user drags to select a value.

The game automatically updates the visual position of the thumb based on the selected value.

Slider Types

  • Horizontal Slider (HORZSLIDER): The slider moves horizontally.
  • Vertical Slider (VERTSLIDER): The slider moves vertically.

Examples

Click to expand

Horizontal Slider (HORZSLIDER)

Here's an example from the OptionsMenu.wnd file:

WINDOW WINDOWTYPE = HORZSLIDER; SCREENRECT = UPPERLEFT: 160456, BOTTOMRIGHT: 387481, CREATIONRESOLUTION: 800600; NAME = "OptionsMenu.wnd:SliderScrollSpeed"; STATUS = ENABLED+IMAGE+TABSTOP; STYLE = HORZSLIDER+MOUSETRACK; SYSTEMCALLBACK = "[None]"; INPUTCALLBACK = "[None]"; TOOLTIPCALLBACK = "[None]"; DRAWCALLBACK = "[None]"; FONT = NAME: "Times New Roman", SIZE: 14, BOLD: 0; HEADERTEMPLATE = "[None]"; TOOLTIPTEXT = "ToolTip:ScrollSpeed"; TOOLTIPDELAY = -1; TEXTCOLOR = ENABLED: 0000, ENABLEDBORDER: 0000, DISABLED: 0000, DISABLEDBORDER: 0000, HILITE: 0000, HILITEBORDER: 0000; ENABLEDDRAWDATA = IMAGE: NoImage, COLOR: 25500255, BORDERCOLOR: 255128128255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255; DISABLEDDRAWDATA = IMAGE: hilightedbox, COLOR: 128128128255, BORDERCOLOR: 646464255, IMAGE: dehilightedbox, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255; HILITEDRAWDATA = IMAGE: linebox, COLOR: 02550255, BORDERCOLOR: 01280255, IMAGE: arrow, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255; SLIDERDATA = MINVALUE: 10, MAXVALUE: 145; SLIDERTHUMBENABLEDDRAWDATA = IMAGE: NoImage, COLOR: 255128128255, BORDERCOLOR: 25500255, IMAGE: NoImage, COLOR: 128128128255, BORDERCOLOR: 192192192255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255; SLIDERTHUMBDISABLEDDRAWDATA = IMAGE: NoImage, COLOR: 646464255, BORDERCOLOR: 128128128255, IMAGE: NoImage, COLOR: 000255, BORDERCOLOR: 646464255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255; SLIDERTHUMBHILITEDRAWDATA = IMAGE: arrow, COLOR: 02550255, BORDERCOLOR: 128255128255, IMAGE: arrow, COLOR: 00255255, BORDERCOLOR: 128128255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255, IMAGE: NoImage, COLOR: 255255255255, BORDERCOLOR: 255255255255;END

Vertical Slider (VERTSLIDER)

Here's an example from the WOLCustomLobby.wnd file:

WINDOW WINDOWTYPE = VERTSLIDER; SCREENRECT = UPPERLEFT: 24150, BOTTOMRIGHT: 40410, CREATIONRESOLUTION: 800600; NAME = "WOLCustomLobby.wnd:SliderChatAdjust"; STATUS = ENABLED+HIDDEN+IMAGE+TABSTOP; STYLE = VERTSLIDER+MOUSETRACK; SYSTEMCALLBACK = "[None]"; INPUTCALLBACK = "[None]"; TOOLTIPCALLBACK = "[None]"; DRAWCALLBACK = "[None]"; FONT = NAME: "Arial", SIZE: 10, BOLD: 0; HEADERTEMPLATE = "[None]"; TOOLTIPDELAY = -1; TEXTCOLOR = ENABLED: 0000, ENABLEDBORDER: 0000, DISABLED: 0000, DISABLEDBORDER: 0000, HILITE: 0000, HILITEBORDER: 0000; ENABLEDDRAWDATA = IMAGE: NoImage, COLOR: 25500255, BORDERCOLOR: 255128128255, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550; DISABLEDDRAWDATA = IMAGE: NoImage, COLOR: 128128128255, BORDERCOLOR: 646464255, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550; HILITEDRAWDATA = IMAGE: NoImage, COLOR: 02550255, BORDERCOLOR: 01280255, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550; SLIDERDATA = MINVALUE: 0, MAXVALUE: 100; SLIDERTHUMBENABLEDDRAWDATA = IMAGE: WindowResizeEnabled, COLOR: 25500255, BORDERCOLOR: 255128128255, IMAGE: WindowResizePushed, COLOR: 128128128255, BORDERCOLOR: 192192192255, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550; SLIDERTHUMBDISABLEDDRAWDATA = IMAGE: WindowResizeDisabled, COLOR: 646464255, BORDERCOLOR: 128128128255, IMAGE: NoImage, COLOR: 000255, BORDERCOLOR: 646464255, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550; SLIDERTHUMBHILITEDRAWDATA = IMAGE: WindowResizeHilite, COLOR: 02550255, BORDERCOLOR: 128255128255, IMAGE: WindowResizePushed, COLOR: 00255255, BORDERCOLOR: 128128255255, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550, IMAGE: NoImage, COLOR: 2552552550, BORDERCOLOR: 2552552550;END

See also

Category:Controls

Clone this wiki locally