Skip to main content
.NET 6.0+

DevExpress v24.1 Update — Your Feedback Matters

Our What's New in v24.1 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

BLOB Image Properties

  • 4 minutes to read

In XAF, BLOB image properties are persisted as byte arrays which can be displayed in the following controls:

  • A PictureEdit control (default)
  • A drop-down control (for WinForms and ASP.NET Web Forms applications only)

Note

BLOB, or Binary Large Object, is a set of binary data persisted as a single entity in the database.

The ImageEditorAttribute specifies Image Property Editor settings when displaying images.

Note

Refer to the Property Editors | Image Properties section in the Feature Center demo installed with XAF to see Image Property Editors in action. The default location of the application is %PUBLIC%\Documents\DevExpress Demos 24.1\Components\XAF\FeatureCenter.NETFramework.XPO. You can also watch the Image Property Editor tutorial video at the DevExpress YouTube channel.

#Examples

#ASP.NET Core Blazor

XAF BLOB Image Properties ASP.NET Core Blazor

#ImagePropertyEditor

Used as the default editor for properties of the following types:

ImagePropertyEditor uses a custom ImageEditComponent class to implement the editor’s functionality.

In Detail Views, the editor displays a placeholder icon if the bound property is empty. A user can click the icon to upload a new image. An ellipsis button over the image provides access to Replace and Remove buttons.

On mobile devices and in List View Inline Edit mode, the editor does not show its ellipsis button. To access Replace and Remove buttons, a user can click or tap the editor. On mobile devices, these commands appear in a pop-up menu. To close the menu, use the Cancel button or tap the pop-up background.

To access Context Menu and mobile pop-up menu instances, use ComponentModel.ContextMenu and ComponentModel.PopupMenu respectively.

For additional customization, implement your own custom property editor as described in the following topic: Implement a Property Editor Based on a Custom Component (Blazor).

#WinForms

XAF BLOB Image Properties WinForms

Each Windows Forms Property Editor is available in two forms:

  • A standalone control (displays property value in a Detail View)
  • A repository item (displays property value in a List Editor that supports in-place editing)

#ImagePropertyEditor

Control: The PictureEdit or ImageEdit editor from the XtraEditors Library.

Repository Item: RepositoryItemPictureEdit or RepositoryItemImageEdit repository item from the XtraEditors Library.

Description:

Used for byte array properties decorated by the ImageEditorAttribute and for reference properties of the MediaDataObject and MediaDataObject types.

The default configuration is PictureEdit and RepositoryItemImageEdit.

Both PictureEdit and ImageEdit editors allow end users to perform Load, Save, Delete, Cut, Copy, and Paste operations using a context menu.

Use ImageEditorAttribute to configure the ImagePropertyEditor for a particular business class property.

#ASP.NET Web Forms

XAF BLOB Image Properties ASP.NET Web Forms

Each ASP.NET Web Forms Property Editor includes controls that display a property in a Detail View in View and Edit mode.

#ASPxImagePropertyEditor

View mode controls:

  • ImageEdit is a Panel control descendant;
  • DropDownImageEdit is an ImageEdit control with a Show Image/Hide image button.

Edit mode controls:

  • ImageEdit is a Panel control descendant.
  • DropDownImageEdit is an ImageEdit control with a Show Image/Hide image button.

Description:

Used for byte array properties decorated by the ImageEditorAttribute, and for reference properties of the MediaDataObject and MediaDataObject types.

When displayed in view mode, the ImageEdit control is always read-only.

When the Property Editor is read-only, only the ASPxImage control is displayed. When it is editable, a table with the Edit and Clear ASPxButton type buttons is shown as well, and the ASPxUploadControl is used to upload a new image. A browser editor is displayed when no image is assigned.

Use the ImageEditorAttribute to configure the ASPxImagePropertyEditor for a specific business class property. Refer to the How to: Access the ASPxImagePropertyEditor controls in View and Edit modes KB article to learn how to access and customize ASPxImagePropertyEditor controls.

In the current implementation of the ASPxImagePropertyEditor, the upload progress is not shown if the ImmediatePostDataAttribute is applied to the current FileData property or the IModelCommonMemberViewItem.ImmediatePostData option is enabled in the Model Editor for the current View Item.

See Also