How to center-rotate an image in VB.NET?

Hi, I saw on one of jmcilhinney's replies a quite reliable code to easily do that someday. (Link will be added as soon as I find it again.)

The problem are 2 things:
- In case of removing picturebox, I'm unable to find center of image itself inside a form or a panel. It is literally rotating from center of screen but from top-left corner.
- In case of resizing, image will not follow and exceeds in x,y and It goes out of the box.
I'm trying to upload a gif/video. to describe more detailed.

Consider you want to represent a sort of compass control. Radial rotation center anchored resizable/scalable north-peak-symbol-kind-of-thing.

Here's the entire code I used:

Code:

---

Imports System.Drawing.Drawing2D
Public Class Form3
    Public HeelValue As Integer = 0
    Private picture As Image = My.Resources.Untitled.png
    Private heelangle As Integer = 0

    Private Sub Form3_Resize(sender As Object, e As EventArgs) Handles Me.Resize
        Me.Refresh()
        Panel1.CreateGraphics.DrawLine(Pens.Red, Panel1.Width \ 2, 0, Panel1.Width \ 2, Panel1.Height)
        Panel1.CreateGraphics.DrawLine(Pens.Red, 0, Panel1.Height \ 2, Panel1.Width, Panel1.Height \ 2)
    End Sub


    Private Sub Panel1_Paint(sender As Object, e As PaintEventArgs) Handles Panel1.Paint
        With e.Graphics
            'Move the origin to the centre of the PictureBox.
            .TranslateTransform(Me.Panel1.Width / 2, Me.Panel1.Height / 2)

            'Rotate the world.
            .RotateTransform(Me.heelangle)

            'Size/Scale
            '.ScaleTransform((Panel1.Height / picture.Height) * 2, (Panel1.Height / picture.Height) * 2)

            'Draw the image so its centre coincides with the origin.
            '.DrawImage(Me.picture, (Me.Panel1.Width \ 2) - (Me.picture.Width \ 2), (Me.Panel1.Height \ 2) - (Me.picture.Height \ 2))
            .DrawImage(picture, (Me.Panel1.Width \ 2) - (picture.Width \ 2), (Panel1.Height \ 2) - (picture.Height \ 2))
        End With
        Panel1.CreateGraphics.DrawLine(Pens.Red, Panel1.Width \ 2, 0, Panel1.Width \ 2, Panel1.Height)
        Panel1.CreateGraphics.DrawLine(Pens.Red, 0, Panel1.Height \ 2, Panel1.Width, Panel1.Height \ 2)
    End Sub

    Private Sub TrackBar2_Scroll(sender As Object, e As EventArgs) Handles TrackBar2.Scroll
        'NOT THIS EVENT
    End Sub

    Private Sub TrackBar2_ValueChanged(sender As Object, e As EventArgs) Handles TrackBar2.ValueChanged
        Me.heelangle = TrackBar2.Value / 10 Mod 360
        Panel1.CreateGraphics.DrawImage(picture, 0, 0)
        Me.Refresh()
    End Sub
End Class

---

*Update: What I tried:
- Subtract DrawImage argument from a proportion of image size (and location) to achieve required results but it acts even more weird. :ehh:
- This is intended to being introduced to more possible properties of e.graphics which do things more easier... I'm not familiar with

I would probably create a user control for this but just for the example you can create this on a Windows form.

I created a gif image called Needle sized at 201 x 201 pixels with a transparent background and put that in My.Resources.

The code uses a Rectangle to hold and rotate the image, the x and y location properties of the rectangle are set to -101 (center of image)

To visualize the rotation there is a trackbar included with a Maximum property of 360

Code:

---

Imports System.Drawing
Imports System.Drawing.Drawing2D

Public Class Form1

    Dim i As Integer

    Private Sub Form1_Paint(sender As Object, e As PaintEventArgs) Handles Me.Paint

        Dim graphics_state As GraphicsState = e.Graphics.Save()
        Dim _rect As New Rectangle(-101, -101, 201, 201)

        e.Graphics.ScaleTransform(1, 1, MatrixOrder.Append)

        ' Translate to center on the form. Adjust height/width to reposition.
        e.Graphics.TranslateTransform(Me.Width \ 2, Me.Height \ 2, MatrixOrder.Append)

        ' Rotate i degrees.
        e.Graphics.RotateTransform(i, MatrixOrder.Prepend)

        'Draw the needle in the rectangle
        e.Graphics.DrawImageUnscaled(My.Resources.Needle, _rect)

        e.Graphics.Restore(graphics_state)

    End Sub

    Private Sub TrackBar1_Scroll(sender As Object, e As EventArgs) Handles TrackBar1.Scroll
        i = TrackBar1.Value
        Me.Invalidate()
    End Sub
End Class

---

Alright mate, What your code does:
Attachment 186092
What I need:
Attachment 186093
I manipulated your code a bit. Doesn't work. Rotate center of image, anchored on center of screen.

Show me your code

Try this...

Code:

---

Dim pens() As Pen = {New Pen(Color.LightGray, 2), New Pen(Color.DarkGray, 2), New Pen(Color.Black, 2)}

Private Sub Form1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Me.Paint
    Dim r As New Rectangle(-50, -50, 100, 100)

    Dim i As Integer = 0
    For x As Integer = -60 To 0 Step 30
        e.Graphics.TranslateTransform(CSng(Me.ClientSize.Width / 2), CSng(Me.ClientSize.Height / 2))
        e.Graphics.RotateTransform(x)
        e.Graphics.DrawRectangle(pens(i), r)
        e.Graphics.ResetTransform()
        i += 1
    Next
End Sub

---

Already mentioned up there bro.

Quote:

---

Originally Posted by pourkascheff

Already mentioned up there bro.

---

It does this…

Attachment 186097

If you can already do that, what is the question?

If you want the image to resize with the form...

Code:

---

Public Class Form1
   
    Private Sub Form1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Me.Paint
        Dim img As New Bitmap("C:\Users\Paul\Desktop\f09f6c88eb6a65ed641aefcff4008600.png")
        Dim sz As Integer = Math.Min(Me.ClientSize.Width, Me.ClientSize.Height) - 40
        Dim r As New Rectangle(CInt(-(sz / 2)), CInt(-(sz / 2)), sz, sz)

        e.Graphics.TranslateTransform(CSng(Me.ClientSize.Width / 2), CSng(Me.ClientSize.Height / 2))
        e.Graphics.RotateTransform(-30)
        e.Graphics.DrawImage(img, r)
        e.Graphics.ResetTransform()
       
    End Sub

    Private Sub Form1_Resize(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Resize
        Me.Refresh()
    End Sub

    Private Sub Form1_Shown(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Shown
        Me.Refresh()
    End Sub

End Class

---

Quote:

---

Originally Posted by .paul.

It does this…

---

For me, It doesn't.

Quote:

---

Originally Posted by .paul.

If you can already do that, what is the question?

---

It does not follow "rotating an image in center of a UserControl/Form anchored to its middle." for me I can show you a video.

I turned on Option strict and replaced recommended CType/CSng/CStr things...
Still not working properly.

Come on it shouldn't be this much hard. :'(((

---

*Update:
I temporarily achieved what I wanted with following try/fail coefficient (1 - x \ 6 and 1 - y \ 6)And draw relation varies for another imported image:

Code:

---

        With e.Graphics
            'Move the origin to the centre of the PictureBox.
            .TranslateTransform(Me.PictureBox1.Width \ 2, Me.PictureBox1.Height \ 2)

            'Rotate the world.
            .RotateTransform(Me.angle)

            'Size/Scale
            .ScaleTransform(CSng(2 * PictureBox1.Height / picture.Height), CSng(2 * PictureBox1.Height / picture.Height))

            'Draw the image so its centre coincides with the origin.
            .DrawImage(Me.picture, 1 - Me.picture.Width \ 6, 1 - Me.picture.Height \ 6)
        End With

---