Configuring UI Appearance with Themes
Note that configurable colors currently apply to most areas of DBM, but not all parts of the entry mask, as entry mask embellishment is still in progress.
About Themes
Most colors and other UI appearance parameters are bundled in so-called Themes.
There are some legacy color configurations, which have been extended for Theme support. These are documented at Other Color Parameters page and can be changed from e.g. settings dialog.
Themes (as described below) are only configurable by administrators via Parameters and cannot be changed within DBM user interface nor settings dialog.
The concept and many parameter names are identical with Audio Editor themes.
Current and available Themes
Note: In the parameters, "themes" are usually named "UIScheme(s)", because that was the original term used for the concept.
Themes are configured at |DBM|UISchemes|<NameOfTheme>| or |Common|UISchemes|<NameOfTheme>| folder. All keys and there meaning see below.
In addition there exist currently two predefined themes, which is part of DBM software and is not reflected in the parameters. These are the current DBM light and dark theme, and are called "UIScheme_light" and "UIScheme_dark".
Following parameters located in |DBM|UISchemes| allow to configure which themes are available for a user and which one is current
Parameter name | Description |
---|---|
UISchemes_available | Defines a list of available themes, which are provided at "View" menu under "Theme". List entries are separated by pipe '|' characters. Each entry contains the name of an UI scheme folder (a subfolder to DBM\UISchemes) and an optional name to be displayed in the menu to follow the internal name after an equals sign. Example: UIScheme Light Contrast=Light + Contrast|UIScheme_dark=Dark Default is empty, which means no "Theme" entry appears in the menu. Note the space for available themes in the menu is limited to 10. |
UIScheme_current | Defines the currently active theme (user option) Default entry: UIScheme_light |
All parameters inside the theme have programmatic defaults, which apply to the light theme. In difference to the audio editors, these are not written to registry if not found.
As a free add-on included in the DBM distribution, you can find all colors used by several themes in the "ParExamples" folder. The themes include the current default light and dark themes, which can be used as a base for your own modified themes.
Parameters within each single Theme
Parameter Location Priority
Each parameter inside a theme is read from different locations following this priority:
- First from user, then local, then global.
- If not found in these folder below |DBM|UISchemes|<NameOfTheme>|,
- then they are looked up in folder below |Common|UISchemes|<NameOfTheme>|, again applying the same location priority (user, local, global).
That means a theme parameter default can be defined across applications as it is applied to DPE or other applications. Or a theme parameter parameter can be set on global level to set a default for all DBM installations. If requested, this can be overridden on local and again on user level. So user beats local; local beats global; global beats the default documented in provided ParExamples.
This applies to each single parameter, so a single one can be overridden for the user, but the others remain on global default, etc.
Naming Conventions
There's some conventions for naming parameters inside a theme. These are no hard rules, but more likely nice to have conventions. Anyway this helps guessing or finding a parameter and naming new ones.
- All color parameters are prefixed “Color_”.
- All parameters applying to a type of UI element begin with the type (e.g. “Color_”), followed by the UI element type and underscore (e.g. “Color_Tab_Inactive”).
- All parameters applying to special instances of a UI elements begin with the type (e.g. “Color_”), followed by the UI element type and the special instance without underscore (e.g. “Color_TabEasyTrack”).
- Very specific parameters use the type prefix followed by the specific element (e.g. “Color_VUMeterPhaseIndicator”).
- Different states or variants of an element can be distinguished by a prefix with underscore and the state (e.g. “Color_Text_InverseDimmed”). Combinations usually leave one underscore (e.g. “Color_Button_Def_SymbolChecked”).
Coloring class icons
See Color_Symbol_Class_<class> parameter as described in table below.
By default all class icons are dark grey: RGB(92, 92, 92)
Coloring toolbar buttons
If you want to colorize custom toolbar buttons, please read Configuring Custom Actions.
Toolbar buttons can be configure in 2 ways:
- individually per Button with Color_Button_Toolbar_name parameter where name is the name of the button
- per Button group with Color_Button_Toolbargroup_groupname parameter where groupname is the name of the button group
More details see in the list below.
As all color parameters, both Color_Button_Toolbar_name and Color_Button_Toolbargroup_groupname parameters can be defined for a USER, for a workstation (LOCAL), or for everyone (GLOBAL). LOCAL settings override GLOBAL settings, and USER settings override both LOCAL and GLOBAL settings.
Whereas a single button configuration (Color_Button_Toolbar_name ) overrides group color configuration (Color_Button_Toolbargroup_groupname ).
Color Parameters
The format of color values can be any of the ones listed in Color codes in Digas Parameters.
Theme Parameters
Annotations
- Button "shape" means the surface behind the button's symbol graphics.
- Button "shape mask" is a background behind the shape, which deals to make a complete coloring and covering of background.
- The format of color values can be any of the ones listed in Color codes in Digas Parameters. Mind that colors with alpha value are only supported where documented in the following table.
- For some parameters alpha values are supported or recommended (noted in the table below by a "RGBA" value). Alpha means an opacity value in addition to a color. Use web standard rgba(r, g, b, a) syntax, where a is a floating point value between 0 (completely transparent) and 1 (completely opaque). If there is a rgb value configured where a rgba would be supported, the default value is applied as if there would be no entry.
Each scheme is located in one parameter folder, which is located below DBM\UISchemes\<foldername>. The content of this folder is a set of parameters as listed below.
Default sets are provided with DBM's ParExamples.
Parameter Type | Element State / Sub-Item Description |
---|---|
Color_Border_RecordMode RGB | Entry mask Border around player/recorder control to indicate an active recording |
Color_Button_Def_ShapeMaskHover RGBA | All buttons Default for shape mask in hover state (usually black or white with alpha) |
Color_Button_Def_SymbolChecked RGB | All buttons Default for checked symbol |
Color_Button_Def_SymbolChecked_Deviating RGB | All buttons Default for checked symbol where checked shape is deviating from standard (usually applied to the buttons with special color) |
Color_Button_Def_SymbolCheckedDisabled RGB | All buttons Default for symbol when checked and disabled at the same time |
Color_Button_Def_SymbolNormal RGB | All buttons Default for symbol |
Color_Button_DisabledSymbol RGBA | All buttons Color for disabled symbol (usually black or white with alpha) |
Color_Button_FocusBackground RGBA | All buttons Background for focused button (may contain an opacity value different from 1.0) - appears only if focus is configured to be visualized |
Color_Button_ShapelessHover_Blend RGBA | Flat buttons While hovering: Color to blend with background (usually black or white with alpha) |
Color_Button_ShapelessHover_Blend_CaptionRight RGBA | Flat buttons in captions of right panes While hovering: Color to blend with background (usually black or white with alpha) |
Color_Button_ShapelessPushed_Blend RGBA | Flat buttons While pushed: Color to blend with background (usually black or white with alpha) |
Color_Button_ShapelessPushed_Blend_CaptionRight RGBA | Flat buttons in captions of right panes While pushed: Color to blend with background (usually black or white with alpha) |
Color_Button_ShapeNormal RGBA | All buttons Default for shape mask in normal state (usually black or white with alpha or neutral white with 100% alpha) |
Color_Button_Toolbar_ShapelessHover_Blend RGBA | Toolbar buttons While hovering: Color to blend with background (usually black or white with alpha) |
Color_Button_Toolbar_ShapelessPushed_Blend RGBA | Toolbar buttons While pushed: Color to blend with background (usually black or white with alpha) |
Color_Button_Toolbar_<name> RGB | Individual Toolbar buttons Toolbar button color can be configured for each button (e.g. "Color_Button_Toolbar_NewText"). The following button names are here possible for <name>: Group: General
Group: Create
Group: Edit
Group: Schedule
Group: Distribute
Group: Custom Actions
If above color is not defined for any of these Toolbar icons the corresponding Color_Button_Toolbargroup_<groupname> color is applied |
Color_Button_ToolbarGroup_<groupname> RGB | The following button group names are here possible for <groupname>:
Attention: Custom Actions are configured via Configuring Custom Actions directly If above color parameter is not defined for any of these ToolbarButton_groups the global Color_Button_Def_SymbolNormal color is applied |
Color_ButtonBkgnd RGB | Push buttons Background color; since DBM 5.5.8080.0 |
not used in DBM yet |
|
not used in DBM yet |
|
not used in DBM yet |
|
not used in DBM yet |
|
Color_Clip_1 .. Color_Clip_n RGB | Different objects (e.g. customer selection buttons) Clip colors mean a selection of beautiful distinguishable colors (like MTE's clips) Color is derived for some circumstances (selection, hover, etc.) Define Color_Clip_1 up to Color_Clip_n in a continuous sequence. If parameter Color_Clip_1 is defined, no defaults are applied. The amount of clip colors is limited to 99. |
Color_Comment_Background RGB | Table entries For table entries that have a comment, the comment can be displayed in the grid. This parameter controls the background color of the displayed comment. New since version 5.6.8109.0. |
Color_DefaultButton_Background RGB | Push buttons Background of buttons, which are "default buttons". New in DBM 5.6.8142.0 |
Color_DefaultButton_Background_Hover RGB | Push buttons Background for hover state of buttons, which are "default buttons". New in DBM 5.6.8142.0 |
Color_Dialog_Bkgnd RGB | Popup dialogs Background |
Color_FocusBorder RGB | Most UI elements A rectangle with this color is drawn around the focused UI element. Requires enabling through parameter EnableFocusIndication=1 |
Color_GridSelected RGBA | Grids Selection background with focus |
Color_GridSelected_NoFocus RGBA | Grids Selection background without focus |
Color_Line_BarBottom RGBA | Different bar-like items Light edges on bottom of elements: Is complemented with the top edge line of the element below, so this is the upper line of a line pair. (Color with alpha) |
Color_Line_BarTop RGBA | Different bar-like items Light edges on top of elements: See note for Color_Line_BarBottom. (Color with alpha) |
Color_Line_Divider RGB | Divider lines Lines dividing flat buttons and menu entries |
Color_Line_SunkenEdgeBottom RGB | “Hair lines” Visually sunken element’s bottom and right side |
Color_Line_SunkenEdgeTop RGB | “Hair lines” Visually sunken element’s top and left side |
Color_ListBkgnd RGB | Some list controls; drop down areas of combo boxes Color of the background; since DBM 5.5.8080.0 |
Color_ListHeaderBkgnd RGB | List header cells Background color; since DBM 5.5.8080.0 |
Color_LVC_MetersAbove_Current RGB | Loudness meter in entry mask Color of bars above the current value (for LVC.ocx with version 1.0.56.0 or greater) |
Color_Menu_BkgndHighlighted RGB | Main menu Background of main menu's sub menu entry which is being hovered |
Color_Menu_BkgndStandard RGB | Main menu Background of main menu's sub menus which open interactively |
Color_Menu_CheckmarkBkgnd RGB | Main menu Checkmark’s background |
Color_Menu_CheckmarkBkgndHighlighted RGB | Main menu Checkmark’s background while hovering |
Color_MultiRec_TimeLine_Bkgnd RGB | MultiRec player Background of waveform in mini timeline |
Color_MultiRec_TimeLine_Waveform RGB | MultiRec player Waveform in mini timeline |
Color_MultiRec_VuMeter_LedOff RGB | MultiRec player Background of "inactive" area in VU meter |
Color_PageBkgnd RGB | Elements of page dialogs in pop-up dialogs Color of the background; since DBM 5.5.8080.0 |
Color_PaneDivider RGB | Pane dividers Edges between panes which can be dragged by user to change layout |
Color_PaneLeft RGB | Left (collapsible) panes Background |
Color_PaneLeft_Caption RGB | Left (collapsible) panes Caption |
Color_PaneLeft_GridLines RGB | Left (collapsible) panes Grid lines |
Color_PaneRight RGB | Right panes (grids) Background (= grids background) |
Color_PaneRight_Caption RGB | Right panes (grids) Caption |
Color_PaneRight_GridLines RGB | Right panes (grids) Grid lines |
Color_RTF_Bkgnd RGB | RTF text control in entry mask Background |
Color_Scrollbar_ArrowBackground RGB | Scrollbars Background of scroll arrow item (yet not applied on all scrollbars) |
Color_Scrollbar_Background RGB | Scrollbars Background of scroll area (yet not applied on all scrollbars) |
Color_Scrollbar_Edge RGB | Scrollbars Edge lines (yet not applied on all scrollbars) |
Color_Scrollbar_Thumb rgb(140, 140, 140) | Scrollbars Drag handle (yet not applied on all scrollbars) |
Color_Scrollbar_ThumbBottomEdge rgb(100, 100, 100) | Scrollbars Drag handle’s bottom and right edge (yet not applied on all scrollbars) |
Color_Scrollbar_ThumbTopEdge rgb(170, 170, 170) | Scrollbars Drag handle’s top and left edge (yet not applied on all scrollbars) |
Color_TableConnected RGB | Table List Table is connected, default is green |
Color_TableUnconnected RGB | Table List Table is not connected, default is blue |
Color_Signal_Green RGB(58, 145, 62) | Various Color signaling "green" |
Color_Signal_Red RGB(224, 72, 72) | Various Color signaling "red" |
Color_Signal_Yellow RGB(224, 175, 45) | Various Color signaling "yellow" |
Color_Sphere_A rgb(225, 225, 225) | Multiple elements See below |
Color_StatusBar rgb(185, 185, 185) | Status bar Background |
Color_Symbol_Class_<class> RGB(92, 92, 92) | Grids, various Class symbols' color can be configured for each symbol (e.g. "Color_Symbol_Class_Audio"). The following class names are here possible for <class>:
|
Color_Symbol_AudioMode_StereoIndicator RGB | Audio mode symbols In audio modes with stereo (5.0, 5.1, 7.1), the symbols' corners indicate it by this color |
Color_Tab_Inactive RGB | Tab controls Background of inactive (closed) tabs and space next to it |
Color_Tab_Popup_Inactive RGB | Tab controls in popup windows (entry mask, settings, etc.) Background of inactive (closed) tabs and space next to it |
Color_Text_Dimmed RGB | Text Dimmed down text elements |
Color_Text_Disabled RGB | Text Disabled elements |
Color_Text_EntryMissingFiles RGB | Text Elements whose main media file is missing (only used if "Color entries with missing files" is checked in "Easy Selection") |
Color_Text_Highlighted RGB | Text Highlighted elements (e.g. for hover) |
Color_Text_Inverse RGB | Text Inverse text color (light – dark) |
Color_Text_InverseDimmed RGB | Text Inverse dimmed text color (light – dark) |
Color_Text_InverseHighlighted RGB | Text Inverse highlighted text color (light – dark) |
Color_Text_Standard RGB | Text |
Color_Text_1 ... Color_Text_n RGB | Text colors for entry title in main list These colors are available in the color selection boxes on the "Colors" page of the Settings Dialog. Define Color_Text_1 up to Color_Text_n in a continuous sequence. If parameter Color_Clip_1 is defined, no defaults are applied. The amount of colors is limited to 99. |
Color_TextButton_Background_Disabled RGB | Push buttons Background of disabled buttons. New in DBM 5.6.8142.0 |
Color_TextButton_Background_Hover RGB | Push buttons Background of buttons in hover state. New in DBM 5.6.8142.0 |
Color_TextButton_Background_Focus RGB | Push buttons Background of focused buttons. New in DBM 5.6.8142.0 |
Color_TextButton_Border RGB | Push buttons Border of buttons. New in DBM 5.6.8142.0 |
Color_TextButton_Border_Focus RGB | Push buttons Border of focused buttons. New in DBM 5.6.8142.0 |
Color_TextEdit_Bkgnd RGB | Edit controls Background |
Color_TextEdit_ReadOnlyBkgnd RGB | Edit controls, Combo boxes Background in read-only state |
Font_Standard (Font name) | Whole application Font for text in all grids. Be aware that changing the default font may lead to a bigger cell content and may need adjusting of column widths, too. If configured font is not found in the system environment, the default is applied ("Tahoma" for grids and "Segoe UI" for all other elements). |
Further color parameters
There are some legacy color configurations, which have been extended for Theme support.
These are documented at Other Color Parameters page and can also be changed from e.g. settings dialog.
Color Spheres
So-called color spheres are defined to collect independent UI elements which are drawn with the same color. These collections are described in the next paragraphs; the screenshots mark all elements in green which are defined by the specific sphere.
Currently we use only one sphere for DBM as this makes sense only for a set of elements which have the same color by concept.
Color Sphere A
This sphere includes what you see in the picture colored and particularly:
- Menu bar and toolbar background
- Customer Selection Bar background
- Other bars' background (where no special definition exists)
- Thumbnail image tooltip: Caption, border