Compléments de programmation Objet AWT Abstract Window Toolkit

Transcription

Compléments de programmation Objet AWT Abstract Window Toolkit
Info 423
Références
Compléments de
programmation Objet
• Différents tutoriels Java en ligne :
•
•
•
•
•
• Contenu :
– Interfaces graphiques, le package AWT
– Multitâches, les "Threads"
– Fichiers
• Outils et Docummentation :
• http://www.oracle.com/technetwork/java/
• http://www.eclipse.org/
• Volume horaire : 9 / 9 / 12
1
Support de cours Java de Philippe Durif
Développons en Java, Jean Michel Doudoux
Programmation Orientée Objets, Henri Garreta
Penser en Java de Bruce Eckel
The Java Tutorial de Sun
2
Introduction
Modèle / Vue / Contrôleur (MVC)
AWT
• Une façon d'organiser un programme.
• On distingue trois entités distinctes qui sont :
le modèle, la vue et le contrôleur
Abstract Window Toolkit
Package pour la création de fenêtres d'interaction
3
Modèle :
données manipulées par l'application
Vue
affichage ou interface utilisateur
Contrôleur
écouteurs, analyse de requêtes, gestion
d'événements
4
Introduction
Introduction
Package des composants graphiques :
Interactions entre Le Modèle / La vue / Le Contrôleur
• AWT : Interfaces Graphiques de base (écrites en code natif)
 java.awt
 java.awt.event
• Composants SWING (écrites en java au dessus de l'AWT)
• javax.swing
• Swing est plus puissant que AWT, mais pour plus de clarté
pédagogique on se limitera à AWT.
• Face aux problèmes de performance de Swing, IBM a développé sa
propre bibliothèque SWT, utilisée notamment dans Eclipse.
5
6
Introduction
Introduction
AWT : Abstract Window Toolkit
• La création de l'interface graphique d'une application
autonome (main) passe par une instance de la classe Frame
La composition d'une fenêtre AWT est hiérarchique.
Elle est construite à partir des composants graphiques.
• Cette fenêtre est le "container" des différents composants
(boutons, zones de saisie, etc…)
A la base : les COMPOSANTS ("Component")
Deux types de composants :
1. Les containers qui contiennent d'autres composants (Frame,
Panel,...)
Remarque :
Tous les composants sont visibles par défaut,
sauf les fenêtres (Frame).
On doit les rendre visibles avec la méthode setVisible(true).
2. Les composants atomiques qui se trouvent en feuille de la
hiérarchie de composition. Il peuvent être prédéfinis (Button,
TextField,...) ou crées.
7
8
La hiérarchie d'héritage
Exemple 1 (1/3)
La vue
Button
Checkbox
différent de "hiérarchie de
la composition"
Button
List
Choice
// saisie de texte
TextArea
// plusieurs lignes
TextField
// une seule ligne
TextComponent
Component
(abstraite)
Label
// texte
Frame
// panneaux
Canvas
Container
(abstraite)
Panel
Applet
Dialog
Window
Frame
9
10
Exemple 1 (2/3)
package premierExemple;
import java.awt.*;
public class Fenetre extends
final static int HAUTEUR =
final static int LARGEUR =
11
}
}
Exemple 1 (3/3)
package premierExemple;
Frame {
300;
250;
public class LancerFenetre {
public static void main(String[] args) {
new Fenetre();
}
}
public Fenetre( ) {
setTitle("Premier exemple"); // met un titre
setSize(LARGEUR, HAUTEUR);
// dim fenêtre
setBackground(Color.red);
// couleur du fond
// construit un bouton
Button bouton = new Button("Premier Composant");
// ajoute ce bouton en haut de la fenêtre
add(bouton, "North");
setVisible(true);
}
}
12
Le modèle
Exemple 2 (1/5)
public class Compteur {
private int v;
public Compteur(){
v = 0; }
public int valeur() {
return v ; }
public boolean estPair() {
return v % 2 == 0 ; }
public void raz() {
v = 0 ; }
public void incr() {
v = v + 1 ; }
public String toString(){
return Integer.toString(v);
}
Exemple 2 (2/5)
La vue
Frame
Button
Label
Button
Hiérarchie de la composition:
Frame (BorderLayout)
EAST
}
13
Button
CENTER WEST
Label
Button
14
La vue
Exemple 2 (3/5)
La vue
Exemple 2 (4/5)
import java.awt.*;
public class FenetreCompteur extends Frame {
private Compteur c ; // le modele
final static int HAUTEUR = 50;
final static int LARGEUR = 200;
Label texte = new Label (c.toString()) ;
Button b1 = new Button ("Incr");
Button b2 = new Button ("Raz");
this.add (b1, BorderLayout.WEST) ;
this.add (texte, BorderLayout.CENTER) ;
this.add (b2, BorderLayout.EAST) ;
public FenetreCompteur (Compteur c) {
this.c = c ;
setTitle("Deuxième exemple");
setSize(LARGEUR, HAUTEUR);
// gestionnaire affichage
this.setLayout(new BorderLayout()) ;
b1.addActionListener (new IncrListener(c,texte)) ;
b2.addActionListener (new RazListener(c,texte)) ;
setVisible(true);
}
}
15
16
La vue
Exemple 2 (5/5)
public class LancerFenetre {
public static void main(String[] args) {
Compteur c = new Compteur();
new FenetreCompteur(c);
}
}
17
La disposition des composants
Chaque Container possède un gestionnaire de mise en page :
un LayoutManager.
Un LayoutManager se charge de :
• placer des composants, lors des appels à la méthode add ;
• donner une taille et une forme à chaque composant, en fonction
de sa "taille préférée", de son contenu et de sa position ;
• replacer les composants en cas de redimensionnement.
18
La disposition des composants
La disposition des composants
• BorderLayout : Par défaut pour les sous-classes de
• Cinq classes (Layouts) prédéfinies qui implémentent
l'interface
LayoutManager
Frame (cf. exemple), Window et Dialog
North
• Elles représentent des dispositions différentes
• BorderLayout
• FlowLayout
• GridLayout
• CardLayout
• GridBagLayout
West
East
Les plus utilisées
19
South
20
La disposition des composants
La disposition des composants
Exemple BorderLayout
21
Center
Au plus
cinq
composants
import java.awt.*;
public class PaneauBorder extends Panel {
public PaneauBorder ( ) {
this.setLayout(new BorderLayout());
this.setBackground(Color.PINK);
Label texte1 = new Label("un",Label.CENTER) ;
Label texte2 = new Label("deux",Label.CENTER) ;
Label texte3 = new Label("trois",Label.CENTER) ;
Label texte4 = new Label("quatre",Label.CENTER) ;
Label texte5 = new Label("cinq",Label.CENTER) ;
this.add (texte1, BorderLayout.NORTH) ;
this.add (texte2, BorderLayout.WEST) ;
this.add (texte3, BorderLayout.CENTER) ;
this.add (texte4, BorderLayout.EAST) ;
this.add (texte5, BorderLayout.SOUTH) ;
}
}
• FlowLayout : les composants sont mis les uns après
les autres, dans l'ordre de leur ajout (par défaut pour la
classe Panel (et donc pour Applet))
one
three
two
four
La dimension
est renvoyée
par la méthode
getPreferredSize()
de chaque
composant
five
22
La disposition des composants
La disposition des composants
Exemple FlowLayout
23
import java.awt.*;
public class PaneauFlow extends Panel{
public PaneauFlow(){
this.setLayout(new FlowLayout()) ; // gestionnaire
this.setBackground(Color.YELLOW);
Label a1 = new Label("un") ;
TextField a2 = new TextField("deux",10) ;
TextArea a3 = new TextArea("trois",3,10) ;
Button a4 = new Button("quatre") ;
Checkbox a5 = new Checkbox("cinq") ;
this.add (a1) ;
this.add (a2) ;
this.add (a3) ;
this.add (a4) ;
this.add (a5) ;
}
}
• GridLayout : pour construire une grille régulière
(constructeur à 2 paramètres : nb de lignes, nb de
colonnes)
24
un
deux
trois
quatre
cinq
six
Les dimensions
sont les mêmes
pours tous les
composants.
La disposition des composants
La disposition des composants
Exemple GridLayout
• CardLayout : ajout à un container une liste de sous-containers
import java.awt.*;
25
public class FenetrePrincipal extends Frame {
final static int HAUTEUR = 150;
final static int LARGEUR = 350;
public FenetrePrincipal(){
this.setSize(LARGEUR, HAUTEUR);
// 1 ligne, 2 colonnes
this.setLayout(new GridLayout(1,2));
this.add(new PaneauBorder());
this.add(new PaneauFlow());
this.setVisible(true);
}
}
ou de composants affichés un par un, à la manière des boites de
dialogue à onglets
• GridBagLayout : le plus complet et le plus complexe...
26
Autre exemple de disposition
tfPanel
Exemple 3 (2/6)
Exemple 3 (1/6)
chPanel
Hiérarchie de la composition:
FenetreAvecPaneaux (GridLayout)
tfPanel
rbPanel
tbPanel
chPanel
tfPanel (FlowLayout) chPanel(FlowLayout)
rbPanel
tbPanel
Label TextField
27
Choice Checkbox
Checkbox
tbPanel (FlowLayout)
Button
28
Exemple 3 (3/6)
Exemple 3 (4/6)
// Choice Panel
Panel chPanel = new Panel(new
FlowLayout(FlowLayout.LEFT));
Label label2 = new Label("Choice");
chPanel.add(label2);
Choice choix = new Choice();
choix.addItem("Solaris");
choix.addItem("Linux");
chPanel.add(choix);
import java.awt.*;
public class FenetreAvecPaneaux extends Frame {
final static int HAUTEUR = 300;
final static int LARGEUR = 200;
public FenetreAvecPaneaux(){
this.setSize(LARGEUR, HAUTEUR);
//Text Field Panel
Panel tfPanel = new Panel(new
FlowLayout(FlowLayout.LEFT));
Label label = new Label("TextField");
tfPanel.add(label);
TextField textField =new TextField(15);
tfPanel.add(textField);
29
Label
rbPanel (FlowLayout)
30
// RadioButton Panel
Panel rbPanel = new Panel(new
FlowLayout(FlowLayout.LEFT));
Checkbox rbSolaris = new Checkbox("Solaris");
rbPanel.add(rbSolaris);
Checkbox rbLinux = new Checkbox("Linux");
rbPanel.add(rbLinux);
Button
Exemple 3 (5/6)
Exemple 3 (6/6)
// Button Panel
Panel btPanel = new Panel(new
FlowLayout(FlowLayout.LEFT));
Button okButton = new Button("Ok");
btPanel.add(okButton);
Button cancelButton = new Button("Cancel");
btPanel.add(cancelButton);
31
this.setBackground(Color.GRAY);
this.setLayout(new GridLayout(4,1));
this.add(tfPanel);
this.add(chPanel);
this.add(rbPanel);
this.add(btPanel);
this.setVisible(true);
}
public static void main(String[] args) {
new FenetreAvecPaneaux();
}
} // fin FenetreAvecPaneaux
Exo pour les étudiants :
texte a
button b
texte c
32
La disposition de composants
La disposition de composants
Le dimensionnement des composants est automatique grâce au
LayoutManager.
Le méthode getPreferedSize() indique la taille souhaitée mais pas
celle imposée. En fonction du LayoutManager, le composant pourra
ou non imposer sa taille.
Pour donner à un composant une taille donnée, on peut redéfinir la
méthode getPreferedSize de la classe Component.
import java.awt.*;
public class TestDimension
extends Frame {
final static int HAUTEUR = 400;
final static int LARGEUR = 400;
public TestDimension (){
this.setSize(LARGEUR, HAUTEUR);
this.setLayout(new FlowLayout());
MonBoutton b = new MonBoutton("cliquez ici");
this.add(b);
this.setVisible(true);
}
}
import java.awt.*;
33
public class MonBouton extends Button {
public MonBoutton(String nom) {
super(nom);
}
public Dimension getPreferredSize() {
return new Dimension(100, 200);
}
}
34
La disposition de composants
La disposition de composants
Exemple :
Pas de Layout.
On peut ne pas utiliser des Layout et placer les composants à la main
en indiquant leurs coordonnées et leurs dimensions.
Dans ce cas il faut appeler setLayout(null).
Trois méthodes de Component permettent de positionner des
composants :
* setBounds(int x, int y, int largeur, int hauteur)
* setLocation(int x , int y)
* setSize(int largeur, int hauteur)
35
36
import java.awt.*;
public class FenetreSansLayout extends Frame {
final static int HAUTEUR = 400;
final static int LARGEUR = 400;
public FenetreSansLayout(){
this.setSize(LARGEUR, HAUTEUR);
this.setLayout(null); // Sans Layout
Label t=new Label("Hello tous !");
this.add(t);
t.setBounds(50,50,150,70); // position et taille
t.setBackground(Color.YELLOW);
this.setVisible(true);
}
public static void main(String[] args) {
new FenetreSansLayout();}
}
Les menus
Les menus
• Classes : Menu, MenuBar et MenuItem
Hiérarchie d'héritage de MenuComponent
MenuBar
Menu
MenuBar
MenuComponent
(abstraite)
MenuItem
Menu
MenuItem
CheckboxMenu
37
38
Les menus
Exemple 4 (1/2)
Code de l'exemple :
Classes d'affichage de menus:
• MenuBar. Seul Frame peut avoir une barre de menu.
On attache une barre de menu avec la méthode
setMenuBar(MenuBar)
• Menu. Créé avec un titre. Par la suite on lui ajoute des
items avec la méthode add.
• MenuItem qui peuvent être :
import java.awt.*;
public class FenetreAvecMenus extends Frame {
final static int HAUTEUR = 200;
final static int LARGEUR = 200;
public FenetreAvecMenus(){
this.setTitle("Mes information");
this.setSize(LARGEUR, HAUTEUR);
- des chaînes de caractères, ou
- des menus Menu (sous-classe de MenuItem).
39
40
Exemple 4 (2/2)
Code de l'exemple :
loisirs.add(new MenuItem("Sport"));
loisirs.add(new MenuItem("Cinéma"));
loisirs.add(musique);
musique.add(new MenuItem("Classique"));
musique.add(new MenuItem("Jazz"));
musique.add(new MenuItem("Pop"));
MenuBar mb = new MenuBar();
mb.add(formation);
mb.add(loisirs);
this.setMenuBar(mb);
this.setVisible(true);
}
41
Menu formation = new Menu("Formation");
Menu loisirs = new Menu("Loisirs");
Menu musique = new Menu("Musique");
}
formation.add(new MenuItem("Pascal"));
formation.add(new MenuItem("Java"));