Usare la ScrollArea

Per utilizzare un oggetto ScrollArea bisogna tenere presente alcuni accorgimenti:

1) definire con il Metodo ".ResizeContents()" l'area del contenuto che sarà disegnato nella ScrollArea.

2) considerare i valori delle Proprietà ".ScrollX" e ".ScrollY" quando si disegna dentro il gestore dell'Evento "_Draw()" (almeno per le cose che devono spostarsi con le barre di spostamento). Quando la "ScrollArea" disegna, questo Oggetto deve usare le Proprietà ".ScrollX" e ".ScrollY" per conoscere quanto si deve spostare ciò che viene disegnato dentro il gestore dell'Evento "_Draw()". Insomma, mediante le Proprietà ".ScrollX" e ".ScrollY" si definiscono le coordinate in cui si inizia a disegnare nella ScrollArea.

Mostriamo un semplice esempio pratico:

Public Sub Form_Open()
 
 With ScrollArea1
   .ResizeContents(ScrollArea1.W, ScrollArea1.H + 200)
   .ScrollBar = Scroll.Vertical
   .Background = Color.Lighter(Color.Yellow)
 End With
  
End

 
Public Sub ScrollArea1_Draw()

 With Paint
   .Brush = Paint.Color(Color.Blue)
   .LineWidth = 3.5
   .Ellipse(50, ScrollArea1.ScrollY, 200, 200)   ' oppure con il valore negativo: (..., - ScrollArea1.ScrollY, ...)
   .Stroke
   .End
 End With

End

Disegnare cerchi

In quest'altro esempio, cliccando sulla "ScrollArea", si disegnerà ogni volta un nuovo cerchio, che così apparirà posto al di sopra dell'immagine caricata.

Private im As Image
Private x As Short
Private y As Short


Public Sub Form_Open()

 im = Image.Load("/percorso/del/file/immagine")
 
 ScrollArea1.ResizeContents(im.W, im.H)
 
End


Public Sub ScrollArea1_Draw()

 With Paint
   .DrawImage(im, -ScrollArea1.ScrollX, -ScrollArea1.ScrollY)
   .Brush = Paint.Color(Color.Red)
   .LineWidth = 3.0
   .Translate(-ScrollArea1.ScrollX, -ScrollArea1.ScrollY)
   .Ellipse(x - 5, y - 5, 9, 9) 
   .Stroke
   .End
 End With
 
End


Public Sub ScrollArea1_MouseDown()

 x = Mouse.X + ScrollArea1.ScrollX
 y = Mouse.Y + ScrollArea1.ScrollY
 
 ScrollArea1.Refresh
  
End

Disegnare cerchi conservando quelli disegnati in precedenza

Di seguito un codice simile al precedente, ma in questo caso i cerchi disegnati saranno conservati e continueranno ad essere mostrati nel punto dell'immagine ove furono posti.

Private im As Image
Private x As New Short[]
Private y As New Short[]


Public Sub Form_Open()

 im = Image.Load("/percorso/del/file/immagine")
 
 ScrollArea1.ResizeContents(im.W, im.H)
 
End


Public Sub ScrollArea1_Draw()

 Dim c As Short
 
 With Paint
   .DrawImage(im, -ScrollArea1.ScrollX, -ScrollArea1.ScrollY)
   If x.Count > 0 Then
' Tenendo conto delle coordinate precedentemente salvate, disegna di nuovo ogni cerchio già disegnato:
     For c = 0 To x.Max
       .Brush = Paint.Color(Color.Red)
       .LineWidth = 3.0
       .Ellipse((x[c] - ScrollArea1.ScrollX) - 5, (y[c] - ScrollArea1.ScrollY) - 5, 9, 9)
       .Stroke
     Next
   Endif
   .End
 End With
 
End


Public Sub ScrollArea1_MouseDown()

' Raccoglie e memorizza nei due vettori le coordinate del cerchio che si disegnerà sulla "ScrollArea":
 x.Push(Mouse.X + ScrollArea1.ScrollX)
 y.Push(Mouse.Y + ScrollArea1.ScrollY)
 
 ScrollArea1.Refresh
  
End

Salvare in un file immagine quanto disegnato sulla "ScrollArea"

Nel seguente esempio, dopo aver caricato un'immagine sulla "ScrollArea", ad ogni clic con il mouse su quest'Oggetto sarà disegnato un cerchio rosso in corrispondenza del suo cursore e l'immagine, così modificata, sarà automaticamente salvata in un file immagine.

Private im As Image
Private modifica As Image
Private x As New Short[]
Private y As New Short[]
Private bo As Boolean


Public Sub Form_Open()

 im = Image.Load("/percorso/del/file/immagine")
 
 ScrollArea1.ResizeContents(im.W, im.H)
 
 modifica = im.DrawImage(im, 0, 0, im.W, im.H)
 
End


Public Sub ScrollArea1_Draw()

 Dim c As Short
 
 With Paint
   .DrawImage(im, -ScrollArea1.ScrollX, -ScrollArea1.ScrollY)
   If x.Count > 0 Then
     For c = 0 To x.Max
       .Brush = Paint.Color(Color.Red)
       .LineWidth = 3.0
       .Ellipse((x[c] - ScrollArea1.ScrollX) - 5, (y[c] - ScrollArea1.ScrollY) - 5, 9, 9)
       .Stroke
     Next
' Consente di accedere al codice seguente solo se si è cliccato sulla "ScrollArea" per creare un cerchio:
     If bo Then
       bo = False ' Impedisce che siano incontrollatamente disegnati cerchi ad ogni "scroll" della "ScrollArea:
       .Begin(modifica)
' Disegna nella immagine, che sarà poi salvata, i cerchi sinora già impostati:
       For c = 0 To x.Max
        .Brush = Paint.Color(Color.Red)
        .LineWidth = 3.0
        .Ellipse(x[c] - 5, y[c] - 5, 10, 10)
        .Stroke
       Next
' Solo dopo il clic del mouse salva immediatamente in un file .png l'immagine come sinora modificata:
       modifica.Save("/tmp/immagine_modificata.png", 100)
     Endif
   Endif
   .End
 End With

End


Public Sub ScrollArea1_MouseDown()

 x.Push(Mouse.X + ScrollArea1.ScrollX)
 y.Push(Mouse.Y + ScrollArea1.ScrollY)
 bo = True
 
 ScrollArea1.Refresh
  
End