Differenze tra le versioni di "Ruotare un quadrato ed un rettangolo in una DrawingArea"

Da Gambas-it.org - Wikipedia.
 
(16 versioni intermedie di uno stesso utente non sono mostrate)
Riga 1: Riga 1:
Nella presente pagina vedremo come far ruotare su se stessi, ossia intorno al proprio asse centrale, un quadrato ed un rettangolo disegnati su una ''DrawingArea''. [[#Nota|<SUP>Nota1</sup>]]
+
Mostriamo due analoghi possibili codici <SUP>&#091;[[#Note|Nota 1]]&#093;</sup> per far ruotare su se stessi, ossia <SPAN Style="text-decoration:underline">intorno al proprio asse centrale</span>, un Quadrato ed un Rettangolo disegnati su una ''DrawingArea''. <SUP>&#091;[[#Note|Nota 2]]&#093;</sup>
 +
<BR>In entrambi gli esempi la rotazione del Quadrato e del Rettangolo viene effettuata premendo i tasti freccia in su e freccia in giù della tastiera oppure ruotando la rotellina del mouse.
  
 
+
==Ruotare un Quadrato sul proprio asse centrale==
==Ruotare un quadrato sul proprio asse centrale==
 
 
Per ottenere la rotazione sul proprio asse centrale di un quadrato disegnato in una ''DrawingArea'' è possibile adottare il seguente codice:
 
Per ottenere la rotazione sul proprio asse centrale di un quadrato disegnato in una ''DrawingArea'' è possibile adottare il seguente codice:
  <FONT Color=gray>' '''''Il fulcro di Translate agisce da vortice. Il quadrato ruoterà a seconda di dove esso si pone nel vortice.''''''</font>
+
  <FONT Color=gray>' '''''Il fulcro del Metodo ".Translate()" agisce da vortice, da centro di rotazione intorno a una ipotetica circonferenza'''''</font>
 
   
 
   
  Private fRaggio As Float  <FONT Color=gray>' ''Memorizza la lunghezza del raggio del cerchio.''</font>
+
  Private da As DrawingArea
  Private xArc As Float    <FONT Color=gray>' ''Memorizza il centro del cerchio.''</font>
+
  Private Const LATO As Short = 200   <FONT Color=gray>' ''Memorizza il lato del quadrato.''</font>
Private yArc As Float    <FONT Color=gray>' ''Idem''</font>
+
  Private fAngolo As Float           <FONT Color=gray>' ''Memorizza i gradi dell'angolo.''</font>
Private x As Float        <FONT Color=gray>' ''Memorizza l'inizio del quadrato.''</font>
+
  Private c As Integer[] = [Color.Blue, Color.Green, Color.Yellow, Color.Red]
Private y As Float        <FONT Color=gray>' ''Idem''</font>
+
  Private f As Float[] = [0, 0.34, 0.67, 1]
Private iAlt As Integer   <FONT Color=gray>' ''Memorizza l'altezza del quadrato.''</font>
 
Private iLarg As Integer  <FONT Color=gray>' ''Memorizza la larghezza del quadrato.''</font>
 
  Private fAngolo As Float <FONT Color=gray>' ''Memorizza i gradi dell'angolo.''</font>
 
  Private fSopra1 As Float  <FONT Color=gray>' ''Memorizza la posizione di partenza orizzontale della rotazione.''</font>
 
Private fSopra2 As Float  <FONT Color=gray>' ''Memorizza la posizione di partenza verticale della rotazione.''</font>
 
Private fSotto1 As Float  <FONT Color=gray>' ''Memorizza la posizione di arrivo orizzontale della rotazione.''</font>
 
  Private fSotto2 As Float <FONT Color=gray>' ''Memorizza la posizione di arrivo verticale della rotazione.''</font>
 
 
   
 
   
 
   
 
   
 
  '''Public''' Sub Form_Open()   
 
  '''Public''' Sub Form_Open()   
 
    
 
    
  Me.Center  
+
  With Me
 
+
    .W = LATO * 3
  attivaDisegno()
+
    .H = .W * 0.6
 +
    .Center
 +
    .Arrangement = Arrange.Fill
 +
  End With 
 +
 +
  With da  = New DrawingArea(Me) As "DrawingArea1"
 +
    .Background = Color.White
 +
  End With
 
    
 
    
 
  '''End'''
 
  '''End'''
+
 
+
  '''Public''' Sub DrawingArea1_Draw()
  '''Public''' Sub da_Draw()
+
 
+
  With Paint
  iLarg = 200
+
    .Brush = .LinearGradient(0, 20, 15, 0, c, f)
  iAlt = 200
+
  <FONT Color=gray>' ''Imposta il fulcro/punto della rotazione - ad esempio - al centro dell'area di disegno:''</font>
  <FONT Color=gray>' ''Se la rotazione è centrale, posiziona il quadrato al centro dell'area di disegno''
+
    <FONT Color=#B22222>.Translate</font>(da.W / 2, da.H / 2)
' ''così come le misure di partenza e di arrivo; e siccome il quadrato ruota su se stesso, si dà al raggio del cerchio mezza lunghezza del quadrato:''</font>
+
    .Rotate(Rad(fAngolo))  
  x = CFloat((da.W / 2) - (iLarg / 2))
+
    .LineWidth = 2.0
  y = CFloat((da.H / 2) - (iAlt / 2))
+
  <FONT Color=gray>' ''Disegna il quadrato.''
  fRaggio = CFloat(iLarg / 2)
+
' ''Siccome l'angolo ruota su se stesso, si dà alle coordinate del quadrato la metà della dimensione del suo lato.''
             
+
' ''Non si devono modificare i valori né i segni dei quattro argomenti qui riportati.''</font>
  <FONT Color=gray>' ''In questa dimostrazione il fulcro (vortice) è sempre il centro dell'area di disegno:''</font>
+
    .Rectangle(LATO / 2, LATO / 2, -LATO, -LATO)
  xArc = CFloat((da.W / 2))
+
  <FONT Color=gray>' ''oppure così:''
  yArc = CFloat(da.H / 2)
+
'  '''.Rectangle(-LATO / 2, -LATO / 2, LATO, LATO)'''</font>
  fSopra1 = CFloat((da.W / 2))
+
    .Stroke  
  fSopra2 = CFloat(da.H / 2)
+
    .End
  fSotto1 = CFloat(- (da.W / 2))
+
  End With     
  fSotto2 = CFloat(- (da.H / 2))
 
 
 
  With Paint
 
    .Begin(da)
 
  <FONT Color=gray>' ''Vortice:''</font>
 
    .Translate(fSopra1, fSopra2)   
 
    .Rotate(Rad(fAngolo)) 
 
    .Translate(fSotto1, fSotto2)
 
    .Rectangle(x, y, iLarg, iAlt)
 
    .Arc(xArc, yArc, fRaggio)
 
    .Stroke  
 
    .End
 
  End With     
 
 
      
 
      
 
  '''End'''
 
  '''End'''
+
 
+
  '''Public''' Sub Form_KeyPress()
  '''Public''' Sub attivaDisegno()
 
 
    
 
    
  da.Clear 
+
  Select Case Key.Code
  da.Refresh
+
    Case Key.Up
 +
      fAngolo += 1
 +
      If fAngolo = 361 Then fAngolo = 1
 +
    Case Key.Down
 +
      fAngolo -= 1
 +
      If fAngolo = -361 Then fAngolo = -1
 +
  End Select
 +
 
 +
  da.Refresh
 
    
 
    
 
  '''End'''
 
  '''End'''
 
   
 
   
 +
'''Public''' Sub Form_MouseWheel()
 
   
 
   
'''Public''' Sub btSinistra_Click()
+
  fAngolo += Mouse.Delta
 
+
  Select Case fAngolo
<FONT Color=gray>' ''Ogni volta che si agisce sul tasto incrementa il valore di un grado:''
+
    Case 361
' '''''(positivo = senso antiorario)'''''</font>
+
      fAngolo = 1
 
+
    Case -361
  fAngolo += 1
+
      fAngolo = -1
  If fAngolo = 405 Then fAngolo = 1
+
  End Select
 
 
  attivaDisegno()
 
 
 
'''End'''
 
 
   
 
   
 +
  da.Refresh
 
   
 
   
'''Public''' Sub btDestra_Click()
 
 
 
<FONT Color=gray>' ''Ogni volta che si agisce sul tasto decrementa il valore di un grado:''
 
' '''''(negativo = senso orario)'''''</font>
 
 
 
  fAngolo -= 1
 
  If fAngolo = -405 Then fAngolo = -1
 
 
 
  attivaDisegno()
 
 
 
 
  '''End'''
 
  '''End'''
 
   
 
   
+
  '''Public''' Sub Form_Resize()  <FONT Color=gray>' ''Con questo evento se cambia la dimensione del Form, il disegno non va perso.''</font>
  '''Public''' Sub Form_Resize()  <FONT Color=gray>' ''Con questo evento se cambia la dimensione del Form, il disegna non va perso.''</font>
 
 
    
 
    
  attivaDisegno()
+
  da.Refresh
 
    
 
    
 
  '''End'''
 
  '''End'''
Riga 104: Riga 85:
  
  
==Ruotare un rettangolo sul proprio asse centrale==
+
==Ruotare un Rettangolo sul proprio asse centrale==
Per ottenere la rotazione sul proprio asse centrale di un rettangolo disegnato in una ''DrawingArea'' è possibile adottare il seguente codice analogo al precedente:
+
Per ottenere la rotazione sul proprio asse centrale di un Rettangolo disegnato in una ''DrawingArea'' è possibile adottare il seguente codice identico al precedente:
  <FONT Color=gray>' '''''Il fulcro di Translate agisce da vortice. Il rettangolo ruoterà a seconda di dove esso si pone nel vortice.''''''</font>
+
  <FONT Color=gray>' '''''Il fulcro del Metodo ".Translate()" agisce da vortice, da centro di rotazione intorno a una ipotetica circonferenza'''''</font>
 
   
 
   
  Private fRaggio As Float  <FONT Color=gray>' ''Memorizza la lunghezza del raggio del cerchio.''</font>
+
  Private da As DrawingArea
  Private xArc As Float    <FONT Color=gray>' ''Memorizza il centro del cerchio.''</font>
+
  Private Const ORIZZONTALE As Short = 200  <FONT Color=gray>' ''Memorizza la dimensione di ciascun lato orizzontale.''</font>
Private yArc As Float    <FONT Color=gray>' ''Idem''</font>
+
  Private Const VERTICALE As Short = 100    <FONT Color=gray>' ''Memorizza la dimensione di ciascun lato verticale.''</font>
Private x As Float        <FONT Color=gray>' ''Memorizza l'inizio del rettangolo.''</font>
+
  Private fAngolo As Float           <FONT Color=gray>' ''Memorizza i gradi dell'angolo.''</font>
  Private y As Float        <FONT Color=gray>' ''Idem''</font>
+
  Private c As Integer[] = [Color.Blue, Color.Green, Color.Yellow, Color.Red]
Private iAlt As Integer  <FONT Color=gray>' ''Memorizza l'altezza del rettangolo.''</font>
+
  Private f As Float[] = [0, 0.34, 0.67, 1]
Private iLarg As Integer  <FONT Color=gray>' ''Memorizza la larghezza del rettangolo.''</font>
 
  Private fAngolo As Float <FONT Color=gray>' ''Memorizza i gradi dell'angolo.''</font>
 
  Private fSopra1 As Float  <FONT Color=gray>' ''Memorizza la posizione di partenza orizzontale della rotazione.''</font>
 
Private fSopra2 As Float  <FONT Color=gray>' ''Memorizza la posizione di partenza verticale della rotazione.''</font>
 
Private fSotto1 As Float  <FONT Color=gray>' ''Memorizza la posizione di arrivo orizzontale della rotazione.''</font>
 
  Private fSotto2 As Float <FONT Color=gray>' ''Memorizza la posizione di arrivo verticale della rotazione.''</font>
 
 
   
 
   
 
   
 
   
 
  '''Public''' Sub Form_Open()   
 
  '''Public''' Sub Form_Open()   
 
    
 
    
  Me.Center  
+
  With Me
 
+
    .W = Max(ORIZZONTALE, VERTICALE) * 4
  attivaDisegno()
+
    .H = .W / 2
 +
    .Center
 +
    .Arrangement = Arrange.Fill
 +
  End With 
 +
 +
  With da  = New DrawingArea(Me) As "DrawingArea1"
 +
    .Background = Color.White
 +
  End With
 
    
 
    
 
  '''End'''
 
  '''End'''
 +
 
 +
'''Public''' Sub DrawingArea1_Draw()
 
   
 
   
+
  With Paint
'''Public''' Sub da_Draw()
+
    .Brush = .LinearGradient(0, 20, 15, 0, c, f)
+
  <FONT Color=gray>' ''Imposta il fulcro/punto della rotazione - ad esempio -al centro dell'area di disegno:''</font>
  iLarg = 200
+
    <FONT Color=#B22222>.Translate</font>(da.W / 2, da.H / 2)
  iAlt = 150
+
    .Rotate(Rad(fAngolo))  
  <FONT Color=gray>' ''Se la rotazione è centrale, posiziona il rettangolo al centro dell'area di disegno''
+
    .LineWidth = 2.0
' ''così come le misure di partenza e di arrivo; e siccome il rettangolo ruota su se stesso, si dà al raggio del cerchio mezza lunghezza del rettangolo:''</font>
+
  <FONT Color=gray>' ''Disegna il rettangolo.''
  x = CFloat((da.W / 2) - (iLarg / 2))
+
' ''Siccome l'angolo ruota su se stesso, si dà alle coordinate del rettangolo la metà della dimensione di ciascun suo lato:''
  y = CFloat((da.H / 2) - (iAlt / 2))
+
' ''Non si devono modificare i valori né i segni dei quattro argomenti qui riportati.''</font>
  fRaggio = CFloat(iLarg / 2)
+
    .Rectangle(ORIZZONTALE / 2, VERTICALE / 2, -ORIZZONTALE, -VERTICALE)
             
+
  <FONT Color=gray>' ''oppure così:''
  <FONT Color=gray>' ''In questa dimostrazione il fulcro (vortice) è sempre il centro dell'area di disegno:''</font>
+
'  '''.Rectangle(-ORIZZONTALE / 2, -VERTICALE / 2, ORIZZONTALE, VERTICALE)'''</font>
  xArc = CFloat((da.W / 2))
+
    .Stroke  
  yArc = CFloat(da.H / 2)
+
    .End
  fSopra1 = CFloat((da.W / 2))
+
  End With     
  fSopra2 = CFloat(da.H / 2)
 
  fSotto1 = CFloat(- (da.W / 2))
 
  fSotto2 = CFloat(- (da.H / 2))
 
 
 
  With Paint
 
    .Begin(da)
 
  <FONT Color=gray>' ''Vortice:''</font>
 
    .Translate(fSopra1, fSopra2)   
 
    .Rotate(Rad(fAngolo)) 
 
    .Translate(fSotto1, fSotto2)
 
    .Rectangle(x, y, iLarg, iAlt)
 
    .Arc(xArc, yArc, fRaggio)
 
    .Stroke  
 
    .End
 
  End With     
 
 
      
 
      
 
  '''End'''
 
  '''End'''
+
 
+
  '''Public''' Sub Form_KeyPress()
  '''Public''' Sub attivaDisegno()
 
 
    
 
    
  da.Clear 
+
  Select Case Key.Code
  da.Refresh
+
    Case Key.Up
 +
      fAngolo += 1
 +
      If fAngolo = 361 Then fAngolo = 1
 +
    Case Key.Down
 +
      fAngolo -= 1
 +
      If fAngolo = -361 Then fAngolo = -1
 +
  End Select
 +
 
 +
  da.Refresh
 
    
 
    
 
  '''End'''
 
  '''End'''
 
   
 
   
 +
'''Public''' Sub Form_MouseWheel()
 
   
 
   
'''Public''' Sub btSinistra_Click()
+
  fAngolo += Mouse.Delta
 
+
  Select Case fAngolo
<FONT Color=gray>' ''Ogni volta che si agisce sul tasto incrementa il valore di un grado:''
+
    Case 361
' '''''(positivo = senso antiorario)'''''</font>
+
      fAngolo = 1
 
+
    Case -361
  fAngolo += 1
+
      fAngolo = -1
  If fAngolo = 405 Then fAngolo = 1
+
  End Select
 
 
  attivaDisegno()
 
 
 
'''End'''
 
 
   
 
   
 +
  da.Refresh
 
   
 
   
'''Public''' Sub btDestra_Click()
 
 
 
<FONT Color=gray>' ''Ogni volta che si agisce sul tasto decrementa il valore di un grado:''
 
' '''''(negativo = senso orario)'''''</font>
 
 
 
  fAngolo -= 1
 
  If fAngolo = -405 Then fAngolo = -1
 
 
 
  attivaDisegno()
 
 
 
 
  '''End'''
 
  '''End'''
 
   
 
   
+
  '''Public''' Sub Form_Resize()  <FONT Color=gray>' ''Con questo evento se cambia la dimensione del Form, il disegno non va perso.''</font>
  '''Public''' Sub Form_Resize()  <FONT Color=gray>' ''Con questo evento se cambia la dimensione del Form, il disegna non va perso.''</font>
 
 
    
 
    
  attivaDisegno()
+
  da.Refresh
 
    
 
    
 
  '''End'''
 
  '''End'''
Riga 207: Riga 170:
  
 
----
 
----
=Nota=
+
=Note=
[1] I codici, presenti in questa pagine, sono tratti - con modifiche ed integrazioni - da suggerimenti del membro ''Gianluigi'' del forum di ''gambas-it.org'' e del membro ''Shell'' del forum ''gambas-es.org'' .
+
[1] I codici, presenti in questa pagina, sono tratti - con modifiche ed integrazioni - da suggerimenti del membro ''Gianluigi'' del forum di ''gambas-it.org'' e del membro ''Shell'' del forum ''www.gambas-es.org'' .
 +
 
 +
[2] Vedere anche queste pagine:
 +
* [[Ruotare_un_cerchio_disegnato_in_una_DrawingArea|Ruotare un cerchio disegnato in una DrawingArea]]
 +
* [[Ruotare_qualsiasi_elemento_da_disegnare_in_una_DrawingArea|Ruotare qualsiasi elemento da disegnare in una DrawingArea]]
 +
* [[Ruotare_una_immagine_sul_proprio_asse_centrale|Ruotare una immagine sul proprio asse centrale]]

Versione attuale delle 09:11, 15 giu 2023

Mostriamo due analoghi possibili codici [Nota 1] per far ruotare su se stessi, ossia intorno al proprio asse centrale, un Quadrato ed un Rettangolo disegnati su una DrawingArea. [Nota 2]
In entrambi gli esempi la rotazione del Quadrato e del Rettangolo viene effettuata premendo i tasti freccia in su e freccia in giù della tastiera oppure ruotando la rotellina del mouse.

Ruotare un Quadrato sul proprio asse centrale

Per ottenere la rotazione sul proprio asse centrale di un quadrato disegnato in una DrawingArea è possibile adottare il seguente codice:

' Il fulcro del Metodo ".Translate()" agisce da vortice, da centro di rotazione intorno a una ipotetica circonferenza

Private da As DrawingArea
Private Const LATO As Short = 200   ' Memorizza il lato del quadrato.
Private fAngolo As Float            ' Memorizza i gradi dell'angolo.
Private c As Integer[] = [Color.Blue, Color.Green, Color.Yellow, Color.Red]
Private f As Float[] = [0, 0.34, 0.67, 1]


Public Sub Form_Open()  
 
 With Me
   .W = LATO * 3
   .H = .W * 0.6
   .Center
   .Arrangement = Arrange.Fill
 End With  

 With da  = New DrawingArea(Me) As "DrawingArea1"
   .Background = Color.White
 End With
 
End
 
Public Sub DrawingArea1_Draw()
 
 With Paint
   .Brush = .LinearGradient(0, 20, 15, 0, c, f)
' Imposta il fulcro/punto della rotazione - ad esempio - al centro dell'area di disegno:
   .Translate(da.W / 2, da.H / 2)
   .Rotate(Rad(fAngolo))   
   .LineWidth = 2.0
' Disegna il quadrato.
' Siccome l'angolo ruota su se stesso, si dà alle coordinate del quadrato la metà della dimensione del suo lato.
' Non si devono modificare i valori né i segni dei quattro argomenti qui riportati.
   .Rectangle(LATO / 2, LATO / 2, -LATO, -LATO)
' oppure così:
'  .Rectangle(-LATO / 2, -LATO / 2, LATO, LATO)
   .Stroke 
   .End
 End With     
    
End
 
Public Sub Form_KeyPress()
  
 Select Case Key.Code
   Case Key.Up
     fAngolo += 1
     If fAngolo = 361 Then fAngolo = 1
   Case Key.Down
     fAngolo -= 1
     If fAngolo = -361 Then fAngolo = -1
 End Select
 
 da.Refresh
  
End

Public Sub Form_MouseWheel()

 fAngolo += Mouse.Delta
 Select Case fAngolo
   Case 361
     fAngolo = 1
   Case -361
     fAngolo = -1
 End Select

 da.Refresh

End

Public Sub Form_Resize()   ' Con questo evento se cambia la dimensione del Form, il disegno non va perso.
  
 da.Refresh
  
End


Ruotare un Rettangolo sul proprio asse centrale

Per ottenere la rotazione sul proprio asse centrale di un Rettangolo disegnato in una DrawingArea è possibile adottare il seguente codice identico al precedente:

' Il fulcro del Metodo ".Translate()" agisce da vortice, da centro di rotazione intorno a una ipotetica circonferenza

Private da As DrawingArea
Private Const ORIZZONTALE As Short = 200   ' Memorizza la dimensione di ciascun lato orizzontale.
Private Const VERTICALE As Short = 100     ' Memorizza la dimensione di ciascun lato verticale.
Private fAngolo As Float            ' Memorizza i gradi dell'angolo.
Private c As Integer[] = [Color.Blue, Color.Green, Color.Yellow, Color.Red]
Private f As Float[] = [0, 0.34, 0.67, 1]


Public Sub Form_Open()  
 
 With Me
   .W = Max(ORIZZONTALE, VERTICALE) * 4
   .H = .W / 2
   .Center
   .Arrangement = Arrange.Fill
 End With  

 With da  = New DrawingArea(Me) As "DrawingArea1"
   .Background = Color.White
 End With
 
End
 
Public Sub DrawingArea1_Draw()

 With Paint
   .Brush = .LinearGradient(0, 20, 15, 0, c, f)
' Imposta il fulcro/punto della rotazione - ad esempio -al centro dell'area di disegno:
   .Translate(da.W / 2, da.H / 2)
   .Rotate(Rad(fAngolo))   
   .LineWidth = 2.0
' Disegna il rettangolo.
' Siccome l'angolo ruota su se stesso, si dà alle coordinate del rettangolo la metà della dimensione di ciascun suo lato:
' Non si devono modificare i valori né i segni dei quattro argomenti qui riportati.
   .Rectangle(ORIZZONTALE / 2, VERTICALE / 2, -ORIZZONTALE, -VERTICALE)
' oppure così:
'  .Rectangle(-ORIZZONTALE / 2, -VERTICALE / 2, ORIZZONTALE, VERTICALE)
   .Stroke 
   .End
 End With     
    
End
 
Public Sub Form_KeyPress()
  
 Select Case Key.Code
   Case Key.Up
     fAngolo += 1
     If fAngolo = 361 Then fAngolo = 1
   Case Key.Down
     fAngolo -= 1
     If fAngolo = -361 Then fAngolo = -1
 End Select
 
 da.Refresh
  
End

Public Sub Form_MouseWheel()

 fAngolo += Mouse.Delta
 Select Case fAngolo
   Case 361
     fAngolo = 1
   Case -361
     fAngolo = -1
 End Select

 da.Refresh

End

Public Sub Form_Resize()   ' Con questo evento se cambia la dimensione del Form, il disegno non va perso.
  
 da.Refresh
  
End



Note

[1] I codici, presenti in questa pagina, sono tratti - con modifiche ed integrazioni - da suggerimenti del membro Gianluigi del forum di gambas-it.org e del membro Shell del forum www.gambas-es.org .

[2] Vedere anche queste pagine: