27
Programmation Graphique Libre sous Windows Y. Mor` ere Mai 2005 esum´ e Le but de cet article est avant tout de pr´ esenter l’utilisation des logiciels libres pour la programmation graphique sous windows. Pour cela on se basera sur l’utilisation des biblio- th` eques GTK+ http://www.gtk.org/, de Glade http://glade.gnome.org/ pour win- dows pour de d´ eveloppement d’interface graphique et de DevCPP http://www.bloodshed. net/devcpp.html pour l’environnement de developpement. Cela montre aussi la facilit´ e de portage d’une application Linux (en GTK+) vers Windows sans l’utilisation de Cygwin http://www.cygwin.com/. Table des mati` eres 1 Introduction/Pr´ erequis 2 1.1 Installation de DevCPP ............................... 2 2 Programmation Graphique avec GTK+ 2 2.1 Pr´ esentation de GTK+ ................................ 2 2.2 Installation Glade/Gtk+ ............................... 3 2.3 Conversion des fichiers DevHelp en fichier .chm Aide Windows .......... 4 2.4 Cr´ eation d’interface graphique avec Glade ..................... 4 2.5 DevCPP et GTK+ : Cr´ eation, compilation et ex´ ecution du projet GTK ..... 6 2.5.1 Cr´ eation du projet .............................. 6 2.5.2 Configuration du projet ........................... 9 2.5.3 Ex´ ecution du projet ............................. 12 2.6 Utilisation des DevPak ................................ 12 2.6.1 Pr´ esentation .................................. 12 2.6.2 DevPak pour l’utilisation de GTK+ ..................... 13 3 Programmation Graphique avec FLTK 16 3.1 Pr´ esentation de FLTK ................................ 16 3.2 Installation Fluid/FLTK `a partir des sources .................... 16 3.2.1 Compilation de FLTK avec MinGW ..................... 16 3.2.2 Compilation de FLTK avec Cygwin ..................... 17 3.2.3 en´ eration d’interface avec Fluid ...................... 22 3.3 Installation Fluid/FLTK `a partir des DevPak ................... 24 3.4 Cr´ eation, configuration et compilation du projet FLTK .............. 25 3.5 Ex´ ecution du projet .................................. 26

Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Programmation Graphique Libre sous Windows

Y. Morere

Mai 2005

ResumeLe but de cet article est avant tout de presenter l’utilisation des logiciels libres pour la

programmation graphique sous windows. Pour cela on se basera sur l’utilisation des biblio-theques GTK+ http://www.gtk.org/, de Glade http://glade.gnome.org/ pour win-dows pour de developpement d’interface graphique et de DevCPP http://www.bloodshed.net/devcpp.html pour l’environnement de developpement. Cela montre aussi la facilitede portage d’une application Linux (en GTK+) vers Windows sans l’utilisation de Cygwinhttp://www.cygwin.com/.

Table des matieres

1 Introduction/Prerequis 2

1.1 Installation de DevCPP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

2 Programmation Graphique avec GTK+ 2

2.1 Presentation de GTK+ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

2.2 Installation Glade/Gtk+ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3

2.3 Conversion des fichiers DevHelp en fichier .chm Aide Windows . . . . . . . . . . 4

2.4 Creation d’interface graphique avec Glade . . . . . . . . . . . . . . . . . . . . . 4

2.5 DevCPP et GTK+ : Creation, compilation et execution du projet GTK . . . . . 6

2.5.1 Creation du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2.5.2 Configuration du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

2.5.3 Execution du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

2.6 Utilisation des DevPak . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

2.6.1 Presentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

2.6.2 DevPak pour l’utilisation de GTK+ . . . . . . . . . . . . . . . . . . . . . 13

3 Programmation Graphique avec FLTK 16

3.1 Presentation de FLTK . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

3.2 Installation Fluid/FLTK a partir des sources . . . . . . . . . . . . . . . . . . . . 16

3.2.1 Compilation de FLTK avec MinGW . . . . . . . . . . . . . . . . . . . . . 16

3.2.2 Compilation de FLTK avec Cygwin . . . . . . . . . . . . . . . . . . . . . 17

3.2.3 Generation d’interface avec Fluid . . . . . . . . . . . . . . . . . . . . . . 22

3.3 Installation Fluid/FLTK a partir des DevPak . . . . . . . . . . . . . . . . . . . 24

3.4 Creation, configuration et compilation du projet FLTK . . . . . . . . . . . . . . 25

3.5 Execution du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

Page 2: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 2

4 Programmation Graphique avec wxWindows 26

4.1 Presentation de wxWindows . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

1 Introduction/Prerequis

Il s’agit dans un premier temps, d’installer et de configurer les outils dont nous allons nousservir pour nous permettre de programmer librement sous linux.

Je considere aussi que vous avez un minimum de connaissance en ce qui concerne le C et laprogrammation a l’aide d’un IDE (Integrated Development Environment, EDI en francais).

Deux choses sont indispensables, l’IDE DevCPP et les bibliotheque de developpement de GTK+sous windows.B DevCPP est librement telechargeable a l’adresse suivante http://www.bloodshed.net/

devcpp.html et la page de download http://www.bloodshed.net/dev/devcpp.html ouplus directement http://prdownloads.sourceforge.net/dev-cpp/devcpp-4.9.9.2_setup.exe

B Glade et les librairies GTK+ sont telechargeables a l’adresse suivante http://gladewin32.

sourceforge.net/, a l’heure ou j’ecrit ces lignes, la version glib est 2.6 et gtk+ est la 2.6.7.Normalement vous n’avez besoin que de l’environnement de developpement qui contienttout. Par contre si vous desirez distribuer votre application, il faut aussi distribuer la versionruntime des librairies.

1.1 Installation de DevCPP

Il s’agit du fichier devcpp-4.9.9.2_setup.exe a executer. L’installation de DevCPP ne poseaucun probleme. Je vous conseille de conserver les chemins d’installation par defaut. En effet,comme il est base sur le compilateur GCC (issu su monde Unix), vous risquez certains problemessi vous l’installez dans le repertoire Program Files. En effet il n’aime pas trop les espaces dansles noms de chemins.

A la fin de l’installation, ne l’executer pas avant d’avoir installe les librairies GTK+. En effetce dernier scrute les fichiers entetes de l’arborescence GTK+, afin de permettre la completionautomatique des fonctions lors de la programmation.

Les sources du petit projet sont telechargeables ici : zips/projet_gtk.zip

2 Programmation Graphique avec GTK+

2.1 Presentation de GTK+

Sources : http://www.gtk-fr.org/wakka.php?wiki=PresentationGtk

GTK+ est une bibliotheque permettant de creer des interfaces graphiques (GUI) tres facilement.

A l’origine, GTK+ a ete developpe pour les besoins du logiciel de traitement d’images GIMP(GNU Image Manipulation Program). Mais aujourd’hui, le domaine d’application ne se limiteplus seulement a GIMP, mais est utilisee dans d’autres projets. Ainsi, l’environnement GNOME(GNU Network Object Model Environment) est base sur GTK+.

L’utilisation de GTK+ pour la creation de GUI est tres interessante sur plusieurs points :B GTK+ est sous licence GNU LGPL. Cela fait de GTK+ une bibliotheque libre, permettant

ainsi de l’utiliser ou de la modifier sans aucune contrainte financiere. Pour avoir plus derenseignement, le plus simple est de visiter le site du projet GNU ;

Y. Morere Programmation graphique Libre sous Windows

Page 3: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 3

B GTK+ existe sur plusieurs plates-formes. En effet, GTK+ fonctionne sur les plates-formesUNIX-like, Windows, BeOs ;

B GTK+ est utilisable avec plusieurs langages de programmation. Meme si les createurs deGTK+ ont ecris cette bibliotheque en C, sa structure orientee objets et sa licence ont permisa d’autres developpeurs d’adapter GTK+ a leur langage prefere. Ainsi, il est maintenantpossible de programmer des GUI GTK+ en C, C++, Ada, Perl, Python, PHP et biend’autres.

2.2 Installation Glade/Gtk+

Il s’agit du fichier gtk-win32-devel-2.6.7-rc1.exe a executer. Ce dernier installera Glade etles librairies GTK+ dans le repertoire c:\gtk si vous conservez les options pas defaut (ce queje vous conseille de faire pour eviter toute surprise).

N’oubliez pas, lors de l’installation de cocher la case qui va permettre a l’installateur de confi-gurer DevCPP pour qu’il prenne en compte ces librairies.

Finalement vous pouvez relancer DevCPP pour qu’il finisse de configurer en scrutant l’arbores-cence de GTK+ a la recherche des fichiers entetes.

Un fois termine, vous obtenez la fenetre suivante :

Fig. 1 – Fenetre de l’IDE DevCPP

Et sur votre bureau l’icone de glade est presente .

Y. Morere Programmation graphique Libre sous Windows

Page 4: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 4

2.3 Conversion des fichiers DevHelp en fichier .chm Aide Windows

Sous Linux, Anjuta et DevHelp forme le couple parfait pour faire des recherches sur les fonctionsGTK+ (et d’autres d’ailleurs). Sous Windows il est necesaire d’utiliser le programme Help. Pourcela il faut convertir les fichiers devhelp en fichier chm.

Pour cela il faut recuperer deux utilitaire. Un pour Unix/Cygwin qui va permettre de transfor-mer les fichiers devhelp en projet Help Windows.

DevHelp2CHM : Convert DevHelp books into CHM files, on trouveras un article a l’adressesuivante http://www.linuxeden.com/forum/blog/index.php?op=ViewArticle&articleId=

640&blogId=110848 Il est possible de telecharger le script devhelp2chm.sh a l’adresse http:

//htmlhelp.berlios.de/formats/devhelp2chm.sh

L’utilitaire de creation des fichiers .chm, Microsoft fournit l’utilitaire suivant : HTML HelpWorkshop disponible a l’adresse suivante http://msdn.microsoft.com/library/default.

asp?url=/library/en-us/htmlhelp/html/hwMicrosoftHTMLHelpDownloads.asp

Ensuite il suffit de lancer un bash Cygwin et d’effectuer les commandes suivantes pour genererles projets Windows Help.

yann@gandalf /cygdrive/c/GTK/share/gtk-doc/html

$ for i in gdk gdk-pixbuf glib gobject gtk gtkglext libglade pango&

>do

>~/devhelp2chm.sh -d $i ./$i/$i.devhelp;

>done

yann@gandalf /cygdrive/c/GTK/share/gtk-doc/html

Ensuite il faut utiliser HTML Help Workshop pour generer les fichier .chm.

Voici la totalite des fichiers .chm au format zip.

2.4 Creation d’interface graphique avec Glade

Commencez par lancer Glade. Vous obtenez les trois fenetres suivantes :

Y. Morere Programmation graphique Libre sous Windows

Page 5: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 5

Fig. 2 – Fenetres de Glade

Pour plus d’informations sur l’utilisation de Glade pour la generation d’interface je vous renvoieaux adresses suivantes :B http://wingtk.sourceforge.net/tutorial.html ;B http://eddy.writelinux.com/ ;Il s’agit toujours a partir d’une fenetre vide comme celle-ci :

Fig. 3 – Fenetre de base pour la creation d’interface

pour arriver a une application graphique terminee comme celle-ci :

Y. Morere Programmation graphique Libre sous Windows

Page 6: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 6

Fig. 4 – Fenetre finale de l’interface

Une fois l’interface graphique creee (n’oubliez pas d’enregistrer assez souvent votre travail, la

fonction annuler n’existe pas sous Glade ! ! !), sauver la par le bouton Enregistrer .

Configurez le projet a l’aide du bouton Options (langage par defaut, support gettext,repertoire du projet, etc.), puis generez le code source de l’application par le bouton Generer

Remarque : lors de la generation successive du code sourcede l’application, il arrive que lesfichiers ne soient pas mis a jour, il faut alors les effacer et reiterer la generation du code source.

Vous avez donc maintenant un interface graphique, il va maintenant falloir associer des fonc-tionnalites (donc du code source) aux actions que vous avez associees aux boutons et organescliquables de l’interface. Pour cela on va utiliser DevCPP.

2.5 DevCPP et GTK+ : Creation, compilation et execution du pro-jet GTK

La version de glade pour windows, lors de la generation de votre code source, a aussi genere,un repertoire devcpp, a l’interieur du repertoire de votre projet Glade. Ce repertoire contientune fichier config.h qui nous sera utile lors de la compilation du projet.

Comme le repertoire devcpp existe deja, on l’utilisera pour y deposer le projet devcpp.

2.5.1 Creation du projet

On commence par lancer le programme DecvCPP et dans le menu fichier on choisit nouveau

projet. On obtient alors la fenetre suivante :

Y. Morere Programmation graphique Libre sous Windows

Page 7: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 7

Fig. 5 – Creation d’un nouveau projet

Comme nous ne creons, ni une application purement windows, ni une application purementconsole, ni une dll, ni une librairie statique, on choisit empty project, avec le langage C. Onnomme par la meme occasion le projet projet-gtk.

On obtient alors la fenetre suivante :

Fig. 6 – Creation d’un nouveau projet

et il nous faut maintenant ajouter des fichiers sources et entetes a ce projet. Pour cela il suffitde cliquer avec le bouton droit sur la racine du projet et d’ajouter des fichiers comme le montreles figures suivantes :

Y. Morere Programmation graphique Libre sous Windows

Page 8: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 8

Fig. 7 – Ajout de fichier source et entete a notre projet

Fig. 8 – Ajout de tous les fichiers generes par Glade

Il suffit alors d’ajouter le fichier config.h du repertoire devcpp

Dans le fichier main.c, on oubiera pas de faire reference au fichier config.h qui se trouve dansle repertoire devcpp. Pour cela on ajoute la ligne :

#include "../devcpp/config.h"

Ce fichier contient la definition de constante comme PACKAGE_LOCAL_DIR.

On obtient alors un projet pret a compiler comme le montre la figure suivante. Malheureusement,il n’est pas compilable en l’etat (en fait il va peut etre compiler mais l’editeur de liens echouera).Il faut configurer le projet afin qu’il prenne en compte les librairies GTK lors de l’edition deliens.

Y. Morere Programmation graphique Libre sous Windows

Page 9: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 9

Fig. 9 – Projet termine pret a compiler

2.5.2 Configuration du projet

Il s’agit tout d’abord de verifier que le compilateur connait GTK+. Pour cela allez dans lemenu Outils -> Options du compilateur, puis verifiez que les chemins vers les entetes etles librairies GTK+ sont presents comme dans les figures ci-dessous.

L’installation des librairies GTK+, modifie la configuration de base de Dev-C++ (si vous avezcochez l’option a l’installation). Et donc par defaut, Dev-C++ connait les chemin vers lesfichiers entetes de GTK+. Si vous n’avez pas cocher l’option, il n’y a rien de grave, il suffit deconfigurer le projet lui-meme (cette derniere solution est d’ailleurs preferable si vous souhaitezdevelopper avec d’autres toolkits graphique)

Voici les options modifiees par l’installation de GTK+ :

Fig. 10 – Configuration du compilateur pour le support de GTK

et pour les entetes C et C++

Y. Morere Programmation graphique Libre sous Windows

Page 10: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 10

Fig. 11 – Configuration du compilateur pour le support de GTK

Voici les options a placer dans la configuration du projet :

Fig. 12 – Configuration du compilateur pour le support de GTK

et pour les entetes C et C++

Fig. 13 – Configuration du compilateur pour le support de GTK

Si vous n’avez rien de tout cela, il vous faut ajouter les chemins a la main afin que le compilateurpuisse fonctionner.

Ensuite, afin que l’editeur de liens puis fonctionner, il faut lui indiquer les chemins vers les fi-chiers .lib. Pour cela, ouvrir la fenetre de configuration du projet par options -> options du

Y. Morere Programmation graphique Libre sous Windows

Page 11: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 11

projet, puis dans l’onglet parametres, ajouter comme option du compilateur -mms-bitfileds.Sinon votre projet compilera mais ne pourra pas s’executer. L’erreur suivante se produira :

Fig. 14 – Erreur d’execution a cause de l’oubli de l’option -mms-bitfields

Puis il faut ajouter les chemins vers les bibliotheques pour l’editeur de liens. Toujours dans lememe onglet on ajoute les librairies necessaires (pour plus de facilite, on peut tout ajouter).

Fig. 15 – Ajout de librairies au projet pour l’edition de liens

On obtient donc le resultat suivant :

Fig. 16 – Configuration du projet pour la compilation et edition de liens

Comme nous avons choisi un empty project, par defaut lors du lancement de l’application,windows va ouvrir une fenetre console. Ceci peut etre utile a des fins de debuggage, maisn’est pas souhaitable si vous distribuez votre programme. Il est donc possible de configurer lecompilateur afin d’eviter l’ouverture de cette console. Toujours dans les options du projet dansl’onglet compilateur, a la ligne editeur de liens, il suffit de passer a Yes l’option Ne pas creer

de fenetre console.

Y. Morere Programmation graphique Libre sous Windows

Page 12: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 12

Fig. 17 – Configuration du projet pour eviter l’ouverture d’une fenetre console

2.5.3 Execution du projet

Voila, tout est pret, il ne nous reste plus qu’a compiler et executer le projet, option compiler

et executer du menu Projet, afin d’obtenir la fenetre suivante.

Fig. 18 – L’application est compilee et s’execute

Remarque : Si vous avez oubliee la configuration -mms-bitfields ou la suppression de lafenetre console, je vous invite a utiliser l’option nettoyer du menu Projet et de refaire unecompilation afin d’eviter tout probleme.

2.6 Utilisation des DevPak

2.6.1 Presentation

DevCpp possede un utilitaires tres interessant Dev-C++ Package Manager, qui permet d’ins-taller de nouvelles librairies de maniere simple et efficace par l’intermediaire d’une interface.

Y. Morere Programmation graphique Libre sous Windows

Page 13: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 13

Fig. 19 – Interface de gestion des DevPak

En effet les librairies sont la plupart du temps disponibles sous la forme de sources. C’estappreciable, mais il est parfois difficile de recompiler ces sources afin d’obtenir quelque chosede fonctionnel. Les concepteurs de Dev-C++ ont introduit la notion de devpak – developmentpackage (paquet de developpement, qui contiennent une version precompilee de la librairie, detelle sorte qu’un utilisateur debutant puisse l’utiliser. Dev-C++ inclus aussi plusieurs outilspour telecharger, installer et creer des paquets.

Les paquets de developpement ne sont pas seulement utilisables avec Dev-C++. En effet il s’agiten fait d’un fichier texttt.tar.bz2 deguise. Il est aussi possible de creer ses propres paquets, carDev-C++ contient uyn outil de creation de paquet PackMaker. Pour cela je vous renvoie aututoriel de Michel Weinachter sur la creation manuelle de paquet de developpement http:

//michel.weinachter.free.fr/DevPack_howto.html.

Le site de reference pour la collection de devpak est http://devpaks.org/, il y a aussi http://michel.weinachter.free.fr/

Le principal interet dans l’utilisation des DevPak, outre le fait que l’on aie pas besoin derecompiler les librairies, c’est que la plupart du temps, l’installation s’accompagne de la misene place d’un Project Wizard, pour la librairie installee. Ceci est specialement vrai pour leslibrairies graphiques. Ainsi lors de la creation d’un nouveau projet nous auront le choix decreer un projet GTK+, et les configurations du projet seront deja faites (chemins des librairies,options, chemins des entetes).

L’inconvenient majeur, est que les versions des DevPak sont souvent un peu en retrait, parrapport a la meme librairies disponibles sous la forme de sources.

De plus dans les exemples des GTK+ et FLTK, les outils annexes de creation d’interface (Gladeet Fluid) ne sont pas presents.

2.6.2 DevPak pour l’utilisation de GTK+

Il faut tout d’abord recuperer les librairies necessaires pour l’utilisation de GTK+. Voici le listedes DevPak disponible a l’adresse suivante http://devpaks.org/list.php?category=GUI.L’installation se fait dans l’ordre suivant :

1. glib 2.6.3

2. atk 1.9.0

3. pango 1.8.0

4. gtk+ 2.6.4

Y. Morere Programmation graphique Libre sous Windows

Page 14: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 14

Fig. 20 – Liste des DevPak necessaires pour la compilation d’un projet GTK

Pour installer un DevPak, soit on double-clic dessus, ou on passe par l’interface de gestiondisponlible dans le menu Outils->Gestion de Paquets.

Fig. 21 – Installation d’un DevPak

On va donc installer successivement les 4 DevPak.

Fig. 22 – Installation d’un autre DevPak

Y. Morere Programmation graphique Libre sous Windows

Page 15: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 15

Fig. 23 – Installation terminee des DevPak GTK

Tous les DevPak de GTK+ sont installes, il ne reste plus qu’a redemarrer Dev-C++ afin deprendre en compte les changements. Maintenant, lors de la creation de projet, un nouveau typede projet est disponible :

Fig. 24 – Installation d’un DevPak

Comme je l’ai deja dit, si vous ouvrer les proprietes du projet ainsi nouvellement cree, lesoptions suivantes sont deja configurees :B Pour l’onglet compilateur :

-I"<INCLUDE>\gtk-2.0"

-I"<INCLUDE>\..\lib\gtk-2.0\include"

-I"<INCLUDE>\atk-1.0"

-I"<INCLUDE>\pango-1.0"

-I"<INCLUDE>\glib-2.0"

-I"<INCLUDE>\..\lib\glib-2.0\include"

-mms-bitfields

B pour l’onglet editeur de liens-lgtk-win32-2.0

-lgdk-win32-2.0

-latk-1.0

-lgdk_pixbuf-2.0

-lpangowin32-1.0

-lgdi32

-lpango-1.0

-lgobject-2.0

-lgmodule-2.0

-lglib-2.0

-lintl

Y. Morere Programmation graphique Libre sous Windows

Page 16: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 16

Afin d’utiliser le code generer par le programme Glade, il est necessaire d’ajouter les librairieslibintl et libiconv.

Pour le reste la methode reste identique a l’utilisation sans DevPak.

3 Programmation Graphique avec FLTK

3.1 Presentation de FLTK

Source : http://www.xgarreau.org/aide/devel/langtk/cpp_fltk.php FLTK (prononcez ”full-tick”) signifie Fast Light ToolKit. C’est une librairie disponible pour plusieurs plateformes (Li-nux/Windows/MacOs X). FLTK a ete concu pour etre lie de facon statique avec les applicationsqui l’utilisent. Rappelons que cela permet de s’affranchir du controle des dependances lors de ladistribution d’une application sous forme binaire. Le mauvais point est que chaque applicationutilisant fltk est livree avec fltk, ce qui induit une occupation d’espace disque et memoire quin’est pas a priori necessaire.

Il est toutefois possible d’utiliser fltk comme un autre toolkit graphique et d’utiliser une liaisondynamique. Cette utilisation tend a se developper, fltk etant de plus en plus fourni avec lesdistributions linux.

Dans la suite j’utiliserais la version de developpement de FLTK (FLTK2.0.x), qui est encore endeveloppement, car elle permet l’utilisation d’OpenGL.

3.2 Installation Fluid/FLTK a partir des sources

3.2.1 Compilation de FLTK avec MinGW

Source : http://www-user.tu-chemnitz.de/~poenisch/FLUID-Tutorial/ Afin de pouvoircompiler la librairie sous Windows, il est necessaire d’voir 3 composant :B un compilateur C++ MinGW. Il peut etre recuperer a l’adresse suivante http://sourceforge.

net/projects/mingw/. Recuperer un Snapshot de MinGW a l’adresse suivante http://

sourceforge.net/project/showfiles.php?group_id=2435&package_id=82724

B Une console MySYS (necessaire au compilateur MinGW). Recuperer MySYS a l’adresse sui-vante http://sourceforge.net/project/showfiles.php?group_id=2435&package_id=82724

B La librairie FLTK2 disponible aux adresses : http://www.fltk.org/, et http://www.fltk.net/.

On commence par installer le compilateur MinGW, puis MySYS. A la fin de l’installationMySYS, une fenetre de commande DOS s’ouvre pour vous demander ou se trouve le compilateur.Commencez par repondre Y a la demande de configuration de post-installation, puis renseignezla question suivante avec le chemin absolu vers le compilateur MinGW, par exemple c:\MinGW.

Tout est pret pour la compilation de la librairie. IL suffit de lancer msys, vous obtenez ainsiune console Unix dans laquelle vous allez pouvoir compiler la librairie par la commande make.

On commence par decompresser l’archive de la bibliotheque dans un repertoire, soit apresl’avoir copier dans l’arborescence Unix (/home/source/fltk), soit dans l’arborescence Win-dows /c/temp/fltk.

Ensuite il suffit de lancer make pour la version 2.0.x et ./configure && make pour la version1.1.6.

A la fin de la compilation, les bilbiotheques de FLTK sont generees ainsi que le logiciel Fluidet les exemples.

Y. Morere Programmation graphique Libre sous Windows

Page 17: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 17

3.2.2 Compilation de FLTK avec Cygwin

Cygwin est un environnement Style-Linux pour windows. Il est constitue de 2 partie, une DLL(cygwin1.dll) qui agit comme une couche d’emulation de l’API (Applacation Programming In-terface) Linux, qui fournit de nombreuses fonctionnalites ; et une collection d’outils qui donnentl’impression d’etre sous Linux.

Par contre Cygwin ne permet pas d’utiliser les application Linux nativement. Il est necessairede recompiler les applications a partir des sources.

Pour installer Cygwin, il faut telecharger le fichier setup.exe a l’adresse suivante : http:

//www.cygwin.com/.

Ce dernier permet d’installer Cygwin par l’inetermediaire de votre connexion internet. En effetapres avoir fait le choix du type d’installation, du serveur et enfin des utilitaires a installer, ilva telecharger les fichiers selectionnes et les installer.

la liste des paquets necessaires est la suivante :

ash

autoconf

automake

base-files

base-passwd

bash

binutils

bzip2

coreutils

crypt

cvs

cvsutils

cygrunsrv

cygutils

cygwin

cygwin-doc

db

diffutils

editrights

expat

findutils

flex

gawk

gcc

gcc-mingw

gdbm

gettext

grep

groff

gzip

less

libiconv

libxml2

libxslt

liste_cygwin.txt

Y. Morere Programmation graphique Libre sous Windows

Page 18: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 18

login

m4

make

man

mingw-runtime

minires

mktemp

ncurses

openssh

openssl

pcre

perl

popt

readline

rsync

sed

setsid

tar

termcap

terminfo

texinfo

w32api

which

zlib

Voici en images, l’installation de Cygwin :

Fig. 25 – Installation de Cygwin

Y. Morere Programmation graphique Libre sous Windows

Page 19: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 19

Fig. 26 – Installation de Cygwin

Fig. 27 – Installation de Cygwin

Fig. 28 – Installation de Cygwin

Y. Morere Programmation graphique Libre sous Windows

Page 20: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 20

Fig. 29 – Installation de Cygwin

Fig. 30 – Installation de Cygwin

Fig. 31 – Installation de Cygwin

Y. Morere Programmation graphique Libre sous Windows

Page 21: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 21

Fig. 32 – Installation de Cygwin

Fig. 33 – Installation de Cygwin

Il faut aussi telecharger et decompresser la librairie FLTK2 (ou FLTK1) disponible aux adresses :http://www.fltk.org/, et http://www.fltk.net/.

Pour compiler la bibliotheque, on lance Cygwin et on obtient une console bash.

Fig. 34 – Console bash de Cygwin

la compilation se deroule de la maniere suivante :

Fig. 35 – Compilation de FLTK

Y. Morere Programmation graphique Libre sous Windows

Page 22: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 22

Fig. 36 – Compilation de FLTK

Une fois que tout est compile, il est possible de lancer fluid (par l’intermediaire de Cygwin,puisqu’il a ete compile avec). Voici l’interface Fluid de la version 1.1.6 de FLTK.

Fig. 37 – Fenetre principale et de widget de Fluid

3.2.3 Generation d’interface avec Fluid

C’est le programme de conception d’interface pour FLTK. C’est un editeur graphique qui estutilise pour generer du code source FLTK.

Fluid edite et sauve l’interface dans des fichiers .fl. Ce sont des fichers textes qu’il est possibled’editer (si l’on sait ce que l’on fait) afin d’obtenir des effets non geres par Fluid.

Fluid peut convertir le fichier .fl en un fichier .cxx et .h. Le fichier .cxx contient la definitionde tous les objets du fichier .fl et le fichier .h declare toutes le variables globales.

Un programme simple peut etre fait en mettant tout le code (avec la fonction main()) dans lefichier .fl, ce qui permet de generer un seul fichier .cxx pour la compilation. Mais la plupartdes programmes sont plus complexes. Il est alors necessaire d’ecrire d’autres fichier .cxx quiappellent des fonctions Fluid. Ces fichiers doivent alors inclure les fichiers oubien inclure lefichier .cxx.

D’une maniere generale, le fichier Fluid definit une ou plusieurs fonctions ou classes qui pro-duisent du code C++. Chaque fonction definit une ou plusieurs fenetres FLTK, ainsi que tousles widgets qui se tronvent a l’interieur de la fenetre.

Les widgets creees par Fluid peuvent etre nommees, nommees complexes ou non nommees.Un widget nomme doit avoir un nom de variable valide (i.e. seulement des alphanumeriqueset souligne). Dans ce cas, Fluid definit une variable globale ou un membre de classe qui va

Y. Morere Programmation graphique Libre sous Windows

Page 23: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 23

pointer sur le widget apres l’appel du constructeur (ou declaration). Un objet qui possede unnom complexe possede un . ou une -> dasn son nom. Dans ce cas Fluid assigne au nom unpointeur de widget dans tenter de le declarer. Ceci peut etre utiliser pour recuperer des widgetsdans une structure. Un widget non nomme possede un champ nom vide, et aucun pointer n’eststocke.

Les widgets peuvent aussi appeler une fonction Callback, qu’il est possible d’ecrire dans uneautre fichier source, oubien vous pouvez fournir un petit morceau de code directement dansFluid, qui va ecrire un fonction callback provee dans le fichier .cxx.

Tutoriel FLTK : http://www3.telus.net/public/robark/ Tutoriel FLTK Fluid en Alle-mand : http://www-user.tu-chemnitz.de/~poenisch/FLUID-Tutorial/ Tutoriel Fluid : http://embedded.centurysoftware.com/docs/nx/fltk-fluid.html, http://www.fltk.org/doc-2.0/fluid.html

Fig. 38 – Generateur d’interface Fluid

Y. Morere Programmation graphique Libre sous Windows

Page 24: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 24

Fig. 39 – Fenetre d’option du generateur d’interface Fluid

Fig. 40 – Interface generee par Fluid

3.3 Installation Fluid/FLTK a partir des DevPak

Comme pour GTK+, il est possible d’installer la librairie FLTK a l’aide de DevPak. Ces DevPakne sont pas disponible sur le site d’origine http://www.fltk.org/, mais sur le site http:

//www.fltk.net/. Vous aurez besoin de la librairie pthread et FLTK2. Ces deux librairies sontdisponibles aux adresses suivantes et a installer dans l’ordre :

1. http://www.fltk.net/files/devpak/libpthread.DevPak http://www.fltk.net/files/

devpak/libpthread.DevPak

Fig. 41 – DevPak necessaires pour FLTK

Comme dans le cas de GTK+, on va utiliser le gestionnaire de DevPak pour installer ceslibrairies.

Y. Morere Programmation graphique Libre sous Windows

Page 25: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 25

Ensuite lors de la creation de nouveau projet, un nouvel onglet GUI est disponible, permettantde creer un projet FLTK et FLTK OpenGL.

Fig. 42 – Nouveau projet FLTK fourni par le DevPak

Le seul probleme avec l’utilisation des DevPak est que l’utilitaire de creation d’interface Fluid

nest pas disponible.

L’avantage, comme avec GTK+, c’est que le projet est directement configure, pour une compi-lation sans probleme.

3.4 Creation, configuration et compilation du projet FLTK

Fig. 43 – Configuration des repertoires d’inclusion

Fig. 44 – Configuration des repertoires de librairies

Y. Morere Programmation graphique Libre sous Windows

Page 26: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 26

Fig. 45 – Configuration des options d’un projet FLTK

3.5 Execution du projet

Fig. 46 – Projet complet Hello avec FLTK

Fig. 47 – Execution du projet Hello avec FLTK

4 Programmation Graphique avec wxWindows

4.1 Presentation de wxWindows

Sources : http://wiki.wxwidgets.org/wiki.pl?Table_Of_Contents

wxWorks est une des toolkits les plus complet pour la creation d’interfaces graphiques. Ellecomporte de nombreuses classes. Elle est toujours en developpement, et le documentation estimportante. De plus quand cela est possible, wxWorks utilise la plateforme SDK. Cela signifie

Y. Morere Programmation graphique Libre sous Windows

Page 27: Programmation Graphique Libre sous Windows · 2011. 10. 6. · Programmation Graphique Libre sous Windows Y. Mor`ere Mai 2005 R´esum´e Le but de cet article est avant tout de pr´esenter

Documentation Graoulug 27

que les programmes compiles sous windows auront le style Windows, et que ceux compile souslinux auront le style Linux.

Il est aussi possible de developper avec wxWorks dans dautres langages que C++ (python, perl,java, lua, eiffel, C# (.NET), basic, ruby et meme javascript).

http://www.wxwindows.org/ http://wiki.wxwidgets.org/wiki.pl?Table_Of_Contents

To be continued...

Voila, c’est fini pour cette petite initiation, tous commentaires et corrections sont les bienvenusa l’adresse [email protected]

Y. Morere Programmation graphique Libre sous Windows