How to change a picturebox once a gif ends

Question

I have a PictueBox and I have some dice, I would like to play an animation for the "rolling" of the dice, I did a .gif with the dice, but after the dice stop rolling, I want the actual dice number that I got, I have a random funcion that handles that.

My question is, I press the "Roll Dice" button, it plays the animation and after the animation ends I should set int the picturebox the dice that actually came. but it immediately chnages to the dice number that actually came, skipping the animation;

This is how it works:

dice1.Image = Resources.DiceAnimation; //Here the gif is called to be played

int x = rollDice(); //Here I roll the dice

switch (x){
     case 1: dice.Image = resources.diceFace1; //Image set depending on x
             break
     case 2: //etc...
}

Answer 1

You can make a timer with the Interval property set to the length of the animation and set it's Tag to 0 and in the timer write the code:

if(timer.Tag == "0")
    timer.Tag == "1";
else if(timer.Tag == "1")
{
    int x = rollDice();
    switch (x)
    {
        case 1: dice.Image = resources.diceFace1; break;
        case 2: //etc...
    }
    timer.Tag == "0";
    timer.Stop();
}

Answer 2

There might be two things needed to do that.

Firstly, you may need to ensure that your PictureBox receives a gif image and it knows it. To do this, please check this answer and this answer. The posts have code to show GifImage frame by frame:

public class GifImage
{
    private Image gifImage;
    private FrameDimension dimension;
    private int frameCount;
    private int currentFrame = -1;
    private bool reverse;
    private int step = 1;

    public GifImage(string path)
    {
        gifImage = Image.FromFile(path);
        //initialize
        dimension = new FrameDimension(gifImage.FrameDimensionsList[0]);
        //gets the GUID
        //total frames in the animation
        frameCount = gifImage.GetFrameCount(dimension);
    }

    public bool ReverseAtEnd {
        //whether the gif should play backwards when it reaches the end
        get { return reverse; }
        set { reverse = value; }
    }

    public Image GetNextFrame()
    {

        currentFrame += step;

        //if the animation reaches a boundary...
        if (currentFrame >= frameCount || currentFrame < 1) {
            if (reverse) {
                step *= -1;
                //...reverse the count
                //apply it
                currentFrame += step;
            }
            else {
                currentFrame = 0;
                //...or start over
            }
        }
        return GetFrame(currentFrame);
    }

    public Image GetFrame(int index)
    {
        gifImage.SelectActiveFrame(dimension, index);
        //find the frame
        return (Image)gifImage.Clone();
        //return a copy of it
    }
}

Use it like this (note that you need a Timer object):

private GifImage gifImage = null;
private string filePath = @"C:\Users\Jeremy\Desktop\ExampleAnimation.gif";

public Form1()
{
    InitializeComponent();
    //a) Normal way
    //pictureBox1.Image = Image.FromFile(filePath);

    //b) We control the animation
    gifImage = new GifImage(filePath);
    gifImage.ReverseAtEnd = false; //dont reverse at end
}

private void button1_Click(object sender, EventArgs e)
{
    //Start the time/animation
    timer1.Enabled = true;
}

//The event that is animating the Frames
private void timer1_Tick(object sender, EventArgs e)
{
    pictureBox1.Image = gifImage.GetNextFrame();
}

Secondly, to know how long you want to run your GIF image, you may need to Get Frame Duration of GIF image like this:

double delayIn10Ms; //declare somewhere

//Initialize on your form load
PropertyItem item = img.GetPropertyItem (0x5100); // FrameDelay in libgdiplus
// Time is in 1/100th of a second
delayIn10Ms = (item.Value [0] + item.Value [1] * 256) * 10;

Then use the delayIn10Ms time plus, probably, a little bit more time to stop your timer. You may also want to check when was the last time your timer Ticks and store it. If it exceeds the given delay time, then you should stop your timer and start it again on dice roll, after image assignment in your switch case.

DateTime currentTick = DateTime.Min;
DateTime startTick = DateTime.Min;
private void timer1_Tick(object sender, EventArgs e)
{
    currentTick = DateTime.Now;
    if ((currentTick - startTick).TotalSeconds / 100 < delayIn10Ms)
        pictureBox1.Image = gifImage.GetNextFrame();
    else
        timer1.Stop(); //stop the timer        
}

//And somewhere else you have
timer1.Start(); //to start the timer
int x = rollDice(); //Here I roll the dice

switch (x){
     case 1: dice.Image = resources.diceFace1; //Image set depending on x
             break
     case 2: //etc...
}