Skip to content

Latest commit

 

History

History
71 lines (56 loc) · 4.98 KB

theme-helper.md

File metadata and controls

71 lines (56 loc) · 4.98 KB
title page_title description slug tags published position
Theme Helper
Theme Helper
The UI for WPF suite comes with a theming helper class which you can use to bring the theming of your application to a next level.
styling-appearance-theme-helper
theming,theme,helper
true
5

Theme Helper

The ThemeHelper class allows you to directly modify the appearance of a specific basic control without the need to alter its control template.

The class contains the following list of dependency properties, which can be set directly in XAML:

  • MouseOverBrush—Can be used to set the value of the border Brush applied when the mouse is over the control.
  • MouseOverBackgroundBrush—Can be used to set the value of the background Brush applied when the mouse is over the control.
  • PressedBrush—Can be used to set the value of the border Brush applied when the control is pressed.
  • PressedBackgroundBrush—Can be used to set the value of the background Brush applied when the control is pressed.
  • CheckedBrush—Can be used to set the value of the border Brush applied when the element is in Checked state. It will have effect when used on elements that expose a "checked" state (ToggleButton, RadListBoxItem, etc.)
  • CheckedBackgroundBrush—Can be used to set the value of the background Brush applied when the element is in Checked state.
  • FocusBrush—Can be used to set the value of the border Brush applied when the element is focused.
  • FocusBackgroundBrush—Can be used to set the value of the background Brush applied when the element is focused.
  • ReadOnlyBrush—Can be used to set the value of the border Brush applied when the control is in its read-only state (if such is available for it).
  • ReadOnlyBackgroundBrush—Can be used to set the value of the background Brush applied when the control is in its read-only state (if such is available for it).
  • DisabledBrush—Can be used to set the value of the border Brush applied when the control is in its disabled state.
  • DisabledForegroundBrush—Can be used to set the value of the foreground Brush applied when the control is in its disabled state.
  • DisabledBackgroundBrush—Can be used to set the value of the background Brush applied when the control is in its disabled state.
  • ScrollBarsMode—Can be used to set the mode of the scrollbars of a ScrollViewer. This mode takes effect for themes like Fluent and Crystal, which by design have thin scrollbars that expand their size on MouseOver.
  • FocusVisualMargin—Sets a margin for the focus visual element.
  • CornerRadius—Can be used to set the corner radius of commonly used basic controls that could need corner radius customizations but don't expose such property by default (e.g. Button, RepeatButton, ListBox, RadComboBox, etc.)

important The ThemeHelper class currently works out-of-the-box with the Windows 11, Office2019, VisualStudio2019, Crystal, Fluent, and Material themes. Please note that not all properties will work for any given control at the moment. To see which properties are fully supported for a specific control, please check its [ControlTemplate]({%slug styling-apperance-editing-control-templates%}).

How to Use the Theme Helper?

It only takes a few simple steps:

  • Declare the namespace for the theming helpers.
  • Set any of the above listed properties directly to the desired control.
  • If you need to apply it to a several (or a lot of) control instances, we recommend creating implicit styles.

The next examples show how to apply these steps to modify the brushes for the different states of a RadToggleButton through the ThemeHelper class:

[XAML] Declare a SolidColorBrush to use as a StaticResource

{{region styling-appearance-theme-helper-1}} {{endregion}}

[XAML] Set RadToggleButton's visual appearance through the ThemeHelper class

{{region styling-appearance-theme-helper-2}} <telerik:RadToggleButton Content="RadButton" Margin="10" xmlns:helpers="clr-namespace:Telerik.Windows.Controls.Theming.Helpers;assembly=Telerik.Windows.Controls" helpers:ThemeHelper.MouseOverBrush="LightGoldenrodYellow" helpers:ThemeHelper.PressedBrush="{telerik:VisualStudio2019Resource ResourceKey=ValidationBrush}" helpers:ThemeHelper.CheckedBrush="{StaticResource MyCheckedBrush}"/> {{endregion}}

Appearance of the RadToggleButton in the different states

RadToggleButton States

See Also

  • [Setting a Theme (Using Implicit Styles)]({%slug styling-apperance-implicit-styles-overview%})
  • [Style Manager]({%slug common-styling-apperance-setting-theme-wpf%})
  • [Themes Suite]({%slug common-styling-appearance-available-themes%})
  • [VisualStudio2019 Theme]({%slug common-styling-appearance-visualstudio2019-theme%})
  • [Material Theme]({%slug common-styling-appearance-material-theme%})