[Expand]General Information
[Expand]WinForms Controls
[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]Office File API
[Expand]Report and Dashboard Server
[Collapse]eXpressApp Framework
 [Expand]Getting Started
 [Expand]Design-Time Features
 [Collapse]Task-Based Help
  [Expand]Business Model Design
  [Expand]Application Model
    How to: Access Objects Selected in the Current View
    How to: Access Master Detail View and Nested List View Environment
    How to: Create and Show a Detail View of the Selected Object in a Popup Window
    How to: Customize Tabs Generation in a Mobile Detail View
    How to: Detect a Lookup List View in Code
    How to: Display a Detail View Directly in Edit Mode in ASP.NET and Mobile Applications
    How to: Display a List View as a Chart
    How to: Display a List View as a Pivot Grid Table and Chart
    How to: Display Several Views Side-by-Side
    How to: Hide Collection Properties in an Edit Mode Detail View for an ASP.NET Application
    How to: Implement a Singleton Business Object and Show its Detail View
    How to: Implement a View Item
    How to: Show a Custom Data-Bound Control in an XAF View (ASP.NET)
    How to: Show a Custom Data-Bound Control in an XAF View (WinForms)
  [Expand]List Editors
  [Expand]Property Editors
  [Expand]Scheduler and Notifications
  [Expand]Miscellaneous UI Customizations
  Frequently Asked Questions (FAQ)
 [Expand]API Reference
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

How to: Implement a View Item

This topic demonstrates how to implement a custom View Item and display it on all Detail Views. This View Item shows an image that corresponds to a specific business object type. You can specify this image in the Application Model. In this topic, we use a Windows control to display this View Item, so this example applies to WinForms applications only.


A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=E242.

A custom View Item's implementation process consists of two parts:

Expanded Create a View Item

  1. In the WinForms module project, create a ViewItem class descendant and name it "ClassIconDetailItem".
  2. Override the CreateControlCore method to create a control that represents the View Item in a UI.
  3. Create a custom interface that implements the IModelViewItem and name it "IModelClassIcon".
  4. In this interface, define properties that coincide with View Item's properties you want to use in the Application Model. Do not define any properties in this interface if you do not want to specify a View Item's properties in the Application Model.
  5. Pass this interface to the View Item's constructor as the the model parameter. This allows to initialize and configure the View Item using the data from the corresponding Application Model's node.
  6. Decorate the ClassIconDetailItem class with the ViewItemAttribute and pass the IModelClassIcon interface as an attribute's parameter. This displays a new child node in the Application Model's ViewItems node after the solution rebuilds.

The following code demonstrates the custom View Item:

Expanded Add the Custom View Item on a Detail View

  1. In the WinForms module project, implement the ModelNodesGeneratorUpdater<T> descendants (Generator Updaters) for the ModelDetailViewLayoutNodesGenerator and ModelDetailViewItemsNodesGenerator Node Generators. Name them "MyDetailViewLayoutUpdater" and "MyDetailViewItemUpdater".
  2. Register these Updaters in the WinForms module class descendant's overridden ModuleBase.AddGeneratorUpdaters method.

The following code shows how to do this:

Run the application and ensure that all the Detail Views contain class icons.

Expanded See Also

Is this topic helpful?​​​​​​​