Vos premiers pas en Swing

Présentation au sujet: "Vos premiers pas en Swing"— Transcription de la présentation:

1 Vos premiers pas en Swing
Swing est une boˆıte `a outils permettant la cr´eation d’interfaces utilisateur en Java. Swing est une am´elioration de AWT (Abstract Window Toolkit) qui ´etait la boˆıte `a outils originale tout en s’appuyant dessus. Les interfaces graphiques ainsi cr´e´ees sont ind´ependantes de l’OS et de l’environnement graphique sous-jacents Partie structurelle Audrey Occello & AM Dery

2 Que trouve-ton dans une librairie graphique ?
Des éléments graphiques : Component Définition d’un élément graphique avec une dimension, une position, un type de contrôle associé Des éléments graphiques composés : Container Définition d’un regroupement Des éléments graphiques qui contiennent d’autres éléments graphiques Des morceaux d’écrans : Graphics Contexte graphique Permet de dessiner –Changer de crayon : couleur, formes géométriques, images, chaînes de caractères - Automatiquement redimensionnés, réaffichés Du Formattage  : LayoutManager Définition de l’organisation En ligne, en tableau, avec des contraintes,etc SWING

3 Aperçu de Swing

4 HIÉRARCHIE DES CLASSES
4

5 IL PEUT Y AVOIR PLUSIEURS PANNEAUX DANS UNE FENETRE
PRINCIPES GÉNÉRAUX Pour la création des composants : Choix du container racine et création Choix du panneau dans lequel on dispose les composants (contenu) Pour l’affichage des composants Utilisation du layout par défaut ou choix d’une mise en page des composants du container Association de l’afficheur (LayoutManager) au container Création d’un JFrame, Construction du contenu dans un panneau (JPanel) ajouté au panneau de base : le contentPane Traitement des événements sur les composants par des procédures appelées écouteurs (listener) d’événement IL PEUT Y AVOIR PLUSIEURS PANNEAUX DANS UNE FENETRE 5

6 PRINCIPES GÉNÉRAUX L’ajout d’un composant à un composant (container) implique la construction d’un sous arbre - le composant ajouté est le fils Le parent contient les composants qui lui sont ajoutés La méthode getParent() sur un composant retourne le parent (de type Container) On a donc une arborescence des composants 6

7 Exemple : ARBRE DE COMPOSANTS
7

8 Composants : Contrôles
COMMENT SAISIR & AFFICHER DES DONNEES ET PRESENTER DES ACTIONS ? 8

9 Aperçu de Swing Des composants de contrôle
Jcomponent Méthodes de commodité • getSize retourne une Dimension • setSize : une Dimension ou deux entiers – Une position • getLocation retourne un Point • setLocation avec un Point ou deux entiers – Coordonnées • Origine au coin supérieur gauche – x (width) vers la droite – y (height) vers le bas • setPreferredSize : Dimension • setMinimumSize : Dimension • setMaximumSize : Dimension • setBackground : Color Et bien d’autres ! JRadioButton : bouton pour sélection unique (associé à ButtonGroup), JMenu et JMenuItem : un menu et ses éléments (inclus dans une JMenuBar) JPopMenu : un menu flottant, JToolTip : une bulle d’aide Les îcones : javax.swing.ImageIcon créer avec le nom d’un fichier image par exemple

10 JLABEL Permet de définir un label
Peut comporter : une icône, du texte ou les deux Méthodes intéressantes : setEnabled(boolean) : pour activer/désactiver la zone (permet de griser le label) setHorizontalAlignement(constante) pour contrôler l’alignement du texte ImageIcon ii = new ImageIcon(‘‘icon.jpg’’); Jlabel jl = new JLabel(‘‘text + icône’’, ii, JLabel.CENTER); 10

11 CRÉATION D’UN MENU Pour créer un menu, il faut :
Une barre de menu (JMenuBar), Un menu (JMenu), Des éléments dans ce menu (JMenuItem), Sur le JMenu, il est possible d’ajouter un Mnemonic Permet d’accéder au menu directement en faisant : Alt+Char Est associé à un caractère (setMnemonic(char)) Sur les JMenuItem il est possible d’ajouter des accélérateurs : Permet d’associer une combinaison du type Ctrl+Touche setAccelerator(KeyStroke.getKeyStroke ( KeyEvent.LA_TOUCHE, ActionEvent.LE_MASQUE) 11

12 ILLUSTRATION D’UN MENU
JMenuBar JMenu JMenuItem 12

13 LES BORDURES Il est possible d’attribuer une bordure à un JComponent :
setBorder(border) Pour obtenir la bordure, on utilise les méthodes statiques de la classe BorderFactory : Factory.createEtchedBorder() 13

14 COMMENT GROUPER LES COMPOSANTS D’IHM ?
Containers COMMENT GROUPER LES COMPOSANTS D’IHM ? 14

15 Aperçu de Swing Les Containers
– add / remove d’un Component – unicité de lieu – indice des components – association à un LayoutManager Méthodes à connaître • repaint() ! validate() ! : mise à jour de l’IHM • getBounds / setBounds(x,y, w, h) : positionne et dimensionne • getWidth() : largeur / getHeight() : hauteur • getX() et getY() : obtenir une coordonnée • setVisible(true / false) • getBackground et setBackground [objet Color, définition RGB]

16 DES CONTAINERS RACINE JFrame : le cadre principal d'une application. Il peut contenir des menus et d'autres composants. JDialog : une fenêtre de dialogue avec l'utilisateur. Son « parent » (argument requis par ses créateurs) sert essentiellement à la placer dans l'écran. JApplet : classe de base pour les applets Java 2. Les applets sont des applications Java pouvant tourner à l'intérieur d'un navigateur Web. Seules ces deux classes peuvent ˆetre affich´ees en dehors de tout conteneur 16

17 LES DIFFÉRENTS PANNEAUX D’UN JFRAME, JDIALOG, JAPPLET
S’obtiennent par : getRootPane () zone de la fenêtre sous le titre getLayeredPane() zone où sont cachés les panneaux non visibles getContentPane () zone où les éléments sont ajoutés getGlassPane () zone transparente dessinée au-dessus du JRootPane utilisé pour afficher des pop-up menus 17

18 JFRAME : ILLUSTRATION JFrame frame = new JFrame("TopLevelDemo");
//Create the menu bar. Make it have a green background. JMenuBar greenMenuBar = new JMenuBar(); greenMenuBar.setOpaque(true); greenMenuBar.setBackground(new Color(154, 165, 127)); greenMenuBar.setPreferredSize(new Dimension(200, 20)); //Create a yellow label to put in the content pane. JLabel yellowLabel = new JLabel(); yellowLabel.setOpaque(true); yellowLabel.setBackground(new Color(248, 213, 131)); //Set the menu bar and add the label to the content pane. frame.setJMenuBar(greenMenuBar); frame.getContentPane().add(yellowLabel); frame.setVisible(true); 18

19 JFRAME : ILLUSTRATION 19

20 AUTRES MÉTHODES setTitle (String) : pour mettre le titre de la fenêtre
setSize (int width, int height) setLocation (int x, int y) : pour déplacer la fenêtre dispose () : pour fermer la fenêtre pack () : ajuste chaque composant à sa taille optimale et retaille la fenêtre 20

21 JFRAME : ILLUSTRATION import javax.swing.*; public class TryWindow {
public static void main (String[] args) { JFrame myWindow = new JFrame (''ceci est un titre''); myWindow.setBounds (50, 100, 400, 150); // définit la position et la taille // détermine ce qu'il se passe lorsque l'on ferme la fenêtre myWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); myWindow.setVisible(true); // rend visible la fenêtre } (0,0) DISPOSE_ON_CLOSE – contrainte par défaut - détruit le JFrame et ses composants mais ne termine pas l'application DO_NOTHING_ON_CLOSE HIDE_ON_CLOSE X=50 H=150 21 Y= 100 W=400

22 JDIALOG : CLASSES et BOÎTES DE DIALOGUES
Il existe différentes classes pour créer des boîtes de dialogue : JOptionPane : pour créer des boîtes de dialogue standards JColorChooser : pour choisir une couleur JFileChooser : pour permettre de sélectionner un fichier ProgressMonitor : pour afficher la progression d’une opération 22

23 JOPTIONPANE Permet de créer des boîtes de dialogue standards
Permet de faire des avertissements Possède des éléments standardisés : Réponse oui/non, Icônes de danger, d’erreurs, … Est modifiable (boutons, icônes, …) avertissement information erreur question 23

24 JCOLORCHOOSER Permet de créer une boîte de dialogue pour choisir une couleur Possède différents onglets correspond aux différents types d’encodage de couleurs 24

25 JFILECHOOSER Définit une boîte de dialogue pour sélectionner un fichier Deux boîtes de dialogue par défaut : Pour l’ouverture (showOpenDialog), Pour la sauvegarde (showSaveDialog) 25

26 APPLET JAVA S’exécute dans une machine virtuelle (celle du navigateur web) et nécessite un fichier html N’a pas de fonction main mais vit un cycle (run) Les principales méthodes sont : init () : quand la page html est chargée la 1ère fois start () : après init et chaque fois que l’on revient sur la page stop () : quand on quitte la page html (on interrompt les méthodes lancées dans start) destroy () : quand l’applet est terminée (on libère toutes les ressources) 26

27 EXEMPLE D’APPLET <HTML>
import java.awt.*; Import java.applet.*; public class HelloWorldApplet extends Applet { Font f = new Font ( « Serif », Font.BOLD, 36); public void paint (Graphics g) { g.setFont(f); g.setColor(Color.red); g.drawString(getParameter (« Chaine »), 10, 30); } <HTML> <TITLE> Applet HelloWorldApplet </TITLE> <APPLET CODE=« HelloWorldApplet.class » WIDTH=200 HEIGHT=300> <PARAM NAME=« Chaine » value = « Hello World »> </APPLET> </HTML> 27

28 SÉCURITÉ ET APPLET Une applet ne peut pas charger de librairies ou utiliser des méthodes natives Elle ne peut normalement pas lire ou écrire dans des fichiers de l’hôte sur lequel elle s’exécute Elle ne peut pas effectuer de connexions réseaux sauf sur l’hôte dont elle provient Elle ne peut lancer aucun programme de l’hôte sur lequel elle s’exécute 28 Ces restrictions peuvent être levées par un certificat de sécurité (cf. jarsigner, policytool)

29 AUTRES CONTAINERS La famille des panneaux
Pour structurer les différents éléments graphiques, on utilise des containers qui font partis de la famille des panneaux. Quelques panneaux très utiles : Le JPanel : panneau de base, Le JScrollPane : qui permet d’obtenir des ascenseurs Le JSplitPane : qui permet de diviser en 2 (seulement 2) Le JTabbedPane : qui permet d’avoir différents onglets pour les différents sous-contenus 29

30 JPANEL Le container le plus utilisé pour structurer l’interface
Ne possède pas de réelles contraintes (la gestion de l’organisation des éléments est déléguée à un Layout) Peut contenir des sous-panneaux 30

31 JSCROLLPANE Permet d’obtenir des ascenseurs de manière automatique,
Est créé en lui associant le composant que l’on souhaite pouvoir scroller Le composant inclus dans le JScrollPane doit implémenter l’interface Scrollable Quelques éléments qui implémentent cette interface : JTextField, JTextArea, JTree, JTable 31

32 JSPLITPANE Permet de diviser en deux l’espace
Peut se construire avec les deux composants contenus dans chacune des zones Possède une orientation (HORIZONTAL_SPLIT ou VERTICAL_SPLIT) 32

33 JTABBEDPANE Permet d’avoir des onglets
Permet de mieux gérer l’espace de travail Chaque onglet est créé avec son panel associé L’onglet peut posséder une icône en plus ainsi qu’un raccourci clavier (Mnemonic) Peut-être fait de manière équivalente avec un CardLayout (à ce moment, il n’y a pas d’onglet) 33

34 COMMENT POSITIONNER LES COMPOSANTS ?
Afficheurs COMMENT POSITIONNER LES COMPOSANTS ? 34

35 DEUX MANIÈRES Positionner de manière absolue, revient à :
Retirer tout gestionnaire d’affichage (setLayout(null)) Placer un par un les éléments en leur donnant leur position dans la fenêtre (méthode setBounds) Du «sur mesure» mais peut s’avérer très complexe à définir ! Positionner de manière relative en utilisant des gestionnaires d’affichage 35

36 MISE EN PAGE RELATIVE La mise en page des éléments s’effectue à l’aide d’un gestionnaire d’affichage (Layout), Tous les containers possèdent une méthode setLayout qui permet de spécifier le type de gestionnaire d’affichage On peut ajouter des contraintes lorsqu’on ajoute un composant Avantage : Le redimensionnement est géré automatiquement 36

37 Aperçu de Swing Layouts
Les Layout :Basé sur PreferredSize ou une maximisation de l’élément • BorderLayout – par défaut dans une fenêtre – ajout en précisant la zone – add(comp, "North") • FlowLayout : en ligne(s) • BoxLayout : séquence verticale ou horizontale • GridLayout : en tableau • GridBagLayout : avec des contraintes • CardLayout : empilement • etc.

38 UTILISATION D’UN LAYOUT
Création du layout Exemple : BorderLayout bl = new BorderLayout()) 2. Association au container : panel.setLayout(bl) Ajout de composants au container, avec ou sans contrainte panel.add(button, BorderLayout.EAST) 38

39 BORDERLAYOUT Définit des zones avec différentes proportions dans lesquelles ajouter des éléments La zone centrale s’agrandit proportionnellement au container associé Gestionnaire d’affichage par défaut des JFrame NORTH EAST WEST 39 SOUTH CENTER

40 FLOWLAYOUT On ajoute au fur et à mesure les composants, si cela ne tient pas dans la ligne, on commence une nouvelle ligne Gestionnaire d’affichage par défaut des JPanel Possibilité de spécifier l’alignement (centré par défaut) setAlignement(int) – 0 gauche, 1 centré, 2 droite 40

41 Exemple import javax.swing.*; public class Exemple { public static void main(String[] args) { JFrame fenetre = new JFrame(); JPanel panel = new JPanel(); JLabel etiquette = new JLabel("Aujourd'hui: "); JCheckBox premier = new JCheckBox("Lundi"); JCheckBox deuxieme = new JCheckBox("Mardi"); JCheckBox troisieme = new JCheckBox("Mercredi"); JCheckBox quatrieme = new JCheckBox("Jeudi"); JCheckBox cinquieme = new JCheckBox("Vendredi", true); JCheckBox sixieme = new JCheckBox("Samedi");

42 Exemple JCheckBox septieme = new JCheckBox("Dimanche"); panel.add(etiquette); panel.add(premier); panel.add(deuxieme); panel.add(troisieme); panel.add(quatrieme); panel.add(cinquieme); panel.add(sixieme); panel.add(septieme); fenetre.setContentPane(panel); fenetre.setTitle("Wesh mate mon flow!"); fenetre.setBounds(100, 100, 200, 200); fenetre.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); fenetre.setVisible(true); }

43 Aperçu du résultat Le placement s’ajuste en fonction de la taille de la fenêtre :

44 BOXLAYOUT Définit une boîte dans laquelle seront ajoutés les différents composants Cette boîte peut-être : Horizontale : X_AXIS Verticale : Y_AXIS On ajoute les éléments au fur et à mesure 44

45 CARDLAYOUT Permet d’empiler des composants (suivant des panneaux)
Le dernier ajouté ou celui spécifié est visible Concept de la pile de cartes 45

46 GRIDLAYOUT Définit une grille où ajouter les composants
L’ajout des composants se fait sans préciser de contraintes On déclare le layout de la manière suivante : new GridLayout(0,2) // row, column 0 signifie autant qu’on veut 46

47 GRIDBAGLAYOUT Place les composants dans une grille modulaire en définissant les contraintes des différents composants à placer Pour une mise en page complexe 47

48 MISE EN PAGE COMPLEXE autre solution
Combinaison de plusieurs panels avec leur propre layout 48

49 Composants et partage de données
COMMENT GERER LA COHERENCE DE PLUSIEURS VUES ? 49

50 LES JLIST ET LES JTABLE Permettent de représenter une collection de données Il est possible de partager des données d’une JTable ou d’une Jlist avec d’autres composants considérés comme d’autres vues de l’objet JTable ou JList Par exemple : une liste de noms affichée dans une JList. La JList est une vue (interactive) de la liste de noms permettant la sélection d’élément. Une représentation tabulaire de la même liste est une autre vue Un texte qui indique le nombre d’éléments de la liste est une autre vue du modèle 50

51 ILLUSTRATION JLIST/JTABLE
51

52 JLIST Possède différents constructeurs :
Données fixes : JList (Vector listData) ou JList (Object[] listData) Données modifiables : JList (ListModel dm) Possède une méthode qui permet de spécifier le mode de sélection : setSelectionMode (int mode). mode peut valoir : SINGLE_SELECTION SINGLE_INTERVAL_SELECTION MULTIPLE_INTERVAL_SELECTION 52

53 LISTMODEL Pour le modèle de données, utiliser la classe DefaultListModel. Ce modèle stocke les objets sous forme de vecteur et fournit les méthodes suivantes : addElement (Object), boolean contains(Object), boolean removeElement(Object) Object get(index), Object remove(index), int size() Plus d’autres méthodes pour gérer les mises à jour des vues utilisants ces données (cf prochain cours) addListDataListener (ListDataListener l), remove… fireContentsChanged,fireIntervalAdded, fireIntervalRemoved (Object source, int index0, int index1) 53

54 JLIST Exemple String listData[]= {…,« Carlos »,…, « Ramier»};
DefaultListModel model = new DefaultListModel(); for (int i=0; i<listData.length; i++) model.addElement(listData[i]); JList dataList = new JList(model); JScrollPane listeScroll = new JScrollPane(dataList); 54

55 JTABLE Un constructeur possible de JTable :
JTable (Object[][] rowData, Object[] columnNames) On peut accéder au modèle sous-jacent avec la méthode : TableModel getModel() Un autre constructeur avec directement le modèle : String nomsCol[]={«Prenom», «Nom»}; String rows[][] = { {«Dinah»,«Cohen»}, … , {«Said», «Kharrazen»}}; DefaultTableModel model = new DefaultTableModel(rows, nomsCol); JTable table = new JTable(model); 55

56 TABLEMODEL Il existe 3 différents éléments pour créer un modèle de données : L’interface TableModel La classe AbstractTableModel qui implémente TableModel La classe DefaultTableModel DefaultTableModel est le plus simple à utiliser, quelques constructeurs associés : DefaultTableModel(int row, int col) DefaultTableModel(Object[][] data, Object[] columnNames) DefaultTableModel(Vector data, Vector columnNames) Plus d’autres méthodes pour gérer les mises à jour des vues utilisant ces données (cf prochain cours) 56