Koda FormDesigner

Amesam/ mars 29, 2020/ Programmation

Koda(FormDesigner)
  • Cet outil pour AutoIt vous permet de construire votre Gui. Vous pouvez agir sur les dimensions, les couleurs, la police, le nom de vos boutons, vos labels.. mais aussi le nom de vos variables …
  • Koda(FormDesigner) se trouve dans Scite, via le menu Outils ou avec les touche Alt+M
  • Dans ce tuto nous allons voir les bases car cet outil offre beaucoup de possibilités.
Présentation de l’outil Koda FormDesigner

 

Image
  • Dans la partie centrale nous voyons Form1, ceci est la GUI, votre interface. Nous allons donc construire cette GUI.
  • Par défaut Koda est en Anglais on peut le passer en Français. Pour cela cliquer sur Options ou les touche Ctrl+K, puis dans Langage sélectionner Français.
Image
  • Pour les reste des options elles sont par défaut bien réglées, vous pouvez tout de même sous la partie Barre d’outils adapter et la modifier selon vos besoins.
  • J’ai fait un exemple en vidéo, interface simple mais c’est un exemple pour montrer qu’en quelques minutes on peut se faire une petite GUI.
Image

Le code édité par Koda :

Code : Tout sélectionner

#include <ButtonConstants.au3>
#include <EditConstants.au3>
#include <GUIConstantsEx.au3>
#include <StaticConstants.au3>
#include <WindowsConstants.au3>
#Region ### START Koda GUI section ### Form=
$hGUI = GUICreate("MA GUI", 418, 362, 2407, 196)
GUISetBkColor(0xC0C0C0)
$Label1 = GUICtrlCreateLabel("Voici ma GUI", 24, 8, 110, 24)
GUICtrlSetFont(-1, 12, 800, 0, "MS Sans Serif")
GUICtrlSetColor(-1, 0x0000FF)
$Edit1 = GUICtrlCreateEdit("", 16, 152, 385, 193)
GUICtrlSetData(-1, "Edit1")
$btACT1 = GUICtrlCreateButton("Action 1", 24, 48, 105, 25)
GUICtrlSetFont(-1, 10, 800, 0, "MS Sans Serif")
GUICtrlSetColor(-1, 0x0000FF)
GUICtrlSetBkColor(-1, 0x808000)
$btACT2 = GUICtrlCreateButton("Action  2", 24, 80, 105, 25)
GUICtrlSetFont(-1, 10, 800, 0, "MS Sans Serif")
GUICtrlSetColor(-1, 0x0000FF)
GUICtrlSetBkColor(-1, 0x808000)
$btACT3 = GUICtrlCreateButton("Action 3", 24, 112, 105, 25)
GUICtrlSetFont(-1, 10, 800, 0, "MS Sans Serif")
GUICtrlSetColor(-1, 0x0000FF)
GUICtrlSetBkColor(-1, 0x808000)
$ckNIV1 = GUICtrlCreateCheckbox("Niveau 1", 168, 48, 97, 17)
GUICtrlSetFont(-1, 8, 800, 0, "MS Sans Serif")
$ckNIV2 = GUICtrlCreateCheckbox("Niveau 2", 168, 80, 97, 17)
GUICtrlSetFont(-1, 8, 800, 0, "MS Sans Serif")
$ckNIV3 = GUICtrlCreateCheckbox("Niveau 3", 168, 112, 97, 17)
GUICtrlSetFont(-1, 8, 800, 0, "MS Sans Serif")
$Label2 = GUICtrlCreateLabel("Niveau :", 168, 24, 61, 20)
GUICtrlSetFont(-1, 10, 800, 0, "MS Sans Serif")
$Pic1 = GUICtrlCreatePic("E:\AutoIT\Files Folders Search\1308547900.jpg", 280, 24, 113, 113)
GUISetState(@SW_SHOW)
#EndRegion ### END Koda GUI section ###

While 1
	$nMsg = GUIGetMsg()
	Switch $nMsg
		Case $GUI_EVENT_CLOSE
			Exit

	EndSwitch
WEnd

– Il nous reste à saisir nos actions attribuer aux variables de la GUI. La partie la plus complexe Image

  • Commençons par la partie supérieur de l’outil qui nous offre plusieurs possibilités pour construire sa GUI.
– Dans la partie supérieur de la fenêtre vous avez les onglets Standard, Additional, Win32 et Custom, vous trouverez les différents objets disponibles pour la création de votre fenêtre.
Image
Image
Image
Image
Dans la partie supérieur gauche vous avez des icônes avec une flèche verte; La petite flèche verte va vous permettre de générer le code que vous pourrez coller dans un script et pour la grosse flèche, lancer l’interface graphique afin de voir le résultat graphique. Vous pouvez voir aussi les autres icônes ouvrir des projets ou enregistrer.
Image
– La fenêtre de droite Form List contient la liste de toutes les fenêtres qui aurait pu être crées pour votre projet. Elles peuvent être multiples.
Image
– Dans la partie gauche, vous trouverez une fenêtre Object TreeView. Cette fenêtre contient la liste des objets (graphique ou non) de la GUI en cours de traitement, par exemple ici les groupes de projet.
Image
Ci-dessous, ce nomme Object Inspector, qui vous donne l’ accès à presque tout les éléments de contrôle d’un objet.
A partir de cette fenêtre, vous pouvez en fonction de l’objet régler la taille, la position, le nom, le contenu, la couleur …
Dans la partie inférieure, des onglets : Properties, Styles et ExStyles avec qui vous pouvez régler d’autres éléments de l’objet.

 

Image

  • Voici une présentation simple mais qui vous permettra d’apprivoiser cet outil qui est pour tout simplement génial.
  • Voici quelques exemple de GUI que l’on peut construire (Attention certaines des interfaces ci-dessous demande plus que Koda) :
Image
Image
Image
Image
Image
Image
Image
Avatar du membre

Amesam Administrateur du site

Share this Post