N F P 121

Evénements
   

Soit construire une calculette de bureau en "float" d'aspect :

(i) construction de l'IHM :

Les 4 étapes de création d'une GUI
1- créer et configurer les composants

     JButton onOff=new JButton("on/off");

     onOff.setFont(new Font("Arial" , Font.BOLD , 18));

2 -créer et configurer les conteneurs pour les composants.

        JFrame fenetre=new JFrame("lucarne");

      fenetre.setLayout(new BorderLayout());

3- ajouter et disposer les composants dans le conteneur

      fenetre.getContentPane().add(onOff , BorderLayout.CENTER);

4- gérer les événements générés par les composants

     onOff.addActionListener(new ActionListener() {…};

1- créer et configurer les composants

a- recensement des composants de la calculette (ceux qu'on verra...)

    10 chiffres , 4 opérateurs , un inverseur , la virgule décimale , '=' et clear tous représentés par des 'Button' ou 'JButton'

    une barrette d'affichage représentée par un 'TextField'  et enfin une bannière publicitaire représentée par une Label ou JLabel

   
déclaration
des
composants de la calculette

private JTextField affichage;

private JLabel pub;

private JButton b1;

private JButton b2;

private JButton b3;

private JButton b4;

private JButton b5;

private JButton b6;

private JButton b7;

private JButton b8;

private JButton b9;

private JButton b0;

private JButton bplus;

private JButton bmoins;

private JButton bmulti;

private JButton bdiv;

private JButton binv;

private JButton bvirgule;

private JButton begal;

private JButton bclear;

a.1 configuration de ces composants : fixer le texte devant apparaitre sur le bouton dans une fonte particulière .

par exemple  : new Font("SansSerif", Font.BOLD, 18)

comme  tous les boutons sont configurés de la même façon, créer une classe BoutonCalculette qui hérite de Jbutton et qui réallise cette configuration.

alors l'initialisation les boutons sera :

initialisation des boutons
b1 = new BoutonCalculette("1" );

b2 = new BoutonCalculette("2" );

b3 = new BoutonCalculette("3" );

b4 = new BoutonCalculette("4" );

b5 = new BoutonCalculette("5" );

b6 = new BoutonCalculette("6" );

b7 = new BoutonCalculette("7" );

b8 = new BoutonCalculette("8" );

b9 = new BoutonCalculette("9" );

b0 = new BoutonCalculette("0" );

bplus = new BoutonCalculette("+" );

bmoins = new BoutonCalculette("-" );

bmulti = new BoutonCalculette("*" );

bdiv = new BoutonCalculette("/" );

begal = new BoutonCalculette("=" );

binv = new BoutonCalculette("+/-" );

bvirgule = new BoutonCalculette("," );

bclear = new BoutonCalculette("clear" );

l'affichage lui aura au moins 16 colonnes et il doit être calé à DROITE

Compléter la configuration des composants

2 -créer et configurer les conteneurs pour les composants.

le conteneur de base sera un JFrame (ou fen) dans lequel on dépose 7 JPanel (ou ligneXX ) selon un GridLayout

la ligne 01 contient seulement le TextField , les lignes de 02 à 05 contiennent 4 boutons, la ligne 06 contient les bouton '=' et 'clear' et la dernière ligne contient la pub.

déclaration
des conteneurs
de la calculette
private JFrame fen;

private JPanel ligne01;

private JPanel ligne02;

private JPanel ligne03;

private JPanel ligne04;

private JPanel ligne05;

private JPanel ligne06;

private JPanel ligne07;

on a maintenant tous les ingrédients pour construire l'IHM donc :

3- ajouter et disposer les composants dans le conteneur

à part les déclarations tout se passe dans le constructeur de la classe Calculette...

...

Compléter pour obtenir la calculette montrée ci dessus

4- gérer les événements pour obtenir le comportement désiré

à chaque bouton de la calculette nous  ajoutons un "ActionListener" qui définit l'action à déclancher lors d'un clic sur le bouton.

exemple :
action pour un clic sur le bouton "clear" 
 bclear.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
            try {
                 operateur="" ; nbre1="";  nbre2=""; affichage.setText("");
                 //operande1=true;
            }catch(Exception ex) { System.err.println(ex); }
            }
          });

expliquer l'intéret d'avoir opté pour une classe anonyme...

compléter la classe Calculette en ajoutant un ActionListener adéquate sur chacun des boutons

enfin transformer le programme pour en faire une applette. le résultat sera "du genre" :

Your browser is ignoring the <APPLET> tag!

MVC : Reprendre le programme précédent pour le restructurer selon le pattern MVC

Quelques cas/exemples de "Observer-Observable" et de MVC

Exercice 1

Exemple avec GUI et ActionListener

à suivre ...