Databinding Image to BitmapImage [modified]
-
Hi, I am trying to add some images to a listbox as described in Josh Smith's excellent article here. The only twist is that I need to bind to a list of BitmapImages that are created using a MemoryStream. The images are being read from a database and I don't want to have to save them locally before showing them in the listbox. I am not getting any errors - there are just no images being displayed. I have taken the XAML entirely as is from Josh's article (I did try changing the Image binding from UriSource to StreamSource but that didn't work). I'm pretty new to WPF so I'm probably doing something something really stupid, can anyone suggest what it is?
public static List GetProductImages() { List images = new List(); using (SqlConnection cn = new SqlConnection(cnString)) { string sql = "SELECT Top 10 ProductImage From Products WHERE NOT (ProductImage IS NULL)"; SqlCommand cmd = new SqlCommand(sql); cmd.Connection = cn; cmd.Connection.Open(); SqlDataReader reader = cmd.ExecuteReader(); while (reader.Read()) { byte[] productImage = null; productImage = (byte[])reader["ProductImage"]; if (productImage != null) { System.IO.MemoryStream ms = new System.IO.MemoryStream(productImage); BitmapImage bm = new BitmapImage(); bm.BeginInit(); bm.StreamSource = ms; bm.EndInit(); images.Add(bm); } } cmd.Connection.Close(); } return images; }Thanks very much, dlarkin77 Edit: I don't know why that link doesn't appear as a clickable link or why the code isn't in a code block. Sorry about that!modified on Wednesday, April 23, 2008 11:46
-
Hi, I am trying to add some images to a listbox as described in Josh Smith's excellent article here. The only twist is that I need to bind to a list of BitmapImages that are created using a MemoryStream. The images are being read from a database and I don't want to have to save them locally before showing them in the listbox. I am not getting any errors - there are just no images being displayed. I have taken the XAML entirely as is from Josh's article (I did try changing the Image binding from UriSource to StreamSource but that didn't work). I'm pretty new to WPF so I'm probably doing something something really stupid, can anyone suggest what it is?
public static List GetProductImages() { List images = new List(); using (SqlConnection cn = new SqlConnection(cnString)) { string sql = "SELECT Top 10 ProductImage From Products WHERE NOT (ProductImage IS NULL)"; SqlCommand cmd = new SqlCommand(sql); cmd.Connection = cn; cmd.Connection.Open(); SqlDataReader reader = cmd.ExecuteReader(); while (reader.Read()) { byte[] productImage = null; productImage = (byte[])reader["ProductImage"]; if (productImage != null) { System.IO.MemoryStream ms = new System.IO.MemoryStream(productImage); BitmapImage bm = new BitmapImage(); bm.BeginInit(); bm.StreamSource = ms; bm.EndInit(); images.Add(bm); } } cmd.Connection.Close(); } return images; }Thanks very much, dlarkin77 Edit: I don't know why that link doesn't appear as a clickable link or why the code isn't in a code block. Sorry about that!modified on Wednesday, April 23, 2008 11:46
dlarkin77 wrote:
Edit: I don't know why that link doesn't appear as a clickable link or why the code isn't in a code block. Sorry about that!
Make sure you do NOT check the "Ignore HTML tags in the this message" check box. This is the top one below the smiley faces below the text editing textbox. Have you stepped thought your code to ensure that you are actually creating the BitMapImages? Does your memory steam contain data? Please read this post: http://forums.microsoft.com/MSDN/ShowPost.aspx?PostID=1101123&SiteID=1[^] This post too: http://msdn2.microsoft.com/en-us/library/aa480226.aspx[^]
Cheers, Karl» CodeProject 2008 MVP » Microsoft MVP - Client App Dev My Blog | Mole's Home Page | MVP ProfileJust a grain of sand on the worlds beaches.
-
dlarkin77 wrote:
Edit: I don't know why that link doesn't appear as a clickable link or why the code isn't in a code block. Sorry about that!
Make sure you do NOT check the "Ignore HTML tags in the this message" check box. This is the top one below the smiley faces below the text editing textbox. Have you stepped thought your code to ensure that you are actually creating the BitMapImages? Does your memory steam contain data? Please read this post: http://forums.microsoft.com/MSDN/ShowPost.aspx?PostID=1101123&SiteID=1[^] This post too: http://msdn2.microsoft.com/en-us/library/aa480226.aspx[^]
Cheers, Karl» CodeProject 2008 MVP » Microsoft MVP - Client App Dev My Blog | Mole's Home Page | MVP ProfileJust a grain of sand on the worlds beaches.
Hi, Thanks for that tip. The memory stream does indeed contain data. For testing purposes I've used the stream to save the image data as a file locally and then used this file to create the BitmapImage and that works fine. Can you suggest anything else? Thanks very much, dlarkin77
-
Hi, Thanks for that tip. The memory stream does indeed contain data. For testing purposes I've used the stream to save the image data as a file locally and then used this file to create the BitmapImage and that works fine. Can you suggest anything else? Thanks very much, dlarkin77
Did you check out the two posts? They contain sample code for getting this to work. I'm sure it's something very simple since you are 98% there. I'll try and write a sample, ( Karl does VB.NET but will be simple to translate or read ) tonight and post it.
Cheers, Karl» CodeProject 2008 MVP » Microsoft MVP - Client App Dev My Blog | Mole's Home Page | MVP ProfileJust a grain of sand on the worlds beaches.
-
Hi, I am trying to add some images to a listbox as described in Josh Smith's excellent article here. The only twist is that I need to bind to a list of BitmapImages that are created using a MemoryStream. The images are being read from a database and I don't want to have to save them locally before showing them in the listbox. I am not getting any errors - there are just no images being displayed. I have taken the XAML entirely as is from Josh's article (I did try changing the Image binding from UriSource to StreamSource but that didn't work). I'm pretty new to WPF so I'm probably doing something something really stupid, can anyone suggest what it is?
public static List GetProductImages() { List images = new List(); using (SqlConnection cn = new SqlConnection(cnString)) { string sql = "SELECT Top 10 ProductImage From Products WHERE NOT (ProductImage IS NULL)"; SqlCommand cmd = new SqlCommand(sql); cmd.Connection = cn; cmd.Connection.Open(); SqlDataReader reader = cmd.ExecuteReader(); while (reader.Read()) { byte[] productImage = null; productImage = (byte[])reader["ProductImage"]; if (productImage != null) { System.IO.MemoryStream ms = new System.IO.MemoryStream(productImage); BitmapImage bm = new BitmapImage(); bm.BeginInit(); bm.StreamSource = ms; bm.EndInit(); images.Add(bm); } } cmd.Connection.Close(); } return images; }Thanks very much, dlarkin77 Edit: I don't know why that link doesn't appear as a clickable link or why the code isn't in a code block. Sorry about that!modified on Wednesday, April 23, 2008 11:46
If you step through the code, what do you see at the line
bm.StreamSource = ms? Before you allocate the source, try settingms.Position = 0;Alternatively, you can usems.Seek(0, SeekOrigin.Begin);-- Edit. The behaviour you are seeing is because the position of the pointer in the MemoryStream is pointing to the end when you have loaded it. You need to reset it back to the start before you can use it.Deja View - the feeling that you've seen this post before.
modified on Wednesday, April 23, 2008 5:30 PM
-
If you step through the code, what do you see at the line
bm.StreamSource = ms? Before you allocate the source, try settingms.Position = 0;Alternatively, you can usems.Seek(0, SeekOrigin.Begin);-- Edit. The behaviour you are seeing is because the position of the pointer in the MemoryStream is pointing to the end when you have loaded it. You need to reset it back to the start before you can use it.Deja View - the feeling that you've seen this post before.
modified on Wednesday, April 23, 2008 5:30 PM
Hi, Pete: I have tried as you suggested but still no joy. No doubt I'm doing something really stupid so I'll post the code that I use. This is the code I use to get my list of BitmapImages: private void Window_Loaded(object sender, RoutedEventArgs e) { List images = GetProductImages(); lstProductImages.ItemsSource = images; } private List GetProductImages() { List images = new List(); using (SqlConnection cn = new SqlConnection(cnString)) { string sql = "SELECT Top 10 ProductImage From Products WHERE NOT (ProductImage IS NULL)"; SqlCommand cmd = new SqlCommand(sql); cmd.Connection = cn; cmd.Connection.Open(); SqlDataReader reader = cmd.ExecuteReader(); while (reader.Read()) { byte[] productImage = null; productImage = (byte[])reader["ProductImage"]; using (MemoryStream ms = new MemoryStream(productImage)) { //ms.Seek(0, SeekOrigin.Begin); ms.Position = 0; BitmapImage bm = new BitmapImage(); bm.BeginInit(); //bm.CacheOption = BitmapCacheOption.OnLoad; bm.StreamSource = ms; bm.EndInit(); ms.Close(); images.Add(bm); } } cmd.Connection.Close(); } return images; } This is the XAML for the listbox: <Setter Property="ItemTemplate"> <Setter.Value> <DataTemplate> <Border BorderBrush="Black" BorderThickness="4" CornerRadius="5" Margin="6"> <!--<Image Source="{Binding Path=UriSource}" Stretch="Fill" Width="100" Height="120"/>--> <Image Source="{Binding Path=StreamSource}" Stretch="Fill" Width="100" Height="120"/> </Border> </DataTemplate> </Setter.Value> </Setter> <Setter Property="ItemsPanel"> <Setter.Value> <ItemsPanelTemplate> <WrapPanel /> </ItemsPanelTemplate> </Setter.Value> </Setter> <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" /> Does anything obvious jump out at you? Karl: I've looked at both of those sites and played around with what they suggested to no avail. Thanks very much, dlarkin77