Ruotare un'immagine sul proprio asse centrale in una DrawingArea

Nel caso in cui si debba far ruotare in una DrawingArea un'immagine sul proprio asse centrale ^{[nota 1]}, sia essa quadrata o rettangolare, si potrà adottare il seguente codice (cliccando sulla "DrawingArea", si avvierà la rotazione dell'immagine):

Private DrawingArea1 As DrawingArea
Private im As Image
Private fAngolo As Float

Public Sub Form_Open()

 With Me
   .Move(0, 0, Screen.AvailableWidth, Screen.AvailableHeight)
   .Arrangement = Arrange.Fill
 End With

 DrawingArea1 = New DrawingArea(Me) As "DrawingArea1"
 
 im = Image.Load("/percorso/della/immagine")
 
End


Public Sub DrawingArea1_MouseUp()  ' Cliccando sulla "DrawingArea", si avvierà la rotazione dell'immagine

 While Object.IsValid(DrawingArea1)
   fAngolo += 10.0
   DrawingArea1.Refresh
   Wait 0.1
 wend

End


Public Sub DrawingArea1_Draw()

 With Paint
' Pone il centro di rotazione al centro della "DrawingArea".
' Il fulcro del Metodo ".Translate()" agisce da centro di rotazione intorno a una ipotetica circonferenza.
   .Translate(DrawingArea1.W / 2, DrawingArea1.H / 2)
' Ponendo un valore negativo come parametro della funzione "Rad()", si otterrà la rotazione in senso orario:
   .Rotate(Rad(-fAngolo))
   .DrawImage(im, -im.W / 2, -im.H / 2, im.W, im.H, 1.0, Null)
   .End
 End With

End

Un altro esempio può essere il seguente:

Private DrawingArea1 As DrawingArea
Private angle As Float
Private img As Image


Public Sub Form_Open()
 
 With Me
   .Move(0, 0, Screen.AvailableWidth, Screen.AvailableHeight)
   .Resizable = False
   .Title = "Rotazione immagine 2D"
   .Arrangement = Arrange.Fill
 End With

 DrawingArea1 = New DrawingArea(Me) As "DrawingArea1"

 img = Image.Load("/percorso/del/file/immagine")
 
' Imposta il Timer per animare (es. 30 fps):
 Timer1.Delay = 33
 Timer1.Start

End


Public Sub Timer1_Timer()

' Incrementa l'angolo (rotazione continua):
 angle += 2
' Resetta l’angolo dopo un giro completo:
 If angle >= 360 Then angle = 0

 DrawingArea1.Refresh

End


Public Sub DrawingArea1_Draw()

' Calcola il centro della DrawingArea:
 Dim cx As Float = DrawingArea1.Width / 2
 Dim cy As Float = DrawingArea1.Height / 2

' Sposta l'origine delle coordinate al centro della "DrawingArea":
 Paint.Translate(cx, cy)

' Ruota il sistema di coordinate di "angle" gradi (convertiti in radianti):
 Paint.Rotate(Rad(angle))

' Disegna l'immagine centrata:
 Paint.DrawImage(img, -img.Width / 2, -img.Height / 2)

 Paint.End

End

Far ruotare un'immagine, avente sfondo trasparente, su un'altra immagine

In questo caso si riprenderà il codice sopra mostrato, aggiungendo nella Sub "DrawingArea1_Draw()" semplicemente la riga necessaria per mostrare l'immagine di base che resterà ferma:

Private DrawingArea1 As DrawingArea
Private qd As Image
Private im As Image
Private fAngolo As Float

Public Sub Form_Open()

 With Me
   .W = Screen.AvailableWidth * 0.33
   .H = Screen.AvailableHeight * 0.33
   .Arrangement = Arrange.Fill
 End With
 DrawingArea1 = New DrawingArea(Me) As "DrawingArea1"
 
 qd = Image.Load("/usr/share/icons/Gruvbox-Material-Dark/64x64/apps/simon.svg")
 im = Image.Load("/usr/share/icons/Gruvbox-Material-Dark/32x32/apps/simon.svg")
 
End


Public Sub Form_MouseWheel()  ' Ruotando la rotellina del mouse, si produrrà la rotazione dell'immagine superiore

 fAngolo += Mouse.Delta

 DrawingArea1.Refresh

End


Public Sub DrawingArea1_Draw()

 With Paint
' Disegna l'immagine inferiore che resterà ferma:
   .DrawImage(qd, (DrawingArea1.W / 2) - (qd.W * 0.5), (DrawingArea1.H / 2) - (qd.H * 0.5), qd.W, qd.H, 1.0, Null)
' Pone il centro di rotazione al centro della "DrawingArea".
' Il fulcro del Metodo ".Translate()" agisce da centro di rotazione intorno a una ipotetica circonferenza.
   .Translate(DrawingArea1.W / 2, DrawingArea1.H / 2)
   .Rotate(Rad(fangolo))
   .DrawImage(im, -im.W / 2, -im.H / 2, im.W, im.H, 1.0, Null)
   .End
 End With

End

Far ruotare due immagini sovrapposte, ciascuna in senso inverso rispetto all'altra

In questo caso abbiamo nuovamente due immagini sovrapposte. Quella posta al livello superiore, avrà sfondo trasparente.
Il seguente codice farà sì che ciascuna immagine ruoti in senso inverso rispetto all'altra.

Private DrawingArea1 As DrawingArea
Private qd As Image
Private im As Image
Private fAngolo As Float

Public Sub Form_Open()

 With Me
   .W = Screen.AvailableWidth * 0.33
   .H = Screen.AvailableHeight * 0.33
   .Arrangement = Arrange.Fill
 End With
 DrawingArea1 = New DrawingArea(Me) As "DrawingArea1"
 
 qd = Image.Load("/usr/share/icons/Gruvbox-Material-Dark/64x64/apps/simon.svg")
 im = Image.Load("/usr/share/icons/Gruvbox-Material-Dark/32x32/apps/simon.svg")
 
End


Public Sub DrawingArea1_MouseUp()  ' Cliccando sulla "DrawingArea", si produrrà la rotazione delle due immagini

 While Object.IsValid(DrawingArea1)
   fAngolo += 10.0
   DrawingArea1.Refresh
   Wait 0.1
 Wend

End


Public Sub DrawingArea1_Draw()

 With Paint
   .Translate(DrawingArea1.W / 2, DrawingArea1.H / 2)
   .Rotate(Rad(-fangolo))
   .DrawImage(qd, -qd.W / 2, -qd.H / 2, qd.W, qd.H, 1.0, Null)
   .End
 End With
 With Paint
   .Begin(DrawingArea1)
   .Translate(DrawingArea1.W / 2, DrawingArea1.H / 2)
   .Rotate(Rad(fangolo))
   .DrawImage(im, -im.W / 2, -im.H / 2, im.W, im.H, 1.0, Null)
   .End
 End With

End

Nota

[1] Vedere anche le seguenti pagine:

• Ruotare qualsiasi elemento da disegnare in una DrawingArea
• Ruotare una immagine sul proprio asse centrale