lunes, 29 de diciembre de 2014

TEMA #9 LISTENERS:

COMMANDLISTENER, ITEMSTATELISTENER & ITEMCOMMANDLISTENER


En este tema vamos a ver un elemento muy importante para la interacción entre el usuario y la aplicación/juego J2ME, se trata de los Listeners que son como receptores de las señales que son enviadas por el usuario a través de elementos del tipo Command. Son varios los Listeners, en este tema sólo veremos tres que son los más relevantes. Veamos un ejemplo gráfico:




El Listener permite a la aplicación/juego realizar una acción dependiendo del Command utilizado por el usuario. Si sólo existiera un Command pero no hay un Listener que lo “escuche”, entonces el Command no realizará ninguna acción.
Para ver el funcionamiento de los Listeners debemos saber primero cómo definir un Command.


¿Definiendo Un Command?

Un Command se define de manera similar a como venimos definiendo cada elemento de la interfaz de alto nivel, con un tipo y un nombre, y además tiene una serie de parámetros que debemos proporcionar. A continuación se muestra cómo se define y un ejemplo:

Command comando = new Command(String nombre, int tipo, int prioridad);

Command cmd = new Command(“Salir”, Command.SCREEN, 1);

Este comando de ejemplo es el que se ha venido usando en cada una de nuestras aplicaciones de ejemplo...





Ahora, el comando puede ser de varios tipos: OK, CANCEL, BACK, STOP, HELP, SCREEN, ITEM, EXIT. Explicaremos cada uno. Yo en lo particular uso siempre el tipo SCREEN que es de uso general, y, cuando se necesita agregar un comando a uno de los elementos que pueden ser incluidos dentro de una Form (StringItem, ImageItem, TextField, DateField, ChoiceGroup, Gauge), se debe usar un comando de tipo ITEM. Esto lo veremos más adelante en este tema.

El otro parámetro que debemos proporcionar para definir un Command es la prioridad. La prioridad es un número que nos va a permitir darle más importancia a un comando que a otro a la hora de mostrarlo en la pantalla. Hay celulares que sólo pueden mostrar dos comandos a la vez y cuando agregamos más de dos comandos a la pantalla sólo se mostrará uno y los otros dos (o los demás) se mostrarán a través de un menú desplegable. A través de la prioridad decidiremos qué comando se verá en la pantalla y qué comandos estarán en el menú desplegable. La prioridad 1 determina que un comando es el más importante, y a medida que el número va siendo mayor (2, 3, 4, 5,...) el comando va siendo menos importante, por lo tanto pasará al menú desplegable. También es posible tener dos comandos con la misma prioridad, y lo que decidirá cuál será el más importante será el orden en el que se añadan a la pantalla a través del método .addCommand(Command cmd);.




En la imagen de la izquierda vemos el comando principal y vemos el menú desplegable (no desplegado). En la imagen de la derecha vemos que cuando seleccionamos el menú, éste se abre y se muestran los comandos que están dentro (menú desplegado).

 Ahora que ya sabemos cómo definir un comando vamos a ver el uso de los Listeners.


CommandListener
Este tipo de Listener puede ser usado en: Form, TextBox, List, y su estructura es la siguiente:

X.setCommandListener (new CommandListener () {
          public void commandAction (Command c, Diaplayable d){
                 //Acciones
}});

X puede ser cualquiera de los elementos que mencionamos. Veamos  un ejemplo de su uso.

Command salir = new Command(“Salir”, Command.SCREEN, 1);
Form form = new Form(“Pantalla 1”);
form.addCommand(salir);

form.setCommandListener (new CommandListener () {
          public void commandAction (Command c, Diaplayable d){
                 destroyApp(true);
                 notifyDestroyed();
}});

Primero definimos un Command llamado salir, luego definimos una Form donde lo agregaremos (puede ser un TextBox o un List), luego agregamos el Command que creamos a la Form, y por último le añadimos función a nuestro comando salir añadiendo a la Form un CommandListener. En este caso la acción que se va a realizar es salir de la aplicación que se hace con esas dos líneas de código que podemos observar.

En este caso sólo tenemos una sola función, pero cuando agregamos varios comandos con funciones diferentes tenemos que hacer unos ajustes al código:

Command salir = new Command(“Salir”, Command.SCREEN, 1);
Command sig = new Command(“Siguiente”, Command.SCREEN, 1);
Command mostAlert = new Command(“Mostrar alert”, Command.SCREEN, 1);

Form form = new Form(“Pantalla 1”);
Form form2 = new Form(“Pantalla 2”);
Alert al = new Alert(“Aviso”, “Esto es una Alert.”, null, AlertType.ALARM);

form.addCommand(salir);
form.addCommand(sig);
form.addCommand(mostAlert);

form.setCommandListener (new CommandListener () {
          public void commandAction (Command c, Diaplayable d){
if(c==salir){
     destroyApp(true);
     notifyDestroyed();
}

if(c==sig){
     display.setCurrent(form2);
}

if(c==mostAlert){
     display.setCurrent(al);
}
}});

En este caso tenemos tres comandos (salir, sig y mostAlert), para lo cual queremos agregar funciones distintas, por lo que usamos la estructura de control if  haciendo referencia al comando al que queremos asociarle una función. La letra “c” proviene de la estructura del CommandListener (sombra roja). Vemos que hemos definido también una Form extra (form2) y un Alert (al). En este caso, dependiendo del comando que pulsemos se realizará una acción; si pulsamos el comando salir la acción que se realizará será salir de la aplicación, si pulsamos el comando sig la acción que se realizará será mostrar la form2, y si pulsamos el comando mostAlert la acción que se realizará será mostrar el Alert (al).

Como mencionamos, el CommandListener puede ser usado también en TextBox y List.
Descarga la aplicación de ejemplo. Descargar App     
Descargar el código de la aplicación y los recursos utilizados. Descargar       


ItemStateListener
Este tipo de Listener puede ser usado en: Form, y va a permitir vigilar el estado de cada elemento (Item) dentro de la Form de manera que si alguno de los elementos es modificado este Listener lo sabrá. Veamos su estructura:

Form form = new Form(“Pantalla 1”);

form.setItemStateListener (new ItemStateListener () {
          public void itemStateChanged (Item item){
                 //Acciones
}});

En este Listener se aplica algo parecido a CommandListener: si hay un solo elemento (Item)  dentro de la Form se coloca la acción a realizar directamente en dentro del ItemStateListener, pero si hay varios elementos (Items) dentro de la Form debemos usar la estructura de control if. Veamos un ejemplo:

Form form = new Form(“Pantalla 1”);

TextField tf = new TextField(“Nombre”, “”, 20, TextField.ANY);
Gauge gaug = new Gauge(“Edad”, true, 100, 18);
form.append(tf);
form.append(gaug);

Alert al1 = new Alert(“Aviso”, “Se ha modificado el TextField.”, null, AlertType.ALARM);
Alert al2 = new Alert(“Aviso”, “Se ha modificado el Gauge.”, null, AlertType.ALARM);

form.setItemStateListener (new ItemStateListener () {
          public void itemStateChanged (Item item){
                 if(item==tf){
display.setCurrent(al1);
}

if(item==gaug){
display.setCurrent(al2);
}
}});

En este ejemplo tenemos una Form y dentro de ella hemos agregado dos elementos, un TextField y un Gauge; además, hemos creado dos Alert (al1 y al2). El ItemStateListener vigilará si ocurre un cambio en alguno de esos elementos. Las acciones que le hemos asignado son: si ocurre un cambio en el TextField se mostrará la primera Alert (al1), y si ocurre un cambio en el Gauge se mostrará la otra Alert (al2).

Descarga la aplicación de ejemplo. Descargar App       
Descargar el código de la aplicación y los recursos utilizados. Descargar       


ItemCommandListener
Este Listener es parecido al CommandListener, lo que lo diferencia es que los comandos que “oirá” son los comandos que se han agregado a un elemento dentro de una Form, por lo que puede ser utilizado en: StringItem, ImageItem, TextField, DateField, ChoiceGroup, Gauge. Para hacer uso de este Listener debemos tener un Command, asignarlo a un elemento dentro de una Form (Item) y luego asignarle este Listener a ese Item. Veamos su estructura:

X.setItemCommandListener (new ItemCommandListener () {
          public void commandAction (Command c, Item item){
                 //Acciones
}});

X puede ser cualquiera de los 6 elementos que podemos incluir en una Form. Veamos un ejemplo:

Form form = new Form(“Pantalla 1”);
Command cmd = new (“x”, Command.ITEM, 1);
StringItem strItem = new StringItem(“Nombre: ”, “Arán”);

strItem.setDefaultCommand(cmd);
form.append(strItem);

strItem.setItemCommandListener (new ItemCommandListener () {
          public void commandAction (Command c, Item item){
destroyApp(true);
notifyDestroyed();
}});

En este ejemplo hemos creado una Form, un Command y un StringItem. Le agregamos el Comand al StringItem, a través del método .setDefaultCommand(Command comando);, y lo agregamos a la Form. Algo importante que debemos destacar es que el comando que se le debe agregar a un elemento dentro de una Form es de tipo ITEM. En este caso, cuando pulsemos el StringItem, la aplicación se cerrará.

Descarga la aplicación de ejemplo. Descargar App      
Descargar el código de la aplicación y los recursos utilizados. Descargar      


No hay comentarios.:

Publicar un comentario