Question

假设我有一个我在devexpress gridview中使用的ViewModel。在该视图中，我在devexpress gridview中显示我的数据，如此

@Html.DevExpress().GridView(
    settings =>
    {
        settings.Name = "myGridView";
        settings.KeyFieldName = "Id";
....
    var column = settings.Columns.Add("Id", "Id");
    column = settings.Columns.Add("Title", "MyTitle");
    ...    
    }).Bind(Model).GetHtml()

我的模型是IEnumerable 这段代码一切正常。现在我想在Id列之前或之后在gridview中显示图像。所以我发现这应该用Html.DevExpress().BinaryImage()来完成但是我现在已经在这里停留了一段时间。首先描述我的viewmodel以及我的图像是如何存储的。我的模型有List<Photo>个集合。我的图像为FileContentResult。

所以我知道我应该使用这个Html.DevExpress().BinaryImage()，但我不知道。这是我应该遵循的例子。

column = settings.Columns.Add("", "Photos");
        Html.DevExpress().BinaryImage(
            imageSettings =>
            {
                //imageSettings.Name = "Photo";
                imageSettings.Width = 100;
                imageSettings.Height = 100;
            })
            .Bind(((System.Data.Linq.Binary)DataBinder.Eval(Model, "Photo")).ToArray())
            .Render();

更新我想我应该试试这个解决方案。这里的问题是我想在我的网格中显示来自Photos集合的第一张图片。我尝试使用下面的代码，但没有运气。没有错误。

var photoColumn = settings.Columns.Add("Photos[0].ImageData", "Foto");
        photoColumn.Visible = true;
        photoColumn.Width = 20;
        photoColumn.FieldName = "Photo.ImageData";
        photoColumn.ColumnType = MVCxGridViewColumnType.BinaryImage;
        DevExpress.Web.ASPxEditors.BinaryImageEditProperties properties = (DevExpress.Web.ASPxEditors.BinaryImageEditProperties)photoColumn.PropertiesEdit;
        properties.ImageHeight = 50;
        properties.ImageWidth = 50;

Answer 1

您不需要在GridView中直接使用BinaryImage，因为MVCxGridViewColumnType支持BinaryImage。
相关链接 - GridView - How to load binary image within BinaryImage column

请同时查看演示如何在数据行中使用BinaryImage的Grid View - Templates演示。

Answer 2

在你的情况下，有必要自定义DataItemTemplate并在其中自定义BinaryImage，如下所示：

settings.Columns.Add(column => {
    column.SetDataItemTemplateContent(c => {
        Html.DevExpress().BinaryImage(
            imageSettings => {
                imageSettings.Name = "Photo" + c.KeyValue;
                imageSettings.Width = 50;
                imageSettings.Height = 50;
            })
            .Bind(Here_Your_Code_To_Retrieve_Image_From_Current_DataItem)
            .Render();
    });
});

显示图像devexpress gridview，这是一个火箭科学吗？

2 个答案: