SkinSetTheme - ProGUI Reference Manual

Syntax

Success = SkinSetTheme(ThemeName$, Skin=#Null)

Description

Sets the active theme for the specified skin. This determines which theme-specific rules (e.g., rules defined with a "dark:" prefix) will be applied during style resolution.

Parameters

ThemeName$
The name of the theme to activate (e.g., "dark", "contrast"). An empty string ("") activates the base (default) theme, meaning only rules without a theme prefix will be primarily considered.

Skin (optional)
The handle of the skin object whose theme should be set. If #Null, the current default skin is modified. Default is #Null.

Return Value

Returns #True if the theme was successfully set, or #False if the skin handle was invalid.

Remarks

Changing the active theme invalidates the internal skin cache for all widgets using that skin, potentially triggering redraws to reflect the changes visually across the application. Theme names are typically derived from the filenames of the `.css` files loaded for the skin (e.g., `dark.css` corresponds to the "dark" theme).

Example

IncludeFile "ProGUI_PB.pbi"

StartProGUI()

; Define base style (Light Theme)
SkinSetValue("window-client", "", "", "background", "white")
SkinSetValue("button", "", "", "background-color", "#E1E1E1")
SkinSetValue("button", "", "", "color", "black")
SkinSetValue("button", "", "", "border", "solid 1px #ADADAD")
SkinSetValue("button", "hover", "", "background-color", "#E5F1FB")

; Define style for "dark" theme using the "dark:" prefix
SkinSetValue("dark:window-client", "", "", "background", "#202020")
SkinSetValue("dark:button", "", "", "background-color", "#333333")
SkinSetValue("dark:button", "", "", "color", "white")
SkinSetValue("dark:button", "", "", "border", "solid 1px #555555")
SkinSetValue("dark:button", "hover", "", "background-color", "#444444")

; Add smooth transitions for the background and text color
SkinSetValue("window-client", "", "", "transition", "background 0.5s ease")
SkinSetValue("button", "", "", "transition", "background-color 0.5s ease, color 0.5s ease")

; Action handler for the button
Procedure ToggleThemeHandler(Widget, EventType, *EventData, *UserData)
  If SkinGetTheme() = "dark"
    SkinSetTheme("")     ; Switch to default (light) theme
    Debug "Theme set to: Default (Light)"
  Else
    SkinSetTheme("dark") ; Switch to dark theme
    Debug "Theme set to: Dark"
  EndIf
EndProcedure

; Create window with Flex layout to center the button
MyWindow = CreateWindow(0, 0, 300, 200, "Theme Toggle Example", #PG_Window_Default | #PG_Window_LayoutFlex)
LayoutFlexSetDirection(#Null, #PG_Flex_Direction_Column)
LayoutFlexSetAlignItems(#Null, #PG_Flex_AlignItems_Center)
LayoutFlexSetJustify(#Null, #PG_Flex_Justify_Center)

If MyWindow
  ; Create a button to toggle the theme
  ToggleBtn = CreateButton(0, 0, 150, 40, "Toggle Theme")
  AddEventHandler(ToggleBtn, #PG_Event_Action, @ToggleThemeHandler())
  
  WindowShow(MyWindow, #True, #PG_WindowShow_ScreenCentered)
  
  Repeat
    Event = WaitWindowEvent()
  Until Event = #PB_Event_CloseWindow
EndIf

StopProGUI()

Supported OS

Windows, Linux