Loading progress Circle?

[rafter_01]

Hi rafter, it wouldn't surprise me if you are suffering from information overload. I agree with OGreen, start simple. I suggest you break it down into three stages.

Stage 1. Take an image like this (right click to save) and get it rotating in a picture box on a form. I'll give you an example of the code below.

Stage 2. Generate the image yourself in code, so that you can change values like the color, the number of spokes, the line thickness etc.

Stage 3. If you want to use the progress indicator in other projects, you could consider turning it into a custom control. That's not too hard in theory -- a lot of the code will be the same as in stage1/stage2. But in practice it can be a lot of work especially if you have a lot of properties you want to expose in the designer. And there are pitfalls.

Here's what I suggest for Stage 1. Open a form, and add a picture box(PictureBox1, Size about 50x50 pixels, BackColor = Transparent. Leave other properties at default.), a Button (Button1) and a Timer (Timer1, Interval = 100). Try the following code to start and stop rotation:

Private rotaryImage As Image = Image.FromFile(_image file path+name _)
    Private spokeCount As Integer = 14
    Private angle As Single = 0
 
    Private Sub PictureBox1_Paint(sender As Object, e As System.Windows.Forms.PaintEventArgs) Handles PictureBox1.Paint
        Dim center As New PointF(PictureBox1.Width / 2.0F, PictureBox1.Width / 2.0F)
        Dim drawLocation = New PointF(center.X - rotaryImage.Width / 2.0F, center.Y - rotaryImage.Height / 2.0F)
        e.Graphics.TranslateTransform(center.X, center.Y)
        e.Graphics.RotateTransform(angle)
        e.Graphics.TranslateTransform(-center.X, -center.Y)
        e.Graphics.DrawImage(rotaryImage, drawLocation)
    End Sub
 
    Private Sub Timer1_Tick(sender As System.Object, e As System.EventArgs) Handles Timer1.Tick
        angle += 360.0F / spokeCount
        PictureBox1.Invalidate()
    End Sub
 
    Private Sub StartRotaryIndicator()
        Timer1.Start()
    End Sub
 
    Private Sub StopRotaryIndicator()
        Timer1.Stop()
    End Sub
 
    Private Sub ResetRotaryIndicator()
        angle = 0
    End Sub
 
    Private Sub Button1_Click(sender As System.Object, e As System.EventArgs) Handles Button1.Click
        If Timer1.Enabled = False Then
            ResetRotaryIndicator()
            StartRotaryIndicator()
            PictureBox1.Show()
        Else
            StopRotaryIndicator()
            PictureBox1.Hide()
        End If
    End Sub

A few notes:
1. SpokeCount = 14 is the number of spokes in this particular image.
2. The only complicated part is in the Paint event. You have to shift the center of rotation from the origin to the actual center (line 8), then do the rotation (line 9), and then shift it back again (line 10).
3. The control is transparent, but only to its Parent control - normally the form. If you want to show it on a button, for example, you need to set PictureBox1.Parent = button and adjust the Location accordingly. This limitation applies to all transparency in Windows Forms controls.

BB

many many thanks for this,

by the way how do i stop the image from bouncing? i just want it to rotate.

now i must learn how to turn it into a custom control...