Interfaces graphiques Interfaces graphiques

L’interface graphique d’une application Java La plus petite application avec IUG
Frame,
• JFC (Java Foundation Classes) • c’est aussi la partie constante, présente dans toutes les applications
Panel,
− AWT (Abstract Windowing Toolkit) Button, import javax.swing.JFrame;
o première version, rôle important dans le succès de Java etc.
public class Simple1 {
o toujours présente : événements, gestionnaires de disposition
o faite de composants lourds, appariés avec des composants natifs public static void main(String[] args) {
JFrame, JFrame cadre = new JFrame("Le début de la vie");
− Swing cadre.setSize(300, 200);
JPanel,
o composants beaucoup plus nombreux et complexes cadre.setVisible(true);
JButton,
o faite de composants légers, « 100% pur Java » }
etc. }
o attention : tous les composants Swing ne sont pas supportés par
les vieilles versions de la JVM (attention aux navigateurs web !)
− ici nous allons étudier
• attention, la case de fermeture
o les composants de Swing
ne fonctionne pas
o le système des événements de AWT
o les gestionnaires de disposition (layout manager) de AWT

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 1 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 3

Interfaces graphiques Interfaces graphiques

Le haut de la hiérarchie La (presque) plus petite application avec IUG

dans AWT la classe est propriétés essentielles méthodes « révélatrices » • un comportement possible lors de l’action sur la case de fermeture
import javax.swing.JFrame;
Component visible à l’écran paint(…)
source d’événements addXXXListener(…) public class Simple2 {

Container contient d’autres composants ( add(..) public static void main(String[] args) {
JFrame cadre = new JFrame("Le début de la vie...");
gère leur placement setLayout(…) cadre.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
Window existe seul sur un écran setVisible(…) cadre.setSize(300, 200);
cadre.setVisible(true);
allocation/restitution de ressources setOwner(…) }
}
Frame permanente (caractérise l’application)
porte une barre de menus
• maintenant, la case de fermeture
Dialog fenêtres temporaires, modales (bloquantes) ou non fonctionne

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 2 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 4
Interfaces graphiques Interfaces graphiques

La (presque) plus petite application avec IUG Le mécanisme des événements

• mettons quelque chose dans ce cadre vide
import javax.swing.*;
public class Simple3 {
la source notifie l’événement
public static void main(String[] args) {
JFrame cadre = new JFrame("Le début de la vie..."); l’utilisateur agit
cadre.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); sur un composant
cadre.setSize(300, 200);
JLabel etiquette = new JLabel("Bonjour à tous");
objet source objets auditeurs …
cadre.getContentPane().add(etiquette);
cadre.setVisible(true);
}
} …
la source connaît la liste des auditeurs
pour chaque catégorie d’événements

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 5 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 7

Interfaces graphiques Interfaces graphiques

Sous classer JFrame Exemple : événements « souris »

• le travail de personnalisation est placé dans le constructeur la source notifie l’événement
l’utilisateur agit
import javax.swing.*; sur un composant

source auditeur
public class Simple4 extends JFrame {

public Simple4() {
• les événements souris sont notifiés par …
la source connaît la liste des auditeurs
super("Le début de la vie... (5)"); pour chaque catégorie d’événements
void mousePressed(MouseEvent e)
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
void mouseReleased(MouseEvent e)
this.setSize(300, 200); interface
void mouseClicked(MouseEvent e)
JLabel etiquette = new JLabel("Bonjour à tous");
void mouseEntered(MouseEvent e) MouseListener
void mouseExited(MouseEvent e)
this.getContentPane().add(etiquette);
}
• un auditeur d’événements souris « s’enregistre » par
public static void main(String[] args) {
JFrame cadre = new Simple4();
ici
void addMouseListener(MouseListener l)
cadre.setVisible(true);
} ou là la présence de cette méthode dans un objet révèle
}
qu’il peut être source de tels événements
Cours sur les IHM 2005.doc © H. Garreta, 2005 page 6 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 8
Interfaces graphiques Interfaces graphiques

Exemple : action sur un bouton Exemple : tracer une ligne polygonale

• pour commencer, placer les boutons • la mauvaise manière
public class Simple5a extends JFrame {
public Simple5a() { class Gribouilleur1 extends implements MouseListener {
super("Le début de la vie... (5)");
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); public Gribouilleur1() {
setSize(300, 200); this.setPreferredSize(new Dimension(600, 450));
this.setBackground(Color.WHITE);
JLabel etiquette = new JLabel("Ca va?"); this.addMouseListener(this);
JButton boutonOui = new JButton("Oui"); }
JButton boutonNon = new JButton("Non");
getContentPane().setLayout(new FlowLayout()); public static void main(String[] args) {
getContentPane().add(etiquette); JFrame cadre = new JFrame("Gribuillis...");
getContentPane().add(boutonOui); cadre.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
getContentPane().add(boutonNon); cadre.setContentPane(new Gribouilleur1());
} cadre.pack();
cadre.setVisible(true);
public static void main(String[] args) { }
JFrame cadre = new Simple5a();
cadre.setVisible(true); (continue…)
}
}
Cours sur les IHM 2005.doc © H. Garreta, 2005 page 9 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 11

Interfaces graphiques Interfaces graphiques

Exemple : action sur un bouton private int xPrec = -1, yPrec;

• ensuite, détecter les actions sur les boutons
public class Simple5b extends JFrame implements ActionListener { public void mouseReleased(MouseEvent e) {
if (xPrec >= 0) {
JPanel panneau = new JPanel();
Graphics g = this.getGraphics();
public Simple5b() { g.drawLine(xPrec, yPrec, e.getX(), e.getY());
... }
JButton bouton = new JButton("Vert"); this.xPrec = e.getX();
bouton.addActionListener(this); this.yPrec = e.getY();
panneau.add(bouton); }
bouton = new JButton("Rouge");
bouton.addActionListener(this); public void mousePressed(MouseEvent e) {
panneau.add(bouton); }
this.setContentPane(panneau); public void mouseClicked(MouseEvent e) {
} }
public void actionPerformed(ActionEvent e) { public void mouseEntered(MouseEvent e) {
if (e.getActionCommand().equals("Vert")) }
panneau.setBackground(Color.GREEN); public void mouseExited(MouseEvent e) {
else }
panneau.setBackground(Color.RED); }
}
...
Cours sur les IHM 2005.doc © H. Garreta, 2005 page 10 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 12
Interfaces graphiques Interfaces graphiques

Exemple : tracer une ligne polygonale Gestionnaires de disposition

• la bonne manière
class Gribouilleur2 extends JPanel implements MouseListener { connaît
... gestionnaire de disposition
private int[] x = new int[1000];
private int[] y = new int[1000];
int nbr = 0;
... getSize()
public void mouseReleased(MouseEvent e) {
setSize(…), setLocation(…)
x[nbr ] = e.getX();
getPreferredSize()
y[nbr++] = e.getY();
getMinimumSize()
repaint(); conteneur
}
...
public void paint(Graphics g) {
super.paint(g);
for (int i = 1; i < nbr; i++) composants
g.drawLine(x[i - 1], y[i - 1], x[i], y[i]);
}
...
}
connaît

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 13 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 15

Interfaces graphiques Interfaces graphiques

Auditeurs et classes anonymes Gestionnaires de disposition

public class Gribouilleur3 extends JPanel { class TestFlowLayout extends JFrame {
public Gribouilleur3() { TestFlowLayout() {
this.setPreferredSize(new Dimension(600, 450)); setSize(250, 150);
this.setBackground(Color.WHITE); getContentPane().setLayout(new FlowLayout());
this.addMouseListener(new MouseAdapter() { for (int i = 1; i <= 5; i++)
public void mouseReleased(MouseEvent e) { getContentPane().add(new JButton("Bouton " + i));
x[nbr ] = e.getX(); setVisible(true);
y[nbr++] = e.getY(); }
repaint();
} public static void main(String[] args) {
}); new TestFlowLayout();
} }
}
...
public void paint(Graphics g) {
super.paint(g);
for (int i = 1; i < nbr; i++)
g.drawLine(x[i - 1], y[i - 1], x[i], y[i]);
}
}

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 14 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 16
Interfaces graphiques Interfaces graphiques

Gestionnaires de disposition Une boîte de dialogue non triviale

class TestLayout extends JFrame {
TestLayout() {
JPanel p = new JPanel(new
p.add(new JButton("Bouton
p.add(new JButton("Bouton
p.add(new JButton("Bouton
p.add(new JButton("Bouton
p.add(new JButton("Bouton
this.setContentPane(p);
this.setSize(450, 200);
this.setVisible(true);
}
...
} BorderLayout à 2 ou 3 zones
• cet exemple illustre en même temps
BorderLayout()); − un empilement de layout managers
1"), BorderLayout.NORTH);
pour obtenir une interface complexe
2"), BorderLayout.EAST);
3"), BorderLayout.SOUTH); − le fonctionnement des boîtes de
4"), BorderLayout.WEST); dialogue pour faire des saisies
5"), BorderLayout.CENTER);
• technique :
− imbriquer des panneaux munis de
− se demander quelle zone doit garder
une largeur [hauteur] constante
et quelle zone « encaisse » les
changements de largeur [hauteur]

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 17 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 19

Interfaces graphiques Interfaces graphiques

Gestionnaires de disposition Une boîte de dialogue non triviale

class TestLayout extends JFrame { • un BorderLayout
TestLayout() {
setSize(250, 150);
getContentPane().setLayout(new GridLayout(3, 2));
for (int i = 1; i <= 5; i++)
getContentPane().add(new JButton("Bouton " + i));
setVisible(true);
}
...
}
nbr. lignes, nbr. colonnes CENTER EAST

il est préférable de donner

la valeur0 à l’un des deux

SOUTH

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 18 Cours sur les IHM 2005.doc © H. Garreta, 2005 page 20
Interfaces graphiques

Une boîte de dialogue non triviale

• un autre BorderLayout

NORTH

EAST

CENTER

SOUTH

SOUTH

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 21

Interfaces graphiques

Une boîte de dialogue non triviale

• finalisation

Grid

Grid

Flow

Flow

Cours sur les IHM 2005.doc © H. Garreta, 2005 page 22