Upload
sikora-christian
View
75
Download
0
Embed Size (px)
Citation preview
J2ME
Interfaces utilisateur
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
O se trouvent les classes ?
En consultant la javadoc du profile MIDP 2.0 :
On isole facilement deux packages2 Formation ITIN / Universit de Cergy-Pontoise 10/11/2006
Classes de haut niveauIdal pour le dveloppement dapplications sur diffrents types dappareils car ces classes ne donnent pas un contrle total sur laffichage. Contrle minimal sur leur look and feel, laiss pour lessentiel lappareil qui fait en fonction de ses capacits.
3
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Classes de haut niveau
Displayable
Screen
Alert
Form
List
TextBox
4
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Classes de bas niveau
Il y en a trois : Canvas GameCanvas Graphics
Plus difficilement portable, on obtient un placement prcis lcran5 Formation ITIN / Universit de Cergy-Pontoise 10/11/2006
La classe abstraite DisplayablePour tre affich lcran, un lment doit implmenter les mthodes de la classe Displayable. Chaque displayable possde entre autre un titre, un ticker et des commandes associes. La classe Graphics nutilise pas cette classe, elle possde des fonctions qui manipulent directement lcran de lappareil.
6
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
La classe DisplayPermet : dobtenir des informations sur les proprits daffichage de lappareil. (support de la couleur, niveaux alpha, ) de demander laffichage dobjets lcran ou accder aux objets affichs.
7
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Un exemple complet
import javax.microedition.lcdui.Alert; import javax.microedition.lcdui.Display; import javax.microedition.midlet.MIDlet; public class HelloWorldApp extends MIDlet { Alert helloAlert; public HelloWorldApp() { helloAlert = new Alert("Hello world !"); } public void startApp() {
Display.getDisplay(this).setCurrent(helloAlert);} public void pauseApp() { } public void destroyApp(boolean unconditional) { } }8 Formation ITIN / Universit de Cergy-Pontoise 10/11/2006
Analyse de lexemple
Alert helloAlert; public HelloWorldApp() { helloAlert = new Alert("Hello world !"); }
Alert est un Displayable.
public void startApp() { Display.getDisplay(this). setCurrent(helloAlert); }
On utilise la mthode statique getDisplay(MIDlet midlet) de la classe Display pour obtenir lobjet Display unique chaque MIDlet
On ne peut afficher quun seul objet Displayable la fois.9 Formation ITIN / Universit de Cergy-Pontoise 10/11/2006
Interfaces utilisateur
Travailler avec les classes de haut niveau
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
ScreenBase pour tous les crans de haut niveau Proprits communes pour tous ces crans : ticker titre
11
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
AlertesMessages lintention de lutilisateur Les alertes sont soit Limites en temps (affich pendant un certains laps de temps fix en ms) Modales (Visibles tant quune action utilisateur na pas t ralise)
On peut lui associer un son, une image ou un indicateur de progression Leur affichage exact dpend de limplmentation choisie par le constructeur12
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Alertes
Quelques mthodes utiles
Pour une alerte modale Utiliser Alert.FOREVER
13
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
ListesSlection dlments (textes et/ou images) dans une liste de choix Les listes sont soit MULTIPLE EXCLUSIVE IMPLICIT slection multiple slection simple slection simple et confirmation
14
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Listes implicitesPeut servir de menu combine slection et confirmation la slection dun lment lance un vnement Lobjet Command vaut la constante SELECT_COMMAND
15
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Listes, extrait de javadocConstructeurs
Quelques mthodes
La numrotation des index commence 0
16
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Listes, exemple dutilisation
String[] elements = { ... }; // Elments du menu List menuList = new List("Menu", List.IMPLICIT, elements, null);Command selectCommand = new Command("Open", Command.ITEM, 1); menuList.setSelectCommand(selectCommand); menuList.setCommandListener(...); public void commandAction(Command c, Displayable d) { if (c == uneCommande) { } else if (c == List.SELECT_COMMAND) { } }
17
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
FormulairesPeuvent contenir tous les lments qui hritent de la classe Item. Disposition en ranges de tailles gales. Scrollbars gres automatiquement.
18
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires TextField Texte saisissable avec contraintes Deux parties : Le label Le texte
19
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires StringItem Affichage de textes Deux parties : Le label Le texteItem.PLAIN
Item.HYPERLINK Item.BUTTON
20
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires ImageItem Affichage dimages
21
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires ChoiceGroup Slections :
22
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires DateField Demande de saisie dune heure ou dune date
23
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires Gauge Les diffrents types dindicateurs :
24
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Formulaires Spacer lment : vide non interactif qui possde une taille minimum
Utilis pour positionner plus justement les autres lments (quivalant au pixel transparent sur les anciennes pages web)
25
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
TextBoxScreen qui permet dentrer et dditer du texte
26
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interfaces utilisateur
Travailler avec les classes de bas niveau
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
La classe Canvas
Elle est abstraite, il faut ltendre pour raliser un affichage. Il faut ensuite surcharger la mthode paint(Graphics g) La classe Graphics fournit des possibilits de rendu 2D Possibilit de grer les appuis sur les touches ou dutiliser des commandes.
28
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Exemple
class ExempleCanvas extends Canvas { // Il faut redefinir la mthode paint public void paint(Graphics g) { // Dessine un rectangle blanc pour fond g.setColor(0xFFFFFF); g.fillRect(0, 0, getWidth(), getHeight()); // Fixe la couleur noir g.setColor(0x000000); // Dessine un carr de 20x20 g.drawRect( getWidth()/2 - 10, getHeight()/2 - 10, 20, 20); } }29
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interfaces utilisateur
Interaction utilisateur
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
Interaction utilisateurUn objet Command est lquivalent dun bouton ou dun menu item dans une application standard. Lobjet Command ne peut tre associ quaux objets qui hritent de Displayable.
31
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
La classe Command
Une commande est dfinie par : Ses labels, affichs par le tlphone selon lespace disponible Le type de commande BACK, CANCEL, OK Priorit daffichage (Mise en avant par le tlphone)
32
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interaction utilisateurLes classes qui implmentent linterface CommandListener ralisent des actions dclenches par lactivation dun objet Command Cette interface contient une mthode :commandAction(Command c, Diplayable d)
Ce listener est enregistr grce la mthode de la classe DisplayablesetCommandListener(CommandListener cl)
33
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interaction utilisateur
// Cration de quelques commandes form.addCommand( new Command("EXIT", Command.EXIT, 2)); form.addCommand( new Command("OK", Command.OK, 1)); // Fixe cette classe comme listener form.setCommandListener(this); // Code excut en cas daction utilisateur public void commandAction( Command command, Displayable dis) { String label = command.getLabel(); if ("EXIT".equals(label)) notifyDestroyed(); else if ("HELP".equals(label)) displayHelp(); else if("OK".equals(label)) processForm(); }34
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interfaces utilisateur
Objets dinteraction utilisateur personnaliss
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
La classe CustomItemPour crer un lment dinteraction personnalis : Sous-classer CustomItem Implmenter les 5 mthodes protected int getPrefContentWidth(int height) protected int getPrefContentHeight(int width) protected int getMinContentWidth() protected int getMinContentHeight() protected void paint(Graphics g, int w, int h)
36
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Exemple
37
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Exemple (suite)
Code qui utilise le CustomItem
38
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Objets dinteraction personnalissPossibilit de se fondre dans lUI en rcuprant les couleurs courantes (Fond, bords) et la fonte utilise.
39
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interfaces utilisateur
Outils de conception
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
Netbeans et la cration dinterfaces Netbeans propose des assistants de cration dinterfaces utilisateur. Pour cela, il suffit de crer une Visual Midlet
41
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Outils de conception
Proprits des composants Palette doutils
Squence dcrans42 Formation ITIN / Universit de Cergy-Pontoise 10/11/2006
Exemple
43
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006
Interfaces utilisateur
J2ME Polish
10/11/2006
Formation ITIN / Universit de Cergy-Pontoise
J2ME Polish
j2ME Polish : http://www.j2mepolish.org/
45
Formation ITIN / Universit de Cergy-Pontoise
10/11/2006