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
  [Collapse]Forms and User Controls
    XtraForm
    Ribbon Form
    Tabbed Form
    XtraUserControl
    Form Assistant
    Taskbar Assistant
   [Expand]Splash Screen Manager
   [Collapse]Adorner UI Manager
     Adorner Guides
   [Expand]Examples
  [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
  [Expand]Diagrams
  [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]ASP.NET Core 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]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Adorner UI Manager

The adorner manager is a component that provides a custom adorner layer - a transparent layer drawn above all UI elements. This layer can be used to draw custom items and visual effects. The following figure illustrates an example. Here, the adorner layer contains the red rectangular element that displays the number of urgent messages above the 'From' column, and circular blue elements above the 'Mail' button and 'Send\Receive' page, which show the total number of new messages.

Expanded Add Adorner Elements

Click the "Edit Elements" link within the manager's smart-tag and utilize the element type selector in the designer that pops up.

You can add adorner elements of three types:

All Adorner elements are bound to the specific control using the AdornerElement.TargetElement property. When the parent UI element for the adorner element is set, you can use the Location property to align the adorner element relative to its parent. Use the Offset property to move the adorner element from this initial position.

To set a container control above the items on which the adorner manager will be able to draw its elements, use the AdornerUIManager.Owner property.

Expanded Badges

Badges are elements of the Badge class that represent simple static information.

If the BadgeDefaultProperties.Image property is not specified, a Badge has a circle shape that can be colorized by modifying the BadgeDefaultProperties.PaintStyle property.

Expanded Validation Hints

Validation hints are objects of the ValidationHint class that apply specific visual effects to their target controls depending on these controls' validation states. Not only a validation hint can be hooked up to a DevExpress control, but to any standard or 3rd party control that supports validation (see the Control.Validating MSDN topic). The figure below illustrates an example.

Controls that support validation have three possible validation states: indeterminate, validated and invalid. For each of these states a validation hint can apply two visual effects for its target control:

  • a border, drawn around the element;
  • a hint with image, text and background.

Expand the ValidationHint.Properties group of a validation hint to access three property sub-groups named after related control validation states (the figure below). Each sub-groups stores a ValidationHintBaseDefaultProperties object that provides access to properties that manage this hint's behavior for this specific validation state. For instance, you can use the ValidationHintBaseDefaultProperties.ShowBorder and ValidationHintBaseDefaultProperties.ShowHint properties to choose whether you want to display a validation border, a hint or none of them (by default, both effects are shown). At the figure above, a validation hint for the "City" data field shows only a border for the valid state, while indeterminate "State" and invalid "ZIP" editors display both a border and a hint.

Same approach is used for visual hint appearances. The ValidationHint.Appearances property provides access to three AppearanceObjects that allow you to customize effects for each control validation state separately. By default, a hint paints blue borders for indeterminate controls, green for validated and red for invalid ones.

The background color set in a hint's Appearances group is ignored by default. Using the ValidationHintBaseProperties.ShowBackgroundMode and ValidationHintBaseDefaultProperties.ShowBackgroundMode properties you can specify whether this color should be applied to a hint, a target UI element or to both of them. The following figure illustrates different appearances you can get by setting these properties to different values. Note that in case you choose to apply the background color to the target UI element, utilize semi-transparent ARGB colors instead of solid RGB colors.

To apply same behavior and appearance settings for all validation hints at once, utilize the component's AdornerUIManager.ValidationHintProperties and AdornerUIManager.ValidationHintAppearances properties. These global settings have lower priority than corresponding settings of individual validation hints.

You can also utilize the ValidationHintDefaultProperties.State property to explicitly switch a validation hint to a desired validation state.

Expanded Guides

Guides are adorner elements designed to highlight and emphasize specific spots or regions within a parent form and give an optional description for these areas. Refer to the Adorner Guides article to learn more.

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