Pause image with c#

Question

I want to make a program that shows an image every 5 seconds , then pause for 1 second and then show the next .But i have a problem pausing the image.If i have the message box code , it stops shows the image and i have to press ok to continue , but if not no image is shown and it jumps to the last image. help please , what i have to add in my code to work properly?

private void button1_Click(object sender, EventArgs e)
{
    string[] arr1 =
        new string[] { "water", "eat", "bath", "tv", "park", "sleep" };

    for (int i = 0; i < 6; i++)
    {
        button1.BackgroundImage = 
            (Image)Properties.Resources.ResourceManager.GetObject(arr1[i]);
        new SoundPlayer(Properties.Resources.nero).Play();
        MessageBox.Show(arr1[i].ToString());

        Thread.Sleep(5000);
    }
}

Answer 1

The problem is that the UI thread has no chance to update the display. That is: The images are being shown, but the UI does not update.

A not-so-nice-hack would be to use Application.DoEvents to let the UI update itself like this:

for (int i = 0; i < 6; i++)
{
    button1.BackgroundImage = (Image)Properties.Resources.ResourceManager.GetObject(arr1[i]);
    Application.DoEvents();

    new SoundPlayer(Properties.Resources.nero).Play();

    Thread.Sleep(5000);
}

Another (much cleaner) solution would be to change your logic so that when pressing the button a timer is started that changes the pictures, running every 5 seconds. I'm assuming you're using Windows Forms, so you can place a Timer named timer on your form, attach an event handler to the Elapsed event and then use this:

// These are instance members outside any methods!!
private int currentImageIndex = 0;
string[] arr1 = new string[] { "water", "eat", "bath", "tv", "park", "sleep" };

private void button1_Click(object sender, EventArgs e)
{
    // EDIT: As per comments changed to turn the button into a Start/Stop button.
    //       When the button is pressed and the timer is stopped, the timer is started,
    //       otherwise it is started.

    // Stop the timer if it runs already
    if (timer.Enabled)
    {
        timer.Stop();
    }

    // Start the timer if it was stopped
    else
    {
        // Make the timer start right away
        currentImageIndex = 0;
        timer.Interval = 1;

        // Start the timer
        timer.Start();
    }
}

Within the timer event, use this code:

private void timer_Tick(object sender, EventArgs e)
{    
    timer.Stop();
    try
    {
        timer.Interval = 5000; // Next time, wait 5 secs

        // Set the image and select next picture
        button1.BackgroundImage = (Image)Properties.Resources.ResourceManager.GetObject(arr1[currentImageIndex]);
        currentImageIndex++;
    }
    finally
    {
        // Only start the timer if we have more images to show!
        if (currentImageIndex < arr1.Length)   
            timer.Start();
    }
}

Answer 2

The best way to do this is in conjunction with a Timer Control. Set the interval for your timer to 1 second, but leave it disabled initially. Then the button press code simply enables the timer.

public partial class MyForm : Form
{
    private int ImagePosition = 0;
    private string[] arr1 = new string[] { "water", "eat", "bath", "tv", "park", "sleep" };

    private void button1_Click(object sender, EventArgs e)
    {
        ImagePosition = 0;
        RotateImage();
        Timer1.Start();      
    }

    private void RotateImage()
    {
        button1.BackgroundImage = 
        (Image)Properties.Resources.ResourceManager.GetObject(arr1[ImagePosition]);
        new SoundPlayer(Properties.Resources.nero).Play();
        ImagePosition++;
    }

    private void timer1_Tick(object sender, EventArgs e)
    {
        if (ImagePosition > 5)
        {
            timer1.Enabled = false;
            return;
        }

        RotateImage();
    }
}