Overview - BinaryImage
- 2 minutes 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();
}
Class SurroundingClass
Public Function ViewPage1(ByVal employeeID As Integer?) As ActionResult
Return View("ViewPage1", GetEmployee(employeeID.Value))
End Function
Public Function GetEmployee(ByVal employeeID As Integer) As Employee
Dim DB As DataClasses1DataContext = New DataClasses1DataContext()
Return (From employee In DB.Employees Where employee.EmployeeID = employeeID Select employee).SingleOrDefault()
End Function
End Class
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.
