BinaryImage

  • 2 min to read

BinaryImage is an editor capable of displaying images from a binary stream.

Implementation Details

BinaryImage is realized by the BinaryImageEditExtension class. Its instance can be accessed via the ExtensionsFactory.BinaryImage helper method, which is used to add a BinaryImage extension to a view. This method's parameter provides access to the BinaryImage's settings implemented by the BinaryImageEditSettings class, allowing you to fully customize the extension.

The BinaryImage's client counterpart is represented by the ASPxClientBinaryImage object.

Declaration

BinaryImage can be added to a view in the following manner.

Controller code:

public ActionResult ViewPage1(int? employeeID){
    return View("ViewPage1", GetEmployee(employeeID.Value));
}

public Employee GetEmployee(int employeeID){
    DataClasses1DataContext DB = new DataClasses1DataContext();
    return (from employee in DB.Employees where employee.EmployeeID == employeeID select employee).SingleOrDefault();
}

View code - "ViewPage1" (Razor):

<h2>Details:</h2>

@Html.DevExpress().BinaryImage(
    settings => {
        settings.Name = "binaryImage1";
    }).Bind((Model.Photo).ToArray()).GetHtml()

or

View code - "ViewPage1" (Razor):

<h2>Details:</h2>

@Html.DevExpress().BinaryImage(
    settings => {
        settings.Name = "binaryImage1";

        settings.ContentBytes = (Model.Photo).ToArray();
    }).GetHtml()
Note

To enable the file downloading and uploading functionality, the Partial View with the extension must be wrapped with the HTML form. Since this functionality is implemented through the UploadControl extension, it's also necessary to fulfill all the recommendations from the corresponding KB article.

Note

The Partial View should contain only the extension's code.

The code result is demonstrated in the image below.

binaryimage-declaration.png

Main Features

The BinaryImage MVC extension represents an editor capable of displaying images from a binary stream.

ASPxBinaryImage

The BinaryImageEditSettings.ContentBytes property provides access to the editor's contents, represented by an array of bytes.

You can specify the text to display in place of image when the image is not available by setting the BinaryImageEditSettings.Properties.AlternateText (ASPxImageBase.AlternateText) property.

The BinaryImageEditSettings.Properties.EmptyImage (ASPxImageBase.EmptyImage) property allows you to define a specific image to be displayed by the image editor if the editor's value is null (or the ImageUrl property is not defined or is set to an empty string).

The alignment of the displayed image in relation to other elements on the web page is specified by the BinaryImageEditSettings.Properties.ImageAlign (ASPxImageBase.ImageAlign) property.