How to: Assign Custom Images to Business Classes
- 2 minutes to read
This article describes how to associate a business class with a custom image. This image appears next to the corresponding item in the Navigation control.
Note
For the purposes of this article, you can use the MainDemo application installed as a part of the XAF package. The default location of the application is %PUBLIC%\Documents\DevExpress Demos 24.2\Components\XAF.
The instructions below explain how to associate a custom image with the Employee class.
Create the Images folder in the application module. Save the image below to this folder in PNG format and name it Employee:
The file name should follow image name guidelines. Refer to the following article for additional information: Add and Replace Icons.
In the Solution Explorer, select the MainDemo.Module project and click the Show All Files toolbar button.
Select the image in the Images subfolder, right-click the selection, and choose the Include In Project option. This image is now included in the project compilation.
In the Solution Explorer, right-click the image again and select the Properties option. Set the Build Action option to Embedded Resource.
Invoke the Model Editor. Navigate to the BOModel | MainDemo.Module.BusinessObjects | Employee node and set its
ImageNameproperty toEmployee.
Note
- When you select the
ImageNameproperty, an ellipsis button appears to the right of the property value. Click this button to invoke the Image Picker dialog and browse all available images. - You can use the ImageNameAttribute to specify the image in code.
- When you select the
Optional. In the WinForms project of the MainDemo application, the Navigation control does not display images. To display the images, open the Application Model of the WinForms application project, navigate to the NavigationItems node, and set the
ShowImagesproperty toTrue.
Run the application. The Employee navigation item now displays the custom image:
- ASP.NET Core Blazor Application
- WinForms Application
