Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Collapse]WinForms Controls
  Prerequisites
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Chart Control
  [Collapse]Diagrams
    Getting Started
   [Expand]Diagram Designer
    Diagram Control
   [Expand]End-User Interaction
   [Expand]Diagram Items
   [Expand]Automatic Layout
   [Expand]Data Binding Functionality
    Themes and Styles
    Printing and Exporting
    Saving and Loading Diagrams
   [Expand]Examples
  [Expand]Gauges
  [Expand]Map Control
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]Printing-Exporting
  [Expand]PDF Viewer
   Reporting
  [Expand]Snap
  [Expand]TreeMap Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Themes and Styles

Expanded Overview

Diagram themes are predefined sets of diagram item styles that can be applied to a diagram in a single click. Each theme consists of font settings and a set of styles that can be applied to individual diagram items. Styles are a combination of background, foreground and stroke colors used to paint an item.

Diagram themes are encapsulated by DiagramTheme class objects. The ThemeRegistrator static class provides methods to manage the collection of themes.

The DevExpress.Diagram.Core.DiagramThemeColorId enumeration stores identifiers of theme colors. The DiagramTheme.ColorPalette property provides access to the theme's color scheme.

The DiagramTheme.EffectCollection property provides access to the collection of effects that defines how colors are used in the theme. It returns an object of the DiagramEffectCollection type that has the following properties:

  • DiagramEffectCollection.ThemeEffects - Provides access to the collection of effects that can be applied to shapes and are displayed in the "Theme Styles" ribbon group. This collection contains exactly six elements.
  • DiagramEffectCollection.VariantEffects - Provides access to the collection of effects that can be applied to shapes and are displayed in the "Variant Styles" ribbon group. This collection contains exactly four elements.
  • DiagramEffectCollection.ConnectorEffects - Provides access to the collection of effects that can be applied to connectors. This collection contains exactly three elements.

Item styles are encapsulated by DiagramItemStyle class objects.

The DiagramItem.ThemeStyleId property value identifies the style applied to the item. Identifiers for available shape and connector styles are stored in the DevExpress.Diagram.Core.DiagramShapeStyleId and DevExpress.Diagram.Core.DiagramConnectorStyleId classes correspondingly.

Expanded Applying Themes and Styles

End-users can apply a theme by selecting it in the Ribbon's Themes group on the Design page. The Shape styles group on the Home page allows end-users to apply styles to the selected items.

To apply a theme in code, use the DiagramOptionsView.Theme property. The DevExpress.Diagram.Core.DiagramThemes static class contains themes that are available by default. The ThemeRegistrator.Themes collection stores currently registered themes.

How would you rate this topic?​​​​​​​