Develop Reference

Dynamic WPF Image Loading Issue

I have an issue that I think has not been covered in the multitude of other WPF image loading issues. I am scanning in several images and passing them to a "Preview Page". The preview page takes the image thumbnails and displays what a printout would look like via a generated bitmap.
The weird thing to me is, it will work fine if I run the program the first time. Upon reaching the end of the process and hitting "start over", the preview will return blank. I am creating the BitmapImage in a method that saves the bitmap as a random file name so I do not believe theres a lock on the file the second time around. Also, if I go to look at the temporary file created through explorer, it is drawn correctly so I know the appropriate data is getting to it.
Finally, when I navigate away from this page, I am clearing necessary data. I'm really perplexed and any help would be appreciated.
//Constructor
public Receipt_Form() {
InitializeComponent();
printData = new List<Object>();
this.Loaded += new RoutedEventHandler(MainWindow_Loaded);
}
void MainWindow_Loaded(object sender, RoutedEventArgs e) {
// populates global variable fileName
var task = System.Threading.Tasks.Task.Factory.StartNew(() => outputToBitmap()); task.ContinueWith(t => setImage(fileName),
System.Threading.Tasks.TaskScheduler.FromCurrentSynchronizationContext());
// I started the image creation in a separate thread because I
// thought it may be blocking the UI thread, but it didn't matter
}
private void setImage(string imageURI) {
BitmapImage image;
using (FileStream stream = File.OpenRead(imageURI)) {
image = new BitmapImage();
image.BeginInit();
image.StreamSource = stream;
image.CacheOption = BitmapCacheOption.OnLoad;
image.EndInit();
}
receiptPreview.Source = image;
//this works the first iteration but not the second, though the temp file is created successfully
}

Found the issue - the Modern UI container was getting cleared when transitioning off the page.

Showing image, there is no error but image is not displayed

I am working on a C# project, and I am having a strange problem. I have an Image control and I am trying to display an image within it. There is no error or exception thrown, but the image doesn't display.
Below is the code I am using:
BitmapImage image = new BitmapImage();
image.UriSource = new Uri("images\\low_battery.png", UriKind.Relative);
imageIcon.Source = image;
imageIcon.Visibility = System.Windows.Visibility.Visible;
I have the directory image and the image file low_battery.png running in the same directory as to where the executable is running from.
Thanks for any help you can provide.

A few suggestions:
1) You can get the exception from WPF if you subscribe to the ImageFailed even on imageIcon and the and DownloadFailed event on BitmapImage. Then put breakpoints in those methods and see what it says.
2) Before setting UriSource, call image.BeginInit(). After setting UriSource, call image.EndInit(). To help debug the problem, you can subscribe to the ImageFailed event on imageIcon and DownloadFailed on BitmapImage. So the final code looks like this:
BitmapImage image = new BitmapImage();
image.BeginInit();
image.UriSource = new Uri("/images/low_battery.png", UriKind.Relative);
image.DownloadFailed += image_DownloadFailed;
image.EndInit();
imageIcon.ImageFailed += imageIcon_ImageFailed;
imageIcon.Source = image;
imageIcon.Visibility = System.Windows.Visibility.Visible;
and further down:
void imageIcon_ImageFailed(object sender, ExceptionRoutedEventArgs e)
{
// Breakpoint here
}
void image_DownloadFailed(object sender, ExceptionEventArgs e)
{
// Breakpoint here
}
3) Another way to do this is to embed images directly into your project. Do that by adding an images folder into your project, then adding the image, and setting the type to "Resource"

Either call image.BeginInit() before setting image.UriSource and image.EndInit() afterwards, or simply use the BitmapImage constructor that takes an Uri as argument:
var uri = new Uri("images\\low_battery.png", UriKind.Relative);
imageIcon.Source = new BitmapImage(uri);

Showing animated gif in Winforms without locking the file

I'm trying to display images of various file types (including animated .gif files) in my Winforms application. I also have to be able to modify the files that are shown. (change the file name, delete them).
The problem is that a Picturebox locks the image file until the application is closed when using the normal way.
That means I can't do this:
private void Form1_Load(object sender, EventArgs e)
{
PictureBox pic = new PictureBox();
pic.Size = new Size(250, 250);
pic.Image = Image.FromFile("someImage.gif");
this.Controls.Add(pic);
//No use to call pic.Image = null or .Dispose of it
File.Delete("someImage.gif"); //throws exception
}
The workaround in the link above is as follows:
private void Form1_Load2(object sender, EventArgs e)
{
PictureBox pic = new PictureBox();
pic.Size = new Size(250, 250);
//using a FileStream
var fs = new System.IO.FileStream("someImage.gif", System.IO.FileMode.Open, System.IO.FileAccess.Read);
pic.Image = System.Drawing.Image.FromStream(fs);
fs.Close();
this.Controls.Add(pic);
pic.MouseClick += pic_MouseClick;
}
That works fine for normal image types, but it won't load animated .gifs, which is important to me. Trying to load one will make it look like this.
I've found a few other topics about it (this and this) but they're all about WPF and use BitmapImage. I've searched about how to use BitmapImage in a Winforms application, but haven't found anything apart from that it is supposed to somehow work.
I would like to stay with Winforms because I'm just getting used to it, but that's not a necessity.
To summarize: I need a way to show common image types (png, jpg, bmp, and animated gif) while still being able modify the file on the HDD. It is OK if that means unloading->modifying->reloading the file. I'd prefer Winforms, but other Frameworks would do.
Thanks for your help.
Edit: Another way I've tried
using (System.IO.FileStream fs = new System.IO.FileStream("E:\\Pics\\small.gif", System.IO.FileMode.Open, System.IO.FileAccess.Read))
{
System.IO.MemoryStream ms = new System.IO.MemoryStream();
fs.CopyTo(ms);
pic.Image = Image.FromStream(ms);
}
But shows the same problem as the second example. The gif doesn't load.

Using a MemoryStream is indeed the right way to avoid the file lock. Which is a strong optimization btw, the lock is created by the memory-mapped file that the Image class uses to keep the pixel data out of the paging file. That matters a great deal when the bitmap is large. Hopefully not on an animated gif :)
A small mistake in your code snippet, you forgot to reset the stream back to the start of the data. Fix:
using (var fs = new System.IO.FileStream(...)) {
var ms = new System.IO.MemoryStream();
fs.CopyTo(ms);
ms.Position = 0; // <=== here
if (pic.Image != null) pic.Image.Dispose();
pic.Image = Image.FromStream(ms);
}
In case it needs to be said: do not dispose the memory stream. That causes very hard to diagnose random crashes later, pixel data is read lazily.

Essentialy you'll have to make a copy of the image file in your memory.
Pre .Net 4.0 (2.0,3.0,3.5) you'd have to create a FileStream and copy it to a MemoryStream and rewind it, as seen in another answer.
Since .Net 4.0 (4.0,4.5,...) Image.FromFile supports animated GIF's
If you work with .Net 4.0 or later following method will suffice:
Using System.IO, System.Drawing and System.Drawing.Imaging
private void Form1_Load(object sender, EventArgs e)
{
string szTarget = "C:\\someImage.gif";
PictureBox pic = new PictureBox();
pic.Dock = DockStyle.Fill;
Image img = Image.FromFile(szTarget); // Load image fromFile into Image object
MemoryStream mstr = new MemoryStream(); // Create a new MemoryStream
img.Save(mstr, ImageFormat.Gif); // Save Image to MemoryStream from Image object
pic.Image = Image.FromStream(mstr); // Load Image from MemoryStream into PictureBox
this.Controls.Add(pic);
img.Dispose(); // Dispose original Image object (fromFile)
// after this you should be able to delete/manipulate the file
File.Delete(szTarget);
}

Why this line of code doesn't work?

I want to show an image from Disk !
private void Button_Click_3(object sender, RoutedEventArgs e)
{
myImage.Source = new BitmapImage(
new Uri("images\\Countries\\dz.png",UriKind.Relative));
}
I'm sure that the filename is correct but
when I press the button, The image doesn't appear, I also made sure that the image is in the front of all other control and that myImage is its name .

Try this:
private void Button_Click_3(object sender, RoutedEventArgs e)
{
try
{
myImage.Source = new BitmapImage(
new Uri(#"images\Countries\dz.png",UriKind.Relative));
}
catch(Exception ex)
{
MessageBox.Show(ex.Message);
}
}
Putting # makes it a literal string (you don't need to provide
escape sequence then)
If the above also doesn't work then it'll show the exception if any
occurs.

BitmapImage bitImg = new BitmapImage();
bitImg.BeginInit();
bitImg.UriSource = new Uri("images\\Countries\\dz.png", UriKind.Relative);
bitImg.EndInit();
myImage.Source = bitImg;

A few things that may help you:
Instead of:
myImage.Source = new BitmapImage(new Uri("images\\Countries\\dz.png",UriKind.Relative));
Try This:
BitmapImage ImageName = new BitmapImage;
ImageName.BeginInit();
ImageName.UriSource = new Uri(#"images\Countries\dz.png",UriKind.Relative);
ImageName.EndInit();
myImage.Source = ImageName;
See below link (examples section at the bottom of the page) for more info.
http://msdn.microsoft.com/en-us/library/system.windows.media.imaging.bitmapimage.aspx
If the above doesn't work, we will need you to post more code :). Also, it would help if you specify exactly what you are trying to achieve here.

Try to Debug it.
Put a break point on the line(F9) and hit F5 to start debugging. Check the value of myImage.Source after the line is executed (F10 to step).
You can also use the Immediate Window to test other statements while debugging is paused and see the results.
Also make sure that the images folder is in the same folder as the executable file (in Debug or Release folders, according to your build)

how to get the height and width of an image in C#

I am trying to get the height and width of an image from websites but it always return 0, as the image is not yet downloaded so i used the following code and still didnt work as the image will start downloading only after the method end, so it hang
someMethod
{
foreach(string imagepath in paths){
IsDownloaded = false;
image = new BitmapImage(new Uri(imagepath));
image.ImageOpened += image_ImageOpened;
while (!IsDownloaded) ;
/// code that will use image.PixelHeight only if it satisfy a condition then break
}
private void image_ImageOpened(object sender, RoutedEventArgs e)
{
IsDownloaded = true;
}
Does anyone have any alternative or any fix for this supported in metro style apps

You can't use asynchronous programming like that - remove this line:
while (!IsDownloaded) ;
And put everything after it inside the image_ImageOpened method.
We usually refer to this as 'chaining', when you have a bunch of asynchronous methods, you have to continue processing after the completion of each one.
An example from my own code of getting width/height:
BitmapImage imageSource = new BitmapImage();
private void getImage()
{
Uri uir= new Uri("PATH", UriKind.Absolute);
imageSource.ImageOpened += new EventHandler<RoutedEventArgs>(imageopenened);
}
void imageopened(object sender, RoutedEventArgs e)
{
HEIGHT = ImageSource.PixelHeight;
WIDTH = ImageSource.PixelWidth;
...
}