01 interfaz grafica de usuario

J2ME (JAVA)

MIDLETSy Es una aplicacin java que me permite desarrollar

aplicaciones para celulares

Estructura basica de un MIDLETimport javax.microedition.midlet.*; import javax.microedition.lcdui.*; public class basico extends MIDlet { public void startApp() { } public void pauseApp() { } public void destroyApp(boolean unconditional) { }Este metodo es invocado por el sistema cuando el midlet tiene que ser destruido

Este metodo hace acopio de los recursos que va ha necesitarEste metodo es invocado cuando se necesita detener la ejecucion del midlet temporalmente

}

Herramienta de Programaciny sun_java_wireless_toolkit-2_5-windowshttp://java.sun.com/products/sjwtoolkit/download-2_5.html

y Netbeans 6.7http://www.netbeans.org/downloads/start.html?platform=windows&lang=en&option=java&version=6.7.1

Herramienta de Programaciny MOTODEX Studio (Motorola) y https://developer.motorola.com/platforms/java/

y DEL SDK DE SONYERICSSONhttp://developer.sonyericsson.com/site/global/docstools/java/p_java.jsp

y JDEVELOPER MEhttp://www.oracle.com/technology/tech/java/index.html

Estructura basica de un MIDLETimport javax.microedition.midlet.*; import javax.microedition.lcdui.*; public class basico extends MIDlet { public basico(){ } public void startApp() { } public void pauseApp() { } public void destroyApp(boolean unconditional) { }

Este metodo representa el constructor

}

Como crear un proyecto para dispositivos celularesy Paso # 3: se pone el nonbre el proyecto y de

deselecciona create hello MIDlet

Presionar botn Siguiente COLOCAR NOMBRE DEL PROYECTO

Como crear un proyecto para dispositivos celularesy Paso # 4: se presionar finalizar

Presionar finalizar

Como crear un proyecto para dispositivos celularesy Paso # 5 : proyecto creado satisfactoriamente

Como crear un proyecto para dispositivos celularesy Paso # 6 : crear un paquete

Como crear un proyecto para dispositivos celularesy Paso # 7: poner nombre del paquete

Como crear un proyecto para dispositivos celularesy Paso # 8: poner nombre del paquete

Como crear un proyecto para dispositivos celularesy Paso # 9: poner nombre del MIDlet

Como crear un proyecto para dispositivos celularesy Paso # 10: proyecto creado

Como crear un proyecto para dispositivos celularesy Paso # 9: poner nombre del MIDlet

COMPONENTES DE INTERFAZ DE USUARIOy Ahora que tenemos una idea bsica sobre el

funcionamiento de un MIDlet, pasaremos a describir los elementos grficos de los que disponemos para crear interfaces de usuario

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy La clase Screen hereda directamente de Displayable y

permite crear las interfaces grficas de alto nivel. y Un objeto que herede de la clase Screen ser capaz de ser mostrado en la pantalla.y Disponemos de cuatro clases que heredan de

Screen y que nos sirven de base para crear las interfaces de usuario. Son Alert , Form , List y TextBox.

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELForm Alert

display.setCurrent(objForm);

display.setCurrent(objAlert);

display

display.setCurrent(objTextBox);

display.setCurrent(objList);

TextBox

List

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy La clase Display y Maneja pantalla y dispositivos de entrada y Todo Midlet posee al menos un objeto Display

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Un MIDlet tpico estar compuesto de varios de estos

elementos. y Por desgracia, y debido al pequeo tamao de la pantalla, no pueden mostrarse ms de un elemento a la vez, por lo que tendremos que ir mostrando el elemento que necesitemos que ocupar toda la pantalla

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Estos componentes los podemos imaginar como una

serie de fichas de las cuales slo podemos mostrar una cada vez. y Para cambiar de una pantalla a otra usamos el mtodo setCurrent de la clase Display : y display.setCurrent(list1); Cada uno de las cuatro clases anteriores dispone de los mtodo siguientes :getTitle() Devuelve el ttulo de setTitle(String s) - Establece el ttulo de la pantalla la pantalla

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy El API de MIDP nos proporciona una serie de

componentes que nos permitirn construir las interfaces de usuario de forma sencilla. Por supuesto, aunque estos componentes son potentes para el entorno que nos ocupa, siempre hay que tener presenta las limitaciones de los dispositivos mviles en cuanto a pantalla y en cuanto a interaccin con el usuario.

display

y Como hemos visto en el cdigo presentado hasta el

momento, siempre debemos recoger el objeto de tipo Display que gestiona lo que muestra la pantalla del dispositivo

Display

display; display = Display.getDisplay(this);

display.setCurrent(null);

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVEL

display

Display

display; display = Display.getDisplay(this);


EXPLICACION DETALLADAy Display display;CREAR UNA REFERENCIA

Crear el objeto Display que es el control a la pantalla del dispositivo

display = Display.getDisplay(this);Este mtodo a travs del objeto de la clase Display lo podemos utilizar para poder colocar o insertar los distintos objetos que van ha mostrar en la pantalla


CODIGO FUENTEDisplay display;

display = Display.getDisplay(this);


COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Pantalla de aviso (Alert)y La clase Alert es una clase que muestra un mensaje determinado. y Adems que muestra el mensaje lo hace en un tiempo o hasta que se produzca un comando de tipo OK. Se utiliza para mostrar errores u otro tipo de mensajes al usuario

Sintaxis :Alert aviso ; aviso=new Alert( );

aviso.setTitle("titulo general"); aviso.setString( SOY EL PROFESOR ");

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Pantalla de aviso (Alert)

En este metodo estamos adicionando el aviso a la pantalla

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Tiempo de Visualizacion del Alert

alerta.setTimeout(int tiempo) Este metodo nos permite especificar el tiempo en milisegundos.y alerta.setTimeout(Alert.FOREVER);Este otro metodo nos permite hacer que el mensaje se mantenga hasta que se pulse un botn del dispositivo .

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVEL y Tipos de AlertaINFO : Este tipo de Alerta simplemente muestra un mensaje cualquiera.

yEste metodo seType se le envia un parametro AlertType.INFO

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVEL y Tipos de AlertaALARM : Este tipo de Alerta se caracteriza por que representa una alarma .

yEste metodo seType se le envia un parametro AlertType.ALARM

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVEL y Tipos de AlertaCONFIRMATION : Este tipo de Alerta se caracteriza por que representa un mensaje de confirmacion cuando una tarea ya se ha realizado

Este metodo seType se le envia un parametro AlertType.CONFIRMATION

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVEL y Tipos de AlertaERROR : Este tipo de Alerta se caracteriza por que representa un mensaje de Error ante una operacion mal realizada

Este metodo seType se le envia un parametro AlertType.ERROR

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVEL y Tipos de AlertaERROR : Este tipo de Alerta se caracteriza por que representa un mensaje de Peligro ante alguna tarea realizada.

Este metodo seType se le envia un parametro AlertType.WARNING

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Colocar imagen en el AlertCrear un objeto que contenga la imagen

Adicionar el objeto que contiene la imagen al Alert

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy TextBoxy La clase TextBox permite introducir y editar texto a pantalla completa. Es como un pequeo editor de textos. Sintaxis :Capacidad de caracteres del Textbox Tipo de Textbox

Titulo

contenido del TextBox

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy TextBoxy La clase TextBox permite introducir y editar texto a pantalla completa. Es como un pequeo editor de textos. Sintaxis :Capacidad de caracteres del Textbox Tipo de Textbox

Titulo

contenido del TextBox

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Pantalla de aviso (Alert)

En este metodo estamos adicionando el TextBox a la pantalla

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Tipos de TextBox

ANY - Sin limitacin EMAILADDR - Slo una direccin de email NUMERIC - Slo se permiten nmeros PASSWORD - Los caracteres no sern visibles PHONENUMBER - Slo nmeros de telfono URL - Slo direcciones URL

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Adicionar Texto a un TextoBox

y Capturar el valor de Texto del TextBox

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Captura la longitud del contenido del TextboxAdiciona texto

Calcula longitud

Adiciona nuevamente texto

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy int getChars (char[] texto)

En el caso de getChars(), el texto ser almacenado en la variable texto en forma de array de caracteres.

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Listy Es un objeto que incluye una lista de opciones .

Sintaxis :

Titulo

Tipo de lista exclusiva

Cargado de datos a traves de un arreglo

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Tipos de listas y Exclusiva

Implicita

Multiple

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Cargar imgenes al List

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELDisplay

y FORM Un Form es un elemento de tipo contenedor, es decir, es capaz de contener una serie de elementos visuales con los que podemos construir interfaces ms elaboradas. Los elementos que podemos aadir a un formulario son:y y y y y y

Form

StringItem ImageItem TextField DateField ChoiceGroup Gauge

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy FORMForm formulario ;

formulario=new Form("Formulario");

En este metodo estamos adicionando el formulario a la pantalla

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy FORM

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Insertar una Imagen en el form

Este metodo me permite insertar la imagen en el Form

COMPONENTES DE LA INTERFAZ DEDisplay USUARIO DE ALTO NIVELy Los principales componentes que se insertan en un

formulario son :y TextField y ChoiceGroup y DateField y Etc,etc

.Form

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy TextField : es un objeto que describe un campo de texto y se inserta sobre un objeto de la clase Form. Caracteres

Sintaxis:

numricos impresos dentro del campo de texto

Etiqueta que describe el componente

Numero de caracteres permitidos

Define la modalidad de entrada de datos


10 caracteres


Este metodo me permite insertar el campo de texto al formulario

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy TextField :

Sintaxis:TextField campoTexto;campoTexto=new TextField("Campo de Texto", 1234", 10, TextField.NUMERIC);

TextField.NUMERIC : entrada numrica TextField.URL : soporta la direccin URL TextField.EMAILDDR : soporta la direccin de un correo TextField.ANY : soporta un texto cualquiera

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy ChoiceGroup

Un objeto ChoiceGroup define un grupo de elementos seleccionados que pueden incluirse en un objeto ,solamente soporta los modos de seleccin exclusivo y multiple.

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy ChoiceGroup Sintaxis :String[] paises={ peru", chile", brasil"}; ChoiceGroup w ; w=new ChoiceGroup( Paises :",List.EXCLUSIVE,paises,null);Etiqueta que describe el componente

Modalidad de seleccion

Cargado del contenido del componente

Parametro nulo por defecto



Este metodo me permite insertar el choiceGroup al formulario

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy Capturar los elementos de un ChoiceGroup

int q= g1.getSelectedIndex();


yDateFieldy Un componente DateField es un objeto que puede presentar la fecha y la hora sobre un objeto Form. Si no se inicializa el metodo setDate() devolvera null de forma que la interfaz de usuario debe tener prevista la indicacion de una fecha desconocida. y Un objeto de tipo DateField puede configurarse para aceptar una fecha , una hora o ambas cosas a la vez. Si se indica el modo DATE, solamente admitira fechas , si el modo indicado es TIME solamente permitira la utilizacion de horas y minutos y si se indica el modo de funcionamiento como DATE_TIME , permitira el uso de fecha y hora.

COMPONENTES DE LA INTERFAZ DE USUARIO DE ALTO NIVELy DateField y Sintaxis :y DateField calendario ;

calendario=new DateField("",DateField.DATE_TIME); calendario.setDate(new Date());

Calendario inicializado

Tipo de calendario


DateField


DateField

COMANDOS DE PANTALLAy Me permite definir una serie

de mecanismos a los usuarios para que naveguen a travs de diferentes pantallas que constituirn la aplicacin que se ejecute en el dispositivo mvil. El paquete javax.microedition.lcdui proporciona la clase Command, que es la que va a implementar los comandos que se presentan en la pantalla del dispositivo mvil para permitir la navegacin

COMANDOS DE PANTALLAy Los comandos se presentan al usuario en base a la

sucesion de pantallas.El objeto Command encapsula el nombre y toda la informacion relacionada con la semantica de la accion correspondiente al comando. Su objetivo principal es presentar una lista de posibles acciones al usuario. El comando resultante de esa seleccin estara definido en un objeto de tipo CommandListener asociado a la pantalla.

COMANDOS DE PANTALLACommand ok ; ok = new Command("Aceptar", Command.OK, 1); Command salir ; salir= new Command("Salir", Command.EXIT, 1);

EVENTO DE LOS COMANDOS DE PANTALLAy Se implementa la interfaz CommandListener import javax.microedition.midlet.*; import javax.microedition.lcdui.*;

public class Negocio extends MIDlet implements CommandListener {Command Command ok ;

salir ;

public void commandAction(Command c, Displayable s){ if (c == salir){ destroyApp(true); notifyDestroyed(); }else if(c==ok){ }public Negocio( ) {ok = new Command("Aceptar", Command.OK, 1);

}

salir= new Command("Salir", Command.EXIT, 1); } }



salir ;

public void commandAction(Command c, Displayable s){ if (c == salir){ destroyApp(true); notifyDestroyed(); }else if(c==ok){ }public Negocio( ) {ok = new Command("Aceptar", Command.OK, 1 );

}




salir ;

public void commandAction(Command c, Displayable s){ if (c == salir){ destroyApp(true); notifyDestroyed(); }else if(c==ok){ }public Negocio( ) { salir= new Command("Salir", Command.EXIT, 1); } }ok = new Command("Aceptar", Command.OK, 1);

}


public classCommand Command

Negociook ;

extends MIDlet implements CommandListener {

salir ;

public void commandAction(Command c, Displayable s){ if (c == salir){ destroyApp(true); notifyDestroyed(); }else if(c==ok){ }public Negocio( ) { salir= new Command("Salir", Command.EXIT, 1); } }ok = new Command("Aceptar", Command.OK, 1);

}


public class basico extends MIDlet implements CommandListener {Command Command ok ;

salir ;

public void commandAction(Command c, Displayable s){ if (c == salir){ destroyApp(true); notifyDestroyed(); }else if(c==ok){ }public basico( ) {ok = new Command("Aceptar", Command.OK, 1);

}


Display

Form

Display

Form

Display

Form

Display

Form

EVENTO DE LOS COMANDOS DE PANTALLA

01 interfaz grafica de usuario

Documents