2

I have this table, and want to get the data from it. It contains an image file that I saved as varbinary datatype. I want to show the image in the datagrid as a description.

enter image description here

I have the following code for conversion from bytes to varbinary (image) and from image to byte.

public byte[] ConvertToBytes(BitmapImage bitmapImage)
{
    using (var stream = new MemoryStream())
    {
        var encoder = new PngBitmapEncoder(); // or some other encoder
        encoder.Frames.Add(BitmapFrame.Create(bitmapImage));
        encoder.Save(stream);
        return stream.ToArray();
    }
}

public ImageSource BytesToImage(byte[] imageData)
{
    using (var ms = new MemoryStream(imageData))
    {
        var image = new BitmapImage();
        image.BeginInit();
        image.CacheOption = BitmapCacheOption.OnLoad;
        image.StreamSource = ms;
        image.EndInit();

        ImageSource imgSrc = image as ImageSource;

        return imgSrc;
    }
}

The conversion from image to byte[] works. But I'm not sure if the code for conversion from bytes to image works.

I also have a compile error in the linq query where I call the data from database:

public List<RoomViewModel> getRooms()
{
    List<RoomViewModel> getRoomsQuery;

    using (db = new MyHotelDBContext())
    {
        getRoomsQuery = (from r in db.Rooms
                         join t in db.RoomTypes on r.RoomTypeID equals t.ID
                         join f in db.Floors on r.FloorID equals f.ID
                         select new RoomViewModel
                         {
                             ID = r.ID,
                             Nr = r.Nr,
                             rType = t.Name,
                             Image = BytesToImage(r.Image as BitmapImage),
                             Description = r.Description,
                             rFloor = f.Floor1
                         }).ToList();
    }
    return getRoomsQuery ?? new List<RoomViewModel>(); 
}

Where is the problem with this line: 

Image = BytesToImage(r.Image as BitmapImage)

How can I fix/improve this code?

Dan Lowe
  • 51,713
  • 20
  • 123
  • 112
Tinaira
  • 727
  • 2
  • 7
  • 23
  • Q: the (conversion) from image to byte[] works. But I'm not sure if the code for (conversion) from bytes to image works. A: Exactly what have you done to verify this? SUGGESTION: Until you can sucessfully round-trip from an image => database => back to displayable image, you probably shouldn't assume *anything* "works"... Q: What exactly is the "compile error"???? – paulsm4 Nov 15 '15 at 19:47
  • You have to pass a byte array to BytesToImage, not a BitmapImage. So it should read `BytesToImage(r.Image as byte[])`. – Clemens Nov 15 '15 at 19:48
  • Note that you can directly return `image` from BytesToImage. No need for `ImageSource imgSrc = image as ImageSource;`. – Clemens Nov 15 '15 at 19:50
  • I assume it works cuz i get no error and some data get insertet into the db table. i also knew that i can return image but i saw somewhere this way and tried it and forgot to go back in the short way... the error is: Severity Code Description Project File Line Error CS0039 Cannot convert type 'byte[]' to 'System.Windows.Media.Imaging.BitmapImage' via a reference conversion, boxing conversion, unboxing conversion, wrapping conversion, or null type conversion WpfMyHotel – Tinaira Nov 15 '15 at 20:22
  • keep in mind that i'm a new developer and i'm still learning and need simple answer with simple explanations – Tinaira Nov 15 '15 at 20:24

2 Answers2

0

This question appears to have been addressed here:

Display image from database in asp mvc

However, I would add a method that I find useful for small images. Instead of a spearate controller for generating the image file data, you can simply write the bytes to base64string in the source itself.

You would output the image bytes to the model:

                             select new RoomViewModel
                             {
                                 ID = r.ID,
                                 Nr = r.Nr,
                                 rType = t.Name,
                                 ImageBytes = r.Image as Byte[],
                                 ImageType = "image/jpg", // for example
                                 Description = r.Description,
                                 rFloor = f.Floor1
                             }).ToList();

Then render the src string in the appropriate transformation in the grid. Something like :

<img src="data:@Model.ImageType;base64,@Convert.ToBase64String(Model.ImageBytes)" />
Community
  • 1
  • 1
S. Brentson
  • 454
  • 4
  • 7
0

I got the answer. I just replaced Image = BytesToImage(r.Image as BitmapImage) with Image = r.Image

Tinaira
  • 727
  • 2
  • 7
  • 23