Gambas 3/ImageMagick FrontEnd

Introduction

ImageMagick est une suite logicielle qui permet de travailler des images. En poursuivant votre lecture, vous allez l'installer.

Il n'y a pas d'interface graphique directement fournie par l'éditeur mais il en existe beaucoup. En créer une de plus, à notre sauce, avec Gambas me paraît être un bon exemple de front-end.

Avant tout, installez ImageMagick sur votre Linux Mint comme ceci :

• Alt+F2
• Tapez "gnome-terminal" puis entrée
• "sudo apt-get install imagemagick", entrée
• "sudo apt-get install imagemagick-doc", entrée

Vous pouvez consulter l'aide d'une des commandes sous "/usr/share/doc/imagemagick/www/convert.html"

On le voit, le sujet est complexe ! On va faire une interface ne couvrant que 0.001% des possibilités offertes par ces outils !

Création du projet

Démarrez l'environnement de développement !

Actions en détails si nécessaire :

• Alt+F2
• "gambas3", entrée

Créez un projet de type "Application graphique" !

Actions en détails si nécessaire :

• Cliquez sur Nouveau projet...
• Cliquez sur Application graphique, Application graphique GTK+ ou sur Application graphique QT !
• Suivant
• Choisissez le dossier et le nom du projet !
• Chez moi, je l'ai appelé frontend  :-P

Affichez le volet permettant d'explorer le projet avec la touche F10 si nécessaire !

Un formulaire a été automatiquement créé, c'est le FMain. Il s'agit du formulaire principal.

Vous pourriez afficher le formulaire et faire des glisser-déposer des contrôles mais je vais utiliser une autre approche pour simplifier cette démo.

Nous allons insérer un module et le nommer MMain.

Pour faire cela, faites :

• Clic droit sur le dossier Sources puis
• Nouveau
• Module
• Renommez le module MMain si nécessaire !

Howto insert a module with Gambas

Sélectionnez si nécessaire le module MMain en faisant un double-clic sur "MMain" dans le volet du projet !

Ensuite, nous allons faire en sorte que Gambas amorce l'application avec le module que nous venons d'insérer !

Observez le symbole du module et celui du formulaire ! Pour le moment, le projet démarre avec le formulaire. Pour modifier ceci :

• Clic droit sur le module MMain
• Clic sur Classe de démarrage

Howto define the startup module in Gambas

Remarquez le symbole dans le volet qui vous indique où Gambas recherche l'amorce du projet.

Ensuite Insérez le code du module MMain ! Copiez le code ci-dessous et insérez-le dans le module !

' Gambas module file

Public Const const_sWidth As String = "300"
Public Const const_sHeight As String = "85"
Public Const const_sFont As String = "Bookman-DemiItalic"
Public Const const_sFileFullname As String = "magick.png"
Public Const const_sTextToInsert As String = "Magick"

Private FMain As Form = Null
Private sWidth As String = const_sWidth
Private sHeight As String = const_sHeight
Private sFont As String = const_sFont
Private sFileFullname As String = User.Home &/ const_sFileFullname
Private sTextToInsert As String = const_sTextToInsert

Public Sub Main()

  FMain = New Form As "FMain"
  With FMain
    .Height = 550
    .Width = 500
    .Resizable = False
    '.Icon = picture.Load(Application.Path &/ "magick.png") ' import the file in the Data folder
  End With
  FMain.Show()

End

' events ...

Public Sub FMain_Open()

  Dim sResult As String
  Dim cbxEogInstalled As CheckBox
  Dim cbxImageMagickInstalled As CheckBox
  Dim FileFullname As Label
  Dim cbxFont As ComboBox
  Dim btnGenerate As Button

  FMain.Caption = "Image Generator"

  cbxEogInstalled = CreateCheckbox(FMain, 21, 252, 126, 441, False, False, "eog (Eye Of Gnome) is installed")
  Shell "whereis eog" Wait To sResult
  If sResult Like "*/usr/bin/eog*" Then
    cbxEogInstalled.Value = True
  Endif

  cbxImageMagickInstalled = CreateCheckbox(FMain, 21, 252, 126, 483, False, False, "ImageMagick is installed")
  Shell "convert -v" Wait To sResult
  If sResult Like "*ImageMagick Studio LLC*" Then
    cbxImageMagickInstalled.Value = True
  Endif

  CreateLabel(FMain, 21, 98, 119, 28, "Width")
  CreateTextBox(FMain, 28, 266, 119, 56, sWidth, "TextBoxWidth")

  CreateLabel(FMain, 21, 98, 119, 91, "Height")
  CreateTextBox(FMain, 28, 266, 119, 119, sHeight, "TextBoxHeight")

  CreateLabel(FMain, 21, 98, 119, 154, "Font")
  cbxFont = New ComboBox(FMain) As "ComboBoxValue"
  FillFontComboBox(cbxFont)
  With cbxFont
    .Name = "ComboBoxFont"
    .Height = 35
    .Width = 266
    .Top = 182
    .Left = 119
    .Text = sFont
  End With

  CreateLabel(FMain, 21, 98, 119, 224, "File Fullname")
  CreateTextBox(FMain, 28, 266, 119, 259, User.Home &/ "magick.png", "TextBoxFileFullname")

  CreateLabel(FMain, 21, 98, 119, 294, "Text")
  CreateTextBox(FMain, 28, 266, 119, 322, "Magick", "TextBoxTextToInsert")

  btnGenerate = New Button(FMain) As "Button"
  With btnGenerate
    .h = 28
    .w = 266
    .Top = 385
    .Left = 119
    .Text = "Generate"
  End With

End

Public Sub ComboBoxValue_Change()

  Dim i As Integer
  Dim cbx As ComboBox

  For i = 0 To FMain.Children.Count - 1
    If FMain.Children[i].Name = "ComboBoxFont" Then
      cbx = FMain.Children[i]
      sFont = cbx.Text
    Endif
  Next

End

Public Sub TextBoxValue_Change()

  Dim i As Integer
  Dim tb As TextBox

  For i = 0 To FMain.Children.Count - 1
    If FMain.Children[i].Name = "TextBoxWidth" Then
      tb = FMain.Children[i]
      sWidth = Trim(tb.Text)
    Endif
    If FMain.Children[i].Name = "TextBoxHeight" Then
      tb = FMain.Children[i]
      sHeight = Trim(tb.Text)
    Endif
    If FMain.Children[i].Name = "TextBoxFileFullname" Then
      tb = FMain.Children[i]
      sFileFullname = Trim(tb.Text)
    Endif
    If FMain.Children[i].Name = "TextBoxTextToInsert" Then
      tb = FMain.Children[i]
      sTextToInsert = Trim(tb.Text)
    Endif
  Next

End

Public Sub Button_Click()

  Dim sCmd As String

  sCmd = "convert -size " & sWidth & "x" & sHeight
  sCmd &= " canvas:none -font " & sFont & " -pointsize 72"
  sCmd &= " -draw \"text 25,60 '" & sTextToInsert & "'\" -channel RGBA -blur 0x6 -fill darkred -stroke magenta"
  sCmd &= " -draw \"text 20,55 '" & sTextToInsert & "'\" " & sFileFullname

  'Message.Info(sCmd, "ok")

  Shell sCmd Wait
  Shell "eog " & sFileFullname

End

' utilities ...

Private Sub FillFontComboBox(ByRef c As ComboBox)

  Dim f As String

  For Each f In Fonts
    c.Add(f)
  Next

End

Private Function CreateTextBox(ByRef Parent As Form, H As Integer, W As Integer, X As Integer, Y As Integer, Value As String, ControlName As String) As TextBox

  Dim t As TextBox

  t = New TextBox(Parent) As "TextBoxValue"
  With t
    .Name = ControlName
    .Height = H
    .Width = W
    .Top = Y
    .Left = X
    .Text = Value
  End With

  Return t

End

Private Function CreateLabel(ByRef Parent As Form, H As Integer, W As Integer, X As Integer, Y As Integer, Caption As String) As Label

  Dim l As Label

  l = New Label(Parent)
  With l
    .Height = H
    .Width = W
    .Top = Y
    .Left = X
    .Text = Caption
  End With

  Return l

End

Private Function CreateCheckbox(ByRef Parent As Form, H As Integer, W As Integer, X As Integer, Y As Integer, Value As Boolean, Enabled As Boolean, Caption As String) As Checkbox

  Dim c As CheckBox

  c = New CheckBox(Parent)
  With c
    .Text = Caption
    .Height = H
    .Width = W
    .Top = Y
    .Left = X
    .Value = Value
    .Enabled = Enabled
  End With

  Return c

End

'

Important ; Supprimez le formulaire créé automatiquement :

• Clic-droit sur le formulaire FMain
• Supprimer !

Le code paraît compliqué. C'est uniquement parce que j'ai fait en sorte que tout apparaît dans un module. Faire des drag-and-drop et utiliser les événement est bien plus simple. Si vous voulez, essayez de le faire en vous basant sur le code ci-dessus !

Ce front-end ne contient qu'une fenêtre. C'est volontairement trop simple pour tester. Démarrez l'application et testez !

L'interface graphique que nous fournissons par le biais de Gambas permet à l'utilisateur de saisir les données. Quand le bouton "Generate" est cliqué, l'application appelle la commande "convert" fournie pas ImageMagick (/usr/bin/convert).

L'exécutable convert fait le vrai travail : il crée une image avec un texte qu'on lui donne.

Quand il a fini, on appelle Eye Of GNOME, eog pour les intimes qui va afficher l'image et c'est tout.

Vous pouvez générer l'exécutable, ouvrir un terminal et démarrer l'application graphique de la même façon que l'application console :

gbr3 frontend.gambas

Vous savez maintenant comment générer un autre type d'application graphique : les applications front-end.