~ / RICM4 / IHM / tds / 1-grapher-swing /

TD 1 - Grapher avec Java/Swing

Le but de ce Td est d'apprendre à programmer une application interactice avec la boîte à outils Swing de Java. Vous allez réaliser un visualisateur du graphe d'une fonction. Dans un premier temps vous vous familiariserez avec le modèle graphique 2D de Swing. Vous rendrez ensuite le visualisateur interactif en utilisant différentes techniques (e.g., widgets, manipulation directe).

Squelette d'application

Récupérez les sources du squelette de l'application. Celles-ci fournissent dans le répertoire graphser/src/ 2 packages : grapher.fc et grapher.ui (respectivement le noyau fonctionnel et l'interface graphique de notre programme). Explorez le code pour comprendre ce qu'il fait.

% tar xzvf grapher.src.tgz
ou
% gunzip grapher.src.tgz
% tar xvf grapher.src.tar

Dans le répertoire grapher/, un fichier build.xml est fourni. Il permet de gérer la compilation du programme à l'aide de ant. Lisez ce fichier et testez la compilation et l'exécution :

% cd grapher
grapher% ant run-fc
grapher% ant run

Interaction graphique

Modifiez la classe Grapher pour permettre l'interaction à la souris avec le graphique (voir les Listeners réalisés par MouseInputAdapter et MouseWheelListener) :

le drag, bouton gauche enfoncé, doit permettre de déplacer le repère, avec une petite main à la place du curseur par défaut pendant l'interaction (voir la classe Cursor) ;
le drag, bouton droit enfoncé, doit permettre de sélectionner une zone rectangulaire marquée par un rectangle pointillé, pour zoomer sur cette sélection lorsque le bouton est relâché ; et
la molette (ou le drag bouton du milieu) doit permettre de zoomer ou dézoomer, centré sur le curseur.

Placement

Rendez la liste des fonctions visibles dans une bande redimensionnable à gauche de la fenêtre (JSplitPane, JList).

Interaction avec la liste

Faites en sorte que les fonctions sélectionnées dans la liste soient affichées en gras sur le graphique.

Permettez la suppression des fonctions sélectionnées et l'ajout de nouvelles fonctions grâce à une barre de boutons (How to Use Tool Bars et JToolBar, AbstractAction, JOptionPane).

Le programme résultant pourra ressembler à cette capture :

Construction de menus

Faites en sorte que les actions (How to Use Actions et Action) d'ajout et de suppression, possibles depuis la barre de boutons, le soient aussi depuis un menu "Expression" de l'application (How to Use Menus et JMenuBar, JMenu).

Plus d'interactions

Remplacez la liste de fonctions par une table donnant pour chaque fonction une couleur (How to Use Tables et JTable, TableModel). Faites en sorte que l'expression et la couleur soient éditables (respectivement en place sous forme de texte, et par l'intermédiaire d'un sélecteur de couleur).

mise à jour : 28 février 2008