none
Spinning GIF as resource not showing when called RRS feed

  • Question

  • In a VB.NET v4.5 project I'm building in VS2013 I need to indicate to the user that the program is working, so I'd like to add a spinning GIF while a file is being processed.

    I found this article that makes it seem quite easy, but I can't get it working.

    Following the article, I added a spinning GIF to the project resources.

    Then I added a PictureBox to my form, where I want the GIF to show.

    Here's how I am trying to display it while the work is being done:

    Private Function ConvertCommaSepToPipeSep() As Boolean Cursor.Current = Cursors.WaitCursor 'Console.WriteLine("Conversion start time: " & DateTime.Now.ToLongTimeString()) picWorkingIndicator.Image = My.Resources.workingSpinner
      ' Convert file...

    'Console.WriteLine("Conversion end time: " & DateTime.Now.ToLongTimeString()) picWorkingIndicator.Image = Nothing Cursor.Current = Cursors.Default Return True End Function


    When the function is called, the PictureBox doesn't show at all. I tried changing some of the PictureBox's properties, but the only thing I could do was just have a static image of the GIF show all the time (in the BackgroundImage property).

    I added the below code after setting the image property to make sure that the GIF had enough time to display:

    Threading.Thread.Sleep(10000)

    I don't need anything "fancy" such as cancelling the process, error messages, etc, just the spinning GIF when the file is being processed.


    Monday, November 23, 2015 2:14 PM

Answers

  • '

    Option Strict On
    
    Public Class Form1
    
        Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
            Me.Location = New Point(CInt((Screen.PrimaryScreen.WorkingArea.Width / 2) - (Me.Width / 2)), CInt((Screen.PrimaryScreen.WorkingArea.Height / 2) - (Me.Height / 2)))
            Button1.Left = CInt((Me.ClientRectangle.Width / 2) - (Button1.Width / 2))
            PictureBox1.Size = My.Resources.Skipping.Size
            PictureBox1.Image = My.Resources.Skipping
            PictureBox1.Left = CInt((Me.ClientRectangle.Width / 2) - (PictureBox1.Width / 2))
            PictureBox1.Visible = False
            BackgroundWorker1.WorkerSupportsCancellation = True
        End Sub
    
        Private Sub Form1_FormClosing(sender As Object, e As FormClosingEventArgs) Handles Me.FormClosing
            Try
                BackgroundWorker1.CancelAsync()
            Catch ex As Exception
            End Try
        End Sub
    
        Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
            Button1.Enabled = False
            Button1.Refresh()
            PictureBox1.Visible = True
            PictureBox1.Refresh()
            BackgroundWorker1.RunWorkerAsync()
        End Sub
    
        Private Sub BackgroundWorker1_DoWork(sender As Object, e As System.ComponentModel.DoWorkEventArgs) Handles BackgroundWorker1.DoWork
            For i = 1 To 5
                ' Loop to represent long running operation. Should run approx 5 seconds
                System.Threading.Thread.Sleep(1000)
            Next
        End Sub
    
        Private Sub BackgroundWorker1_RunWorkerCompleted(sender As Object, e As System.ComponentModel.RunWorkerCompletedEventArgs) Handles BackgroundWorker1.RunWorkerCompleted
            PictureBox1.Visible = False
            Button1.Enabled = True
        End Sub
    
    End Class


    La vida loca

    Thursday, November 26, 2015 2:17 AM

All replies

  • Hello,

    I used the following code snippet and saw it working in my test environment.

    Step1: Add Gif file to project resources.

    Step2: Set image property in Picture box control

       PictureBox1.Image = My.Resources.image_925497

    If you could not make it work, could you please upload a sample to your OneDrive and share a link here.

    Regards,


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Wednesday, November 25, 2015 7:28 AM
    Moderator
  • It's not clear what you are doing with the file, but it seems it is freezing your UI thread since you are running that processing on the UI thread also, which will cause the gif to freeze also.

    You can use a BackgroundWorker to do that processing on, the BG worker will run a separate thread other than the UI:

    Check this example here:

    http://stackoverflow.com/questions/2251731/display-animated-gif-while-running-a-sub


    Fouad Roumieh

    Wednesday, November 25, 2015 12:19 PM
  • no because after that you put the gif in the picturebox you remove that image from the picturebox in the same microsecond

    You should at least create an event to remove it again. 


    Success
    Cor

    Wednesday, November 25, 2015 12:31 PM
  • In a VB.NET v4.5 project I'm building in VS2013 I need to indicate to the user that the program is working, so I'd like to add a spinning GIF while a file is being processed.

    I found this article that makes it seem quite easy, but I can't get it working.

    Following the article, I added a spinning GIF to the project resources.

    Then I added a PictureBox to my form, where I want the GIF to show.

    Here's how I am trying to display it while the work is being done:

    Private Function ConvertCommaSepToPipeSep() As Boolean Cursor.Current = Cursors.WaitCursor 'Console.WriteLine("Conversion start time: " & DateTime.Now.ToLongTimeString()) picWorkingIndicator.Image = My.Resources.workingSpinner
      ' Convert file...

    'Console.WriteLine("Conversion end time: " & DateTime.Now.ToLongTimeString()) picWorkingIndicator.Image = Nothing Cursor.Current = Cursors.Default Return True End Function


    When the function is called, the PictureBox doesn't show at all. I tried changing some of the PictureBox's properties, but the only thing I could do was just have a static image of the GIF show all the time (in the BackgroundImage property).

    I added the below code after setting the image property to make sure that the GIF had enough time to display:

    Threading.Thread.Sleep(10000)

    I don't need anything "fancy" such as cancelling the process, error messages, etc, just the spinning GIF when the file is being processed.


    What do you mean by the PictureBox does not show at all? If the PictureBox is set so Visible is False then you need to alter that to true. Regardless you can set the PictureBox's animated .Gif image at runtime and just set the PictureBox visible property to False or True whenever you want the PictureBox displayed.

    However a PictureBox runs on the same thread as the GUI or UI that it is used with. If whatever the code is that runs after the PictureBox is displayed is system intensive causing the GUI or UI to freeze then the PictureBox is frozen regarding its operability also. Which means you should be performing threading to run that code on another thread so it does not affect the GUI or UI and PictureBox.

    Of course sleeping a thread sleeps everything and nothing in the thread will do anything while the thread is sleeping. So if you're sleeping the thread in code that is running in the GUI or UI's thread then the GUI or UI and everything on that thread will sleep including the PictureBox's animated .Gif animation image.


    La vida loca

    Wednesday, November 25, 2015 5:54 PM
  • '

    Option Strict On
    
    Public Class Form1
    
        Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
            Me.Location = New Point(CInt((Screen.PrimaryScreen.WorkingArea.Width / 2) - (Me.Width / 2)), CInt((Screen.PrimaryScreen.WorkingArea.Height / 2) - (Me.Height / 2)))
            Button1.Left = CInt((Me.ClientRectangle.Width / 2) - (Button1.Width / 2))
            PictureBox1.Size = My.Resources.Skipping.Size
            PictureBox1.Image = My.Resources.Skipping
            PictureBox1.Left = CInt((Me.ClientRectangle.Width / 2) - (PictureBox1.Width / 2))
            PictureBox1.Visible = False
            BackgroundWorker1.WorkerSupportsCancellation = True
        End Sub
    
        Private Sub Form1_FormClosing(sender As Object, e As FormClosingEventArgs) Handles Me.FormClosing
            Try
                BackgroundWorker1.CancelAsync()
            Catch ex As Exception
            End Try
        End Sub
    
        Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
            Button1.Enabled = False
            Button1.Refresh()
            PictureBox1.Visible = True
            PictureBox1.Refresh()
            BackgroundWorker1.RunWorkerAsync()
        End Sub
    
        Private Sub BackgroundWorker1_DoWork(sender As Object, e As System.ComponentModel.DoWorkEventArgs) Handles BackgroundWorker1.DoWork
            For i = 1 To 5
                ' Loop to represent long running operation. Should run approx 5 seconds
                System.Threading.Thread.Sleep(1000)
            Next
        End Sub
    
        Private Sub BackgroundWorker1_RunWorkerCompleted(sender As Object, e As System.ComponentModel.RunWorkerCompletedEventArgs) Handles BackgroundWorker1.RunWorkerCompleted
            PictureBox1.Visible = False
            Button1.Enabled = True
        End Sub
    
    End Class


    La vida loca

    Thursday, November 26, 2015 2:17 AM
  • Here is another example similar to Monkey's that also has the cursor change to wait. I just used a stop watch to simulate a long running operation. Using picturebox1.refresh in the loop makes the gif animation change frames.

    Public Class Form1
    
        Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
            Cursor.Current = Cursors.WaitCursor
            Button1.Enabled = False
    
            PictureBox1.Image = Image.FromFile("c:\bitmaps\animated gifs\hopping rabbit 2 - animated.gif")
    
            Dim sw As New Stopwatch
            sw.Restart()
            Do While sw.ElapsedMilliseconds < 2000
                PictureBox1.Refresh()
            Loop
    
            PictureBox1.Image = Nothing
            Button1.Enabled = True
        End Sub
    End Class

    Thursday, November 26, 2015 3:38 PM
  • Sorry, guys, I'm still not getting this to work - despite trying to implement the suggestions here.

    Here's what I currently have:

    Private Sub ConvertFile()
    	' ...
    	' Some pre-file conversion code
    	' ...
    		Try
    				Cursor.Current = Cursors.WaitCursor
    				
    				picWorkingIndicator.Image = My.Resources.workingSpinner
    				picWorkingIndicator.Visible = True
    				picWorkingIndicator.Refresh()
    				bkgdwkrWorkingSpinner.RunWorkerAsync()
    
    				' ...
    				' Convert the file
    				' ...
    
    			Catch ex As Exception
    				MessageBox.Show("There was a problem processing the company hours." & vbCrLf & vbCrLf & "Error: " & ex.Message, "Hours Processing Failed", MessageBoxButtons.OK, MessageBoxIcon.Error)
    
    				bkgdwkrWorkingSpinner.CancelAsync()
    				picWorkingIndicator.Visible = False
    
    				Cursor.Current = Cursors.Arrow
    				Exit Sub
    			End Try
    		End If
    
    	bkgdwkrWorkingSpinner.CancelAsync()
    	picWorkingIndicator.Visible = False
    
    	Cursor.Current = Cursors.Arrow
    End Sub

    When this runs the picturebox displays, but the spinner doesn't spin. Looking at Monkey's code, I'm wondering if the actual work (in my case the file conversion code) needs to go inside the BackgroundWorker's DoWork event.

    Wednesday, December 2, 2015 4:38 PM
  • "When this runs the picturebox displays, but the spinner doesn't spin. Looking at Monkey's code, I'm wondering if the actual work (in my case the file conversion code) needs to go inside the BackgroundWorker's DoWork event."

     That would be the idea of it,  you run the file conversion code in the BackgroundWorker thread.  That will keep the UI thread (your form) from freezing up during the file conversion work which should allow the PicturBox to keep the Animated gif spinning.


    If you say it can`t be done then i`ll try it

    Wednesday, December 2, 2015 5:40 PM
  • Sorry, guys, I'm still not getting this to work - despite trying to implement the suggestions here.

    Here's what I currently have:

    Private Sub ConvertFile()
    	' ...
    	' Some pre-file conversion code
    	' ...
    		Try
    				Cursor.Current = Cursors.WaitCursor
    				
    				picWorkingIndicator.Image = My.Resources.workingSpinner
    				picWorkingIndicator.Visible = True
    				picWorkingIndicator.Refresh()
    				bkgdwkrWorkingSpinner.RunWorkerAsync()
    
    				' ...
    				' Convert the file
    				' ...
    
    			Catch ex As Exception
    				MessageBox.Show("There was a problem processing the company hours." & vbCrLf & vbCrLf & "Error: " & ex.Message, "Hours Processing Failed", MessageBoxButtons.OK, MessageBoxIcon.Error)
    
    				bkgdwkrWorkingSpinner.CancelAsync()
    				picWorkingIndicator.Visible = False
    
    				Cursor.Current = Cursors.Arrow
    				Exit Sub
    			End Try
    		End If
    
    	bkgdwkrWorkingSpinner.CancelAsync()
    	picWorkingIndicator.Visible = False
    
    	Cursor.Current = Cursors.Arrow
    End Sub

    When this runs the picturebox displays, but the spinner doesn't spin. Looking at Monkey's code, I'm wondering if the actual work (in my case the file conversion code) needs to go inside the BackgroundWorker's DoWork event.

    Do you need a backgroundworker? I think Monkey just showed an example for you to consider and to simulate a running process but I am not sure?

    Do you want your application to be paused and therefore the user can not do anything while the process runs? Or do you want the app to be responsive to the user while the process runs? This determines the need for a backgroundworker.

    How long does it take to run the process?

    If process < 5 seconds then bgw is not required IMHO.

    If process > 5 s then Can your app be responsive as the process runs?

    Or is the process doing something that the app may need before doing anything else?

    If you don't use a bgw then all you need to do is to put picturebox.refresh in your process loop as I showed to make the gif animation change. Seems to me that is all you need.

    PS "I'm wondering if the actual work (in my case the file conversion code) needs to go inside the BackgroundWorker's DoWork event. "

    Yes you put your file process code in the bwg of course. That's what bgw is for, it runs the process in the background and then the app is still responsive to the user ie the user clicks a button then the code in that event will run.

    In the example I showed your file process is similated with a loop set by the stopwatch. So the app will not respond if the user clicks a button until the app exits your process loop. So your loop goes where the stopwatch loop is now.

    You have not shown all your code for the bgw so we cant say for sure what your current hang up is?


    Wednesday, December 2, 2015 5:43 PM
  • Yes, putting the file processing code did the trick.

    Thank you all for your help!

    Wednesday, December 2, 2015 6:01 PM