Steamscheme.res file structure

From Valve Developer Community
Jump to: navigation, search
English (en)русский (ru)
... Icon-Important.png

Scheme

Colors

In this section is where all of the colors used by the Controls and drawing are defined.

Syntax: "colorname" "r g b a"

Example: "GrayBG" "73 78 73 255"

BaseSettings

Below are all keyvalue definitions that are utilized by controls.

Key name Description

Borders

Border.Bright Lit side of a control
Border.Dark Dark/unlit side of a control
Border.Selection Additional border color for displaying the default/selected button

CheckButton

CheckButton.BgColor
CheckButton.Border1 Left checkbutton border
CheckButton.Border2 Right checkbutton border
CheckButton.Check Color of the check itself

DragDrop

DragDrop.DragFrame
DragDrop.DropFrame

Frame

Frame.ClientInsetX Where to start the title bar (x)
Frame.ClientInsetY Where to start the title bar (y)
Frame.BgColor
Frame.OutOfFocusBgColor
Frame.FocusTransitionEffectTime Time for a window to fade on focus
Frame.TransitionEffectTime Time for a window to fade on open/close.
Frame.AutoSnapRange
Frame.UsesAlphaBlending
FrameTitleBar.Font
FrameTitleBar.SmallFont
FrameSystemButton.Icon Top left corner icon
FrameSystemButton.DisabledIcon Top left corner disabled icon

ListPanel

ListPanel.TextColor
ListPanel.BgColor
ListPanel.SelectedTextColor
ListPanel.SelectedBgColor
ListPanel.SelectedOutOfFocusBgColor
ListPanel.DisabledTextColor
ListPanel.DisabledSelectedTextColor
ListPanel.EmptyListInfoTextColor
ListPanel.RowHeight
ListPanel.PerPixelScrolling

Menu

Menu.TextInset

Panel

Panel.FgColor
Panel.BgColor

PropertySheet

PropertySheet.TransitionEffectTime Time to change from one tab to another
PropertySheet.TabGap

RichText

RichText.InsetX Margin (x)
RichText.InsetY Margin (y)
RichText.TextColor
RichText.BgColor
RichText.SelectedTextColor
RichText.SelectedBgColor

ScrollBar

ScrollBar.Wide

SectionedListPanel

SectionedListPanel.CollapserWidth

TextEntry

TextEntry.CursorColor

GamesList

GamesList.InstalledAppColor
GamesList.NotInstalledAppColor
GamesList.ReadyStatusColor
GamesList.UpdatingStatusColor
GamesList.NotInstalledStatusColor

Controls

A control documented specifies a set of Override Keys in their section listing all of the functioning KeyValues entries for a specific control. What Override Keys do is replace the Base Keys when a specific condition is met. Once the condition is destroyed, the control converts back to the Base Keys.

BaseControls

Panel

Here is a set of Base Keys which help define what controls look like. These keys are inherited by all controls but are only used by some.

Key name Description
textcolor
selectedtextcolor
shadowtextcolor
bgcolor
selectedbgcolor
appearance Border must be defined as a subkey in the Borders KeyValues
image TGA image to be drawn on this control

Button

  • mousedown
  • keyfocus
  • mouseover
  • disabled
  • keyfocus_mouseover
  • defaultbutton
  • defaultbutton_mouseover

CheckButton

  • mousedown
  • selected
  • selected_mouseover
  • selected_mousedown
  • selected_keyfocus
  • selected_keyfocus_mouseover
  • keyfocus
  • keyfocus_mouseover
  • disabled
  • selected_disabled

ComboBox

  • mouseover
  • mousedown
  • keyfocus
  • disabled

ComboBoxButton

  • mouseover
  • disabled

FrameButton

  • mousedown
  • keyfocus
  • outoffocus

FrameTitle

  • outoffocus

FrameBRGripPanel

  • mouseover
  • mousedown
  • disabled

HTMLInterior

  • scrollbar_visible

ListPanelInterior

  • scrollbar_visible

MenuBarItem

  • mouseover
  • mousedown
  • selected

MenuItem

  • mouseover
  • disabled

PageTab

  • mousedown
  • active
  • keyfocus
  • keyfocus_mouseover

PropertySheet

  • topleft
  • topright

RadioButton

  • mousedown
  • selected
  • selected_mouseover
  • selected_mousedown
  • selected_keyfocus
  • selected_keyfocus_mouseover
  • keyfocus
  • keyfocus_mouseover
  • disabled

RichTextInterior

  • scrollbar_visible

ScrollBarSlider

  • slider
  • slider_horiz

ScrollBarButton

  • mouseover
  • mousedown

SectionedListPanelInterior

  • scrollbar_visible

SectionedListPanelItem

  • selected

Slider

  • disabled

TextEntry

  • disabled

ToggleButton

  • mousedown
  • mouseover
  • keyfocus
  • selected
  • selected_mouseover
  • selected_mousedown
  • selected_keyfocus
  • selected_keyfocus_mouseover
  • disabled

WizardSubPanelControls

This Controls section defines property overrides for BaseControls on controls contained inside a wizard.

PropertyPageControls

This Controls section defines property overrides for BaseControls on controls contained inside a PropertyPage.

LayoutTemplates

This describes the default layouts for controls that create and control their own children works just like a normal settings .res file, except only positioning attributes are recognized. Below is a sectioned list of specific control children.

Here's a list of settings that can be added:

  • xpos
  • ypos
  • wide
  • tall
  • AutoResize
  • PinCorner
Note.pngNote:xpos and ypos allow their value to have r prepended to them. With an r, the value will come from the opposite side (e.g. xpos will be set from the right, not left).

Frame

  • frame_menu
  • frame_title
  • frame_captiongrip
  • frame_minimize
  • frame_close
  • frame_brGrip

PropertyDialog

  • sheet
  • ApplyButton
  • CancelButton
  • OKButton

WizardPanel

  • subpanel
  • PrevButton
  • NextButton
  • CancelButton
  • FinishButton

Fonts

This section describes the syntax of a font declaration.

"A"
{
	"1"
	{
		"name"		"B"
		"tall"		"C"
		"weight"	"D"
		"underline"	"E"
		"antialias"	"F"
		"symbol"	"G"
	}
}
A
This is what controls refer to as their font. If you set a Control's font setting to this, it will use the information in this KeyValues set to determine how text will appear.
B
This is the actual name of the font contained in a ttf file. Custom fonts go in the resource folder for the skin.
C
This is the height of the font in pixels. The width will keep the same ratio.
D
The weight is how bold the font will appear.
E
Draw a line under all text including spaces.
F
If set, text edges will be anti-aliased.
G
Set this if the font specified is a symbol font (e.g. Marlett).

Appearances

All borders referenced by the Controls definitions and Controls settings should be defined in this file. A border can be defined as an alias of another border by having the keyname being the border and the value being the other border.

It is necessary to define borders using the following syntax:

	A
	{
		"inset"			"B"
		"backgroundtype"	"C"
		"corner_rounding"	"D"

		render
		{
			E
		}

		render_bg
		{
			E
		}
	}
A
This is the name of the border being defined.
B
This is the margins of the control in format "Left Top Right Bottom".
C
The background type can be 0 for filled background, 1 for textured background, and 2 for solid background with smooth corners.
D
This is the aliased corner rounding size in pixels.
E
See below. The difference between render and render_bg is the order. render_bg is drawn before the control contents, while render is drawn after.

Oldschool Borders

This type of border definition was supported in the original VGUI2 module.

			"inset" "A"
			Right
			{
				B
			}

			Left
			{
				B
			}

			Bottom
			{
				B
			}

			Top
			{
				B
			}
A
This is the inset of contents on this control in the format "x0 y0 x1 y1"
B
In this area goes the following KeyValues set:
				"1"
				{
					"color" "C"
					"offset" "D"
				}
C
This is the reference to a color defined in the Colors section.
D
This is the offset from the edge that the parent KeyValues corresponds to. The format is x y

Draw Procedures

To define a draw procedure, the keyname can be anything, such as "0". For the value, the following function calls are allowed:

  • image
  • fill
  • gradient
  • corner (No longer functions)
  • dashedrect

The draw procedures allow you to set a location in the bordered Control using the x0, x1, y0, and y1 variables.

image

Syntax: "image( Left, Top, Right, Bottom, TGA )"

The TGA parameter should specify a TGA relative to the Steam folder or skins folder without the extension appended.

Example: "image( x0 + 4, y0 + 4, x0 + 20, y0 + 20, resource/borders/ScrollButton_mousedown )"

fill

Syntax: "fill( Left, Top, Right, Bottom, Color )"

Example: "fill( x0 + 1, y0 + 1, x1 - 2, y1 - 1, ClayBG )"

gradient

Syntax: "gradient( Left, Top, Right, Bottom, TopColor, BottomColor )"

Example: "gradient( x0, y1 - 40, x1, y1, LightClayBG, ClaySheetBottom )"

corner

Note.pngNote:This procedure no longer works.

Syntax: "corner( Left, Top, Right, Bottom, Color )"

dashedrect

Syntax: "dashedrect( Left, Top, Right, Bottom, Color )"

Example: "dashedrect( x0 + 3, y0 + 3, x1 - 4, y1 - 2, BorderSelection )"