A core concept of the Infragistics NetAdvantage Windows Forms control is the idea of UIElements. UIElements are the individual elements of a control, that when drawn together give you the familiar look you are used to. A great part of using the NetAdvantage controls is that we expose hooks into the controls as they draw each individual UIElement, so that you can inject your own custom drawing logic. There are two means by which you can interact with the individual UIElements in the Windows Forms controls:
- Draw Filters – An extensibility mechanism used to customize the rendering of a UIElement
- Creation Filters – Used to add new or remove existing UIElements from the controls
(Shameless plug: You can learn more about using Draw Filters and Creation Filters in the instructor lead Infragistics training course “Advanced Development using NetAdvantage“, or through the online courses “NetAdvantage Windows Forms Elements + PLF” or “Advanced PLF Windows Forms Development“)
One key thing you need to know if you want to start interacting with the controls at this level is exactly which UIElement you want to change. This can be a daunting task if you are not intimately familiar with the UIElement structure of the controls.
To make this task easier, I am publishing* a tool that we have used internally for a while now called the UIElementViewer. This is a simple non-visual control that you can add to your form that will help you figure out which UIElement you want to work with.
Download Here * Disclaimer: This is an unsupported utility. Use at your own risk.
Using the UIElementViewer Control
To begin using the control, simply add it to a form that has the NetAdvantage control you want to examine. Once that’s done, simply call the Show() method on the control (I generally just add it to the Form_Load event).
uiElementViewer1.Show();
When you run your application the controls dialog should show up. Check the ‘Follow Mouse’ checkbox and run your mouse over the NetAdvantage controls on the form. The UIElementViewer should begin to display information about the Element Tree. The Element Tree view displays the hierarchical tree of UIElements in the control. As you can see in the image below, when I run my mouse over the grid, the grid contains a hierarchy of RowUIElements, and each of those contain several child CellUIElements.
Change the UIElementViewer to Hierarchy and the display changes to only show the element hierarchy of the current node. As you can see from the image below, this view can be a little more helpful since its not quite as much data to try to sift through.
The UIElementViewer also contains information on the Derivation of the current UIElement (e.g. its object inheritance hierarchy), the elements children, siblings, current value (or image), and object properties.
