Interface Graphique Java : AWT/Swing – Composants Bases et Méthodes Pratiques

Page 1 sur 33Lecteur de document UniversityLib

Interface Graphique Java : AWT/Swing – Composants Bases et Méthodes Pratiques

Programming, Math, etc. · course

Browse all programmation documents

COURS

ABSTRACT

WINDOW

TOOLKIT

1

GÉNÉRALITÉS

Le package AWT : contient

les classes

graphiques de base

Ces

Avec

à

les

sur

classes

versions

s’appuient

propres

des

chaque

implémentations

système d’exploitation (Windows, Unix, …)

un

nouveau package est apparu : SWING qui

ne repose pas sur le système graphique de

des

chaque

composantes

dessinés

(similaire par son utilisation à AWT)

système mais

entièrement

nouvelles

propose

1.2

Il

existe

des

outils

de

permettant de concevoir visuellement

interfaces

automatiquement le code Java associé

graphiques

de

et

conception

les

générer

2

HIÉRARCHIE DES CLASSES AWT

3

Object(from lang)ComponentContainerPanelApplet(from applet)FileDialogDialogFrameWindowButtonCanvasCheckboxChoiceLabelTextComponentScrollbarListTextAreaTextFieldLA CLASSE COMPONENT

 La classe Component est la classe de base de

tous les composants graphiques visibles

 Un « component» est un objet ayant une

représentation graphique qui peut être affichée sur

écran pouvant interagir avec l’utilisateur (Ex:

boutons, checkbox, …)

 Cette classe définit presque toutes les méthodes

utiles (souvent redéfinies par ses classes filles)

 Ses classes filles :

▪ Button : un bouton

▪ Canvas : pour dessiner quelque chose de spécifique

n’a pas de représentation graphique visible)

▪ Label

: texte affiché

▪ TextComponent

▪ TextField : une ligne de texte éditable

▪ TextArea : plusieurs lignes de textes éditables

▪ List : une liste de choix sur une colonne

▪ Choice : une boite de choix (liste défilante)

▪ CheckBox : Case à cocher

▪ CheckBoxGroup : Bouton radio

▪ Scrollbar : ascenseur

▪ Container : représente des composants pouvant

contenir d’autre composants

4

EXEMPLE

5

QUELQUES MÉTHODES DE LA

CLASSE COMPONENT

 Géométrie du composant :

▪void setLocation(Point p): Change la position du

composant.

▪void setSize(Dimension d): Change la taille du

composant.

▪void setBounds(Rectangle r): Change la taille et la

position.

▪Rectangle getBounds(): Permet de récupérer

la

position et la dimension du composant.

▪Dimension getPreferredSize(): Retourne

la"meilleure" dimension pour afficher le composant

(tient compte de son contenu, de son

environnement…)

▪ Un objet de la classe java.awt.Rectangle représente un

Il contient 4 attributs publics définissant sa

rectangle.

position (x et y) du coin supérieur gauche et sa taille

(width et height)

▪ Un objet de la classe java.awt.Point représente un point

Il contient 2 attributs publics

dans l'espace graphique.

définissant sa position (x et y).

▪ Un objet de la classe java.awt.Dimension représente une

Il contient 2 attributs publics

largeur et une hauteur.

définissant cette taille (width et height).

6

QUELQUES MÉTHODES DE LA

CLASSE COMPONENT

: Permet de savoir

: Affiche ou masque le

 Comportement du composant :

void setVisible(boolean)

composant

boolean isVisible ()

composant est visible

void requestFocus()

prendre la main (il devient

graphiquement).

void setEnabled (boolean) : Active ou désactive le

composant (Ex : bouton grisé ou non).

boolean isEnabled()

composant est actif.

: Permet à un composant de

le composant actif

: Permet de savoir

si un

le

si

 Aspect du composant :

void setBackground (Color c):Couleur d'arrière plan.

Color getBackground ( ) : Couleur d'arrière plan.

void setForeground (Color c)

plan.

Color getForeground( ) : Couleur d'avant plan.

Couleur

:

d'avant

Un objet de la classe Color représente une couleur. Un objet

Advertisement

de cette classe est construit en passant au constructeur trois

valeurs comprises entre 0 et 255 et représentant le Rouge, le

Vert et le Bleu (codage RGB, au total 16 millions de couleur).

Plusieurs couleurs sont prédéfinies sous la forme d'attributs

static de la classe : Color.white, Color.black, ..

7

LA CLASSE CONTAINER

 La classe Container sous classe de la classe

Component représente un composant graphique

capable de contenir plusieurs autres composants y

compris d’autres Container

 Ses classes filles :

▪ Window : représente une fenêtre vide sans rebord

ni barre de titre

▪ Frame : représente une fenêtre possédant une

barre de titre et dont l’apparence est proche des

fenêtres « normales » de l’environnement

d’exécution

▪ Dialog : représente une boite de dialogue

(fenêtre qui récupère les données à partir de

l’utilisateur )

▪ FileDialog : représente une boite de dialogue à partir de

laquelle on peut sélectionner un fichier

▪ Panel : permet de représenter différents éléments

graphiques en les liant entre eux dans une certaine

politique de disposition

8

QUELQUES MÉTHODES DE LA

CLASSE CONTAINER

 Un Container dispose de toutes les méthodes que nous

avons vues dans le chapitre précédent (puisqu'il s'agit

aussi d'un composant…)

 Les méthodes propres aux conteneurs seront surtout

le retrait de composants dans ce

liées à l'ajout et

conteneur.

 Méthodes propres aux Container :

▪ void add (Component c) : Ajoute le composant c dans

le conteneur.

▪ void add (Component c, Object contrainte) : Ajoute le

composant c dans le conteneur en fonction de la

contrainte fournie (qui dépend de la politique de

disposition actuelle)

▪ void remove(Component c): Supprime le composant c

du conteneur.

 Méthodes propres à la classe Frame :

▪ void pack() : Permet de calculer une taille idéale de la

fenêtre en fonction de la taille de tous les composants

qui se trouvent à l'intérieur et de la politique de

disposition associée à ce Frame

Remarque : Par défaut, une fenêtre (Window ou Frame)

est masquée et possède une taille nulle. Il faudra donc

(méthode setVisible(true)) et à

penser à la montrer

changer sa taille (méthode setSize(…) ou pack()).

9

LES GESTIONNAIRES

D’ASPECT

 L’interface LayoutManager est l’interface qui permet de

définir les différentes politiques de disposition des

composants dans un conteneur

 Pour associer un gestionnaire d’aspect à un conteneur,

il suffit d’utiliser la méthode du conteneur suivante :

void setLayout(LayoutManager l)

 Remarque : chaque conteneur possède un gestionnaire

d’aspect par défaut

 Quelques gestionnaires fournis avec AWT :

▪ FlowLayout : les composants sont placés les uns à côté des

autres (gestionnaire d’aspect par défaut des Panel)

Constructeur : FlowLayout ( )

▪ BorderLayout : permet de décomposer la zone graphique du

conteneur en 5 zones (North, South, West, East, Center)

(gestionnaire d’aspect par défaut de Window)

Constructeur : BorderLayout (String s )

▪ GridLayout : permet de décomposer la zone graphique en un

rectangle composé de lignes et de colonnes

Constructeur : GridLayout ( int L, int C)

 Remarque : On ne peut placer qu’un seul composant

au maximum par zone. Pour en mettre plus il suffit que

lui même un panel dans lequel on

ce composant soit

peut à nouveau placer des composants

10

FLOWLAYOUT (EXEMPLE)

 java.awt.FlowLayout

one

two

three

four

five

 Exemple :

Button b1 = new Button (« one »);

Button b2 = new Button (« two »);

Button b3 = new Button (« three »);

Button b4 = new Button (« four »);

Panel p = new Panel();

p.setLayout (new FlowLayout());

p.add(b1); p.add(b2); p.add(b3); p.add(b4);

BORDERLAYOUT (EXEMPLE)

 java.awt.BorderLayout

North

West

Center

East

South

12

 Exemple :

Button b1 = new Button (« one »);

Button b2 = new Button (« two »);

Panel p = new Panel();

p.setLayout (new BorderLayout());

p.add(b1, « North »);

p.add(b2, « South »);

GRIDLAYOUT (EXEMPLE)

 java.awt.GridLayout

one

two

three

four

five

six

 Exemple :

Button b1 = new Button (« one »);

Button b2 = new Button (« two »);

Button b3 = new Button (« three »);

Button b4 = new Button (« four »);

Panel p = new Panel();

p.setLayout (new GridLayout(2, 3));

p.add(b1); p.add(b2); p.add(b3); p.add(b4);

13

EXEMPLE 1

MenuBar

Label

Checkbox

Button

tfPanel

chPanel

lstPanel

cbPanel

rbPanel

btPanel

Advertisement

TextField

Choice

List

14

EXEMPLE 2

import java.awt.*;

public class Exemple extends Frame

{

Exemple ( )

{

p1

p2

setLayout (new BorderLayout ());

Panel p1 = new Panel ();

Panel p2 = new Panel ();

add (p1, « North »);

add (p2, « South »);

p1.add (new Label (« Nom »));

p1.add (new TextField (8));

p2.add(new Button (« OK »));

p2.add(new Button (« ANNULER»));

pack();

setVisible (true);

}

public static void main (String args[ ])

{

Exemple e = new Exemple ( );

}

}

15

EXEMPLE GESTION DES MENUS

•java.lang.Object

java.awt.MenuComponent

• ava.awt.MenuBar

• java.awt.MenuItem

• java.awt.Menu

 La barre de menu: La classe MenuBar (fille de

Menucomponent)

Frame f = new Frame ();

Menubar mb = new MenuBar ();

f.setMenuBar ( mb);

 Menu déroulant de base: La classe Menu

Menu mf = new Menu (« Fichier »);

Menu me = new Menu (« Edition »);

Menu ma = new Menu (« Aide »);

mb.add (mf);

mb.add (me);

mb.add (ma);

 Menu déroulant de base: La classe MenuItem

MenuItem mouv = new MenuItem (« Ouvrir »);

MenuItem mferm= new MenuItem (« Fermer »);

mf.add (mouv);

mf.add (mferm);

16

LA CLASSE GRAPHICS

Classe abstraite héritant de Object

La classe Graphics est la classe abstraite de

base de tous les contextes graphiques, elle

permet à une application de dessiner dans des

composants

Puisque la classe Graphics est abstraite, elle

ne peut pas être créée directement. Il faut :

▪Redéfinir la méthode paint (Graphics g) de la

classe Component (appelée automatiquement

par le système lors d’un premier affichage) qui

est chargée de dessiner le composant

OU

▪Appeler la méthode Graphics getGraphics ()

sur un composant qui retourne le contexte

graphique du composant

Graphics g = <composant>.getGraphics ( );

17

QUELQUES MÉTHODES DE

GRAPHICS

▪public abstract void drawString(String s, int x, int

y) : dessine la chaîne s utilisant la couleur courante

commençant au point (x, y)

▪public abstract void drawLine( int x1, int y1, int

x2, int y2) : dessine une ligne utilisant la couleur

courante entre les points (x1, y1) et (x2, y2)

▪public abstract void setColor ( Color c) : attribue

la couleur spécifiée à ce contexte graphique

▪public abstract void drawOval ( int x, int y, int

width, int height ): dessine une forme ovale. Le

résultat est un cercle ou un ellipse

▪public void drawRect ( int x, int y, int width, int

height ) : dessine un rectangle.

▪public abstract void fillOval( int x, int y, int width,

int height ) : rempli une forme ovale avec la couleur

courante

▪public abstract void fillRect( int x, int y, int width,

int height ) rempli un rectangle avec la couleur

courante

▪public abstract void setColor (Color c): change la

couleur courante

▪…

18

LA CLASSE CANVAS

Elle hérite de java.awt.Component

Un composant Canvas représente une

zone rectangulaire dans l’écran de couleur

blanche dans laquelle l’application peut

dessiner ou à partir de laquelle une

application peut capter les évènements de

l’utilisateur.

 Une application doit sous classer la classe

fonctionnalités

Canvas pour avoir des

utiles.

19

LA CLASSE CANVAS (SUITE)

 Quelques méthodes de Canvas :

▪public Canvas ( ) :construit un nouveau

Canvas

▪public void paint ( Graphics g) :

g : le contexte graphique

Cette méthode est appelée à la création de

« canvas ». Les applications qui sous

classent Canvas doivent redéfinir cette

méthode

L’origine du contexte du « canvas » est

(0, 0) coin supérieur à gauche.

Remarque: On n’appelle pas directement paint

l ’AWT fournit un certain nombre de méthodes pour

appeler la méthode paint() indirectement.

Exemple: public void repaint ( )

20

EXEMPLE

import java.awt.*;

class Appl extends Frame

{

Appl (String s)

super (s);

{

MonCannevas c = new MonCannevas();

c.setSize(500, 100);

add (c);

pack();

setVisible(true);

}

public static void main (String[] args)

Advertisement

{

Appl f = new Appl (« Mon graphique »);

}

}

class MonCannevas extends Canvas

{

public void paint(Graphics g )

g.setColor (Color.yellow);

{

g.fillOval(10,10,50,50);

g.setColor (Color.red);

g.fillRect (80, 10, 100, 50);

g.setColor (Color.blue);

g.drawLine(200, 10, 350, 10);

}

}

21

EXÉCUTION DE L’EXEMPLE

jaune

rouge

bleu

22

LA GESTION DES ÉVÈNEMENTS

de

son

propre

dispose

système

Java

d'événements qui permet de capter des

événements liés à l'interface graphique AWT

.

un

Les

système

les

composants d'un programme Java et avec

son environnement externe.

constituent

communication

événements

de

ainsi

entre

 On distingue :

▪ Des sources d'événements (n'importe

quel Composant de AWT est par

exemple une source d'événement).

▪ Les

événements

eux-mêmes

qui

dérivent de la classe EventObject.

▪ Des récepteurs d'événements (appelé

Listener).

23

LA GESTION DES

ÉVÈNEMENTS (SUITE)

Les sources d’évènements :

les

AWT

Dans

(Component)

d'événements.

tous

sont

Composants

sources

des

Un Listener peut s'abonner auprès d'une

source avec la méthode :

void addXxxxListener(Listener l) : Xxxx

l'événement concerné

Quelques évènements : (java.awt.event)

▪ActionEvent : représente la réalisation d’une

action

typique du composant associé (ex: clic

: événements générés par

d’une souris)

▪KeyEvent

clavier

▪MouseEvent : événements générés par la

souris

▪TextEvent : la valeur d’un champ texte a été

modifiée

▪ …

le

24

LA GESTION DES ÉVÈNEMENTS (SUITE)

Les

:

d’évènements

Listener

(java.awt.event)

▪ Un Listener est un objet qui doit

implémenter une interface qui dérive

elle-même de l'interface EventListener. Il

existe une interface Listener par

type

d'événement :

l’interface XxxxListener si l'événement

est Xxxx

▪ Chacune de ces interfaces contient une

ou plusieurs méthodes correspondant

aux différents événements pouvant être

reçus : lorsque tel événement sera émis

telle

par

méthode sera appelée automatiquement

sur les Listener abonnés à cette source.

d'événement,

source

la

25

EXEMPLE INTERFACES LISTENERS PAR

TYPE D’ÉVÈNEMENT

26

CatégorieNom de l’interfaceMéthodesActionActionListeneractionPerformed (ActionEvent)ItemItemListeneritemStateChanged (ItemEvent)MouseMouseMotionListenermouseDragged (MouseEvent)mouseMoved (MouseEvent)MouseMouseListenermousePressed (MouseEvent)mouseReleased (MouseEvent)mouseEntered (MouseEvent) (MouseEvent)mouseExitedmouseClickedKeyKeyListenerkeyPressed (KeyEvent)keyReleased (KeyEvent)keyTyped (KeyEvent)FocusFocusListenerfocusGained (FocusEvent)focusLost (FocusEvent)LE TRAITEMENT DES ÉVÈNEMENTS

traitement

Le

décompose ainsi :

des

événements

se

pour

1. Un Listener s'abonne auprès d'une

source

type

un

Listener

d'événement.

peuvent ainsi s'abonner auprès de la

même source.)

(Plusieurs

certain

2. L'utilisateur

réalise une action qui

provoque l'apparition de l'événement

dans la source d'événement

Advertisement

3. L'événement est diffusé vers tous les

Listener qui sont abonnés.

Les

4.

chacun à leur manière cet événement

concernés

Listener

traitent

27

EXEMPLE 1

ECOUTEUR EXTERNE

import java.awt.*;

import java.awt.event.*;

Button b = new Button(« Rouge ») ;

b.addActionListener( new Ecouteur () ) ;

class Ecouteur implements ActionListener

{

public void actionPerformed (ActionEvent e ) {

Button b = (Button) e.getSource();

b.setBackground(Color.red);

}

}

28

EXEMPLE 2

ECOUTEUR EXTERNE PARAMÉTRÉ

import java.awt.event.*;

Button b = new Button(« Bonjour ») ;

TextArea ta = new TextArea (2,3);

ta.setEditable (false);

b.addActionListener( new Ecouteur (ta) ) ;

class Ecouteur implements ActionListener

{

TextArea ta;

Ecouteur (TextArea ta) {

this.ta = ta;

}

}

}

public void actionPerformed (ActionEvent e ) {

ta.setText (« Bonjour »);

29

EXEMPLE 3

ECOUTEUR INTERNE

import java.awt.*;

import java.awt.event.*;

public class MonFrame extends Frame

implements ActionListener

{

public MonFrame()

{

super("Utilisation d’un ActionEvent");

Button b = new Button("action");

b.addActionListener(this);

add(b);pack(); setVisible (true);

}

Lorsque l'on clique

sur le bouton dans

l ’interface, le titre de

la fenêtre change

public void actionPerformed( ActionEvent e )

{

setTitle("bouton cliqué !");

}

public static void main(String args[])

{new monFrame ();}

}

30

EXEMPLE 4

ECOUTEURINTERNE SUR PLUSIEURS

COMPOSANTS

public class MonFrame extends Frame

implements ActionListener

{ private Button b1,b2;

public MonFram (){

super("Utilisation d’un ActionEvent");

b1 = new Button("action1");

b2 = new Button("action2");

b1.addActionListener(this);

b2.addActionListener(this);

add(b1, « North »);

add(b2, « South »);

pack();

setVisible(true);

}

}

public void actionPerformed( ActionEvent e ) {

if (e.getSource() == b1) setTitle("action1 cliqué");

if (e.getSource() == b2) setTitle("action2 cliqué");

}

public static void main(String args[])

{MonFrame f= new MonFrame();}

Les 2

boutons ont

le même

écouteur (la

fenêtre)

31

EXEMPLE 5

ECOUTEURFENETRE

.. Frame f = new Frame ();

f.addWindowListener (new Fermer());

….

class Fermer implements WindowListener

{

public void windowClosing( WindowEvent e )

{System.exit(1);}

public void windowActivated( WindowEvent e )

{ }

public void windowDeactivated ( WindowEvent e)

{ }

public void windowIconified( WindowEvent e )

{ }

public void windowDeiconified( WindowEvent e )

{ }

public void windowClosed( WindowEvent e )

{ }

public void windowOpened( WindowEvent e )

{ }

}

32

EXEMPLE 6

ADAPTATEUR

.. Frame f = new Frame ();

f.addWindowListener (new Fermer());

….

class Fermer extends WindowAdapter

{

public void windowClosing (WindowEvent e )

{

System.exit(1);

}

}

Remarque:

La classe WindoAdapter implémente l’interface

WindowEvent par des corps vides.

33