Small Basic - Les Bases : La Fenêtre Graphique GraphicsWindow (fr-FR)
Cet article traite des bases de l'utilisation de la Fenêtre Graphique (objet GraphicsWindow) en Small Basic.
L'objet GraphicsWindow de Small Basic possède 3 couches qui s'affichent au dessus de la précédente.
Les Couches de GraphicsWindow
Couche 1 - Le Fond
La couche la plus basse est uniquement contrôlée par la propriété GraphicsWindow.BackgroundColor. Lorsque cette propriété est modifiée la couleur du fond et les dessins et les formes ne sont pas modifiés.
GraphicsWindow. BackgroundColor = "Black"
GraphicsWindow.DrawEllipse(100,100,50,50)
Program.Delay(1000)
GraphicsWindow. BackgroundColor = "Red"
Couche 2 - Les Dessins
Au dessus du fond sont placés des objets qui sont dessinés. Ces objets dessins sont créés à partir des méthodes GraphicsWindow.Draw… et GraphicsWindow.Fill…. Ils sont très pour des objets qui ne doivent pas bouger, être supprimés ou modifiés facilement.
Couche 3 – Formes et Contrôles
Par dessus le fond et les dessins se trouvent les formes qui "flottent" au dessus des autres couches. On les créés avec les méthodes Shapes.Add… et Controls.Add…. Ces objets peuvent être déplacés et modifiés de différentes manières, et sont très utiles pour déplacer des objets.
Les formes incluent des images. Il est souvent préférable de précharger les images en utilisant l'objet ImageList et d'utiliser des images png si votre image à des zones transparentes.
sbImage = ImageList.LoadImage("http://i.msdn.microsoft.com/ff384126.SmallBasicBlocks(en-us,MSDN.10).jpg")
sbLogo = Shapes.AddImage(sbImage)
Shapes.Move(sbLogo,100,100)
A noter que la commande GraphicsWindow.Clear() supprimera TOUS les dessins et les formes, laissant seulement la couleur de fond et tout le reste devra être reconstruit.
Les Propriétés des Formes
Les formes sont des objets très intéressants car ils peuvent être créés et supprimés et certaines propriétés modifiées.
Toutes ces manipulations se trouvent dans les méthodes de l'objet Shape et sont applicables aussi bien aux formes qu'aux contrôles. Certaines formes possède une couleur intérieure qui peut être définie par la propriété GraphicsWindow.BrushColor, et les lignes (ou bordure) sont définies par GraphicsWindow.PenColor et GraphicsWindow.PenWidth.
Les formes peuvent être déplacées, redimensionnées (zoomées), pivotées, masquées, réaffichées, supprimées et leur opacité (transparence) modifiée.
square = Shapes.AddRectangle(50,50)
Program.Delay(1000)
Shapes.Move(square,200,200)
Program.Delay(1000)
Shapes.Zoom(square,2,2)
Program.Delay(1000)
Shapes.Rotate(square,45)
Program.Delay(1000)
Shapes.HideShape(square)
Program.Delay(1000)
Shapes.ShowShape(square)
Program.Delay(1000)
Shapes.SetOpacity(square,50)
Program.Delay(1000)
Shapes.Remove(square)
Déplacement des Formes
Pour déplacer une forme nous avons besoin de définir les coordonnées (x et y) de la nouvelle position. En Small Basic, x est le nombre de pixels depuis le bod gauche et y est le nombre de pixel depuis le bord haut. Les deux valeurs x et y démarrent à 0, depuis de le coin supérieur gauche de GraphicsWindow.
La position d'une forme est définie par un "cadre". Ce cadre est un rectangle qui couvre complètement la forme lorsqu'elle est créée. La position de la forme est définie par le coin supérieur gauche du cadre. Le cadre possède une largeur et une hauteur qui correspondent à la taille définie lorsque la forme a été créée.
- Si une forme à une largeur w et une hauteur h, alors pour positionner la forme avec son centre (x,y), nous devons définir le coin supérieur gauche à (x-w/2,y-h/2).
- Notez, que lorsqu'une forme pivotée ou redimensionnée et déplacée, elle s'affiche comme si la rotation ou le redimensionnement étaient effectués après le movement de positionnement - la position et le coin supérieur gauche du cadre non pivoté ni redimensionné.
Dans les images ci-dessus, 3 formes ellipses sont créées et déplacées. Le cadre de chaque ellipse est affiché en rouge. La seconde image a été redimensionnée et la troisième été agrandie et pivotée. Remarquez que la seconde et troisième ellipses sont toujours positionnées par le coin supérieur gauche de leur cadre original.
Pour créer un mouvement nous avons besoin de déplacer la forme par une série d'étapes. Souvent il est préférable de stocker la position et peut-être la vitesse dans des variables. Ceci nous permet également de connaître la position d'une forme dans le code de notre programme.
' Créer une balle
ball = Shapes.AddEllipse(50,50)
' Position initiale
xPos = 100
yPos = 100
' Vitesse initiale
xVel = 1
yVel = 2
While ("True")
' Actualise la position
xPos = xPos+xVel
yPos = yPos+yVel
' Rebondi sur les murs
If (xPos < 25 Or xPos > GraphicsWindow.Width-25 ) Then
xVel = -xVel
EndIf
If (yPos < 25 Or yPos > GraphicsWindow.Height-25 ) Then
yVel = -yVel
EndIf
' Actualise la position
Shapes.Move(ball,xPos-25,yPos-25)
' On attends un peu pour lisser le mouvement
Program.Delay(5)
EndWhile