1

Tutorial para aplicaciones mviles J2ME con NetBeans y Mobility Pack

Arphean http://arphean.mirrorz.com anih@ozu.es Tutorial bajo licencia Creative Commons. Se permite copia y distribucin siempre y cuando se cite la fuente de procedencia y su autor. No se permite, bajo ningn concepto, modificacin o venta del presente trabajo. Licencia de Creative Commons.

2

Este tutorial presenta de una forma amena, grfica y facil los pasos para la creacin de una aplicacin (juego, programa, etc) en J2ME. Desde la instalacin de los componentes necesarios, hasta la ejecucin y trabajo con los mismos, en las siguientes lecciones aprenders a moverte fcilmente por una herramienta de desarrollo Java como es NetBeans. Obviaremos lo que es y la explicacin del profile MIDP para J2ME, puesto que existen multitud de artculos en Internet que lo explican claramente. Lo que no abundan son ejemplos concretos sobre una herramienta RAD para el desarrollo en J2ME, que es lo que vamos a tratar aqu. El fin es conseguir, en pocos pasos, la familiaridad con estas herramientas para que fcilmente puedas ir desarrollando tus propias aplicaciones. Como es habitual en todos mis tutoriales, nos apoyaremos sobre todo en imgenes, que es la forma mas visual, didctica y fcil de aprender. Introduccin Para conseguir trabajar en J2ME existen muchas formas, algunas muy simples, como la instalacin de Toolkits Java. Sin embargo, si recurres a ese tipo de instalaciones, estars bastante limitado para desarrollos posteriores y adems no te darn una visin global del lenguaje Java. Por ello aqu vamos a instalar herramientas profesionales, algunas bastante complejas, pero tocando solamente los aspectos J2ME para facilitar su uso. Se necesita, por ello, la instalacin de los siguientes componentes: El Java Standard Edition (J2SE), en su versin Java Development Kit (JDK), en su versin 4 o superior. Lo puedes descargar desde la web de Sun: www.sun.com Ojo con no confundir con el J2SE (Java Standard Edition), en su versin Java Runtime Environment (JRE), ya que este no nos servira, pues es solo el entorno de ejecucin, y nosotros lo que necesitamos es el entorno de desarrollo (Development). Despus de descargarnos el entorno Java, procederemos a descargarnos la herramienta de desarrollo propiamente dicha (RAD). Para Java existen muchas RAD, una de las primeras con las que he trabajado, por ejemplo, ha sido Sun One Studio, que es gratuita. Otras son de pago, y bastante caras. Sin embargo existe un IDE completo, gratuito y muy bueno, cuyo nombre es NetBeans. NetBeans es un Open Source Integrated Development Environment, escrito en Java, usado como plataforma para desarrollar programas en Java. Es decir, con NetBeans no solo podremos desarrollar para J2ME, sino tambin programas complejos para diferentes entornos y sistemas operativos (Windows, Linux, Mac) y aplicaciones servidor y cliente. Para descargar NetBeans acude a su web: www.netbeans.org La instalacin de todos estos programas depender del entorno operativo que poseas. Aqu relataremos la instalacin sobre Windows XP. Con NetBeans podrs: Crear un proyecto Ejecutar un proyecto Depurar un proyecto. Una vez tengas el NetBeans descargado (an no hemos instalado nada, recurdalo!), debers descargarte, bien desde el propio site de NetBeans, desde SUN o desde el Forum Nokia, la extensin Mobility Pack. Con el NetBeans Mobility Pack tendrs capacidad para desarrollar aplicaciones para dispositivos mviles, con caractersticas de optimizacin para el Mobile Information Device Profile (MIDP), y para el Connected Limited Device Configuration (CLDC). Adems, integra en nuestro NetBeans caractersticas de Visual Mobile Designer (diseo visual mvil); Wireles Connection Wizards: para acceder fcilmente a servicios va servlets, con soporte para el estndar JSR-172; Fragmentacin de Dispositivos: de

3

modo que puedas desarrollar aplicaciones para ejecutarlas en un dispositivo en concreto; Integracin con el J2ME Wireles Toolkit: la herramienta de certificacin y desarrollo J2ME, que integra emulacin OTA (Over-The-Air), mensaje inalmbrico y APIs multimedia, y WMA emulacin para mensajes SMS y CBS. Adems, integra un ofuscador (criptgrafo de cdigo), y OTA Download Testing, que emula dicha capacidad sobre un mvil real. Como ves, todas estas cualidades hacen que el Mobility Pack sea una herramienta potente y completa para desarrollar aplicaciones en J2ME. Instalacin Primeramente, procederemos a instalar el JDK (SDK JDK que significa lo mismo),de Java como tal, ya que es la mquina que las dems herramientas van a utilizar. Cabe resear aqu que todas estas herramientas son bastante pesadas, y que requieren de un ordenador medianamente potente para funcionar, con un mnimo de RAM de, por lo menos, 512 Mb 1GB de Ram. La instalacin se realiza clickeando sobre el archivo .exe que te has descargado, y siguiendo todos los pasos que en l se relatan. Dejemos todo tal como nos lo pone por defecto, incluidas las rutas, para que despus no tengamos que poner nada manualmente. Tras unos minutos tendremos el JDK instalado. Ahora procederemos a instalar el IDE NetBeans, ya que el Pack va sobre ste. Dependiendo de nuestra versin (si tenemos el IDE 4 instalaremos el Pack 4, si es el IDE 5, el Mobility Pack 5, y as sucesivamente.

Nos aparecer un mensaje como el siguiente. Le damos a Next:

4

Aqu nos va a pedir que le indiquemos dnde tenemos instalado el JDK, caso de que no lo hayamos instalado en el directorio por defecto, deberemos ponerlo nosotros. De lo contrario, el propio instalador nos encuentra l la ruta, por lo que le daremos a Next sin ms:

Al final de toda la instalacin, si todo ha ido correctamente, nos informar de las rutas en las que est localizable. Pulsaremos en Finish para salir del instalador.

Ahora procederemos a instalar el Mobility Pack propiamente dicho. Clickearemos doblemente sobre el ejecutable y, tras verificar la existencia del JDK, nos saldr algo como esto:

5

Debemos resear que esta ventana es diferente segn las versiones del Mobility Pack que instalemos. Esta es para el Mobility Pack en su versin 4.1. Pulsaremos en Next. Esta es la versin en el Mobility Pack 5.0:

Aqu nos dice, como ya sabemos, que requiere el IDE NetBeans, cosa que buscar. Caso de haber instalado NetBeans en las rutas por defecto, l mismo lo encontrar. De lo contrario puede que sea necesario que se lo busquemos nosotros. Pulsamos en Next. Todo lo que viene a continuacin es bastante fcil, por lo que seguiremos aceptando hasta finalizar la instalacin. Una vez lo tengamos completado, veremos en el escritorio un nuevo icono con el acceso directo al NetBeans.

6

Esta es la ventana del IDE nada mas instalarlo, en donde podemos ver una pequea gua de iniciacin, que integra tambin ayuda para el Mobility Pack que acabamos de instalar:

Bien, empecemos ahora la parte seria: comencemos a hacer una aplicacin.

7

El primer Midlet J2ME en NetBeans Lo primero, cabe apuntar que, a los programas escritos en J2ME para telfonos mviles se les denomina Midlets Java. Esta aplicacin, que tocar varias partes de cdigo Java y trabajos con el RAD NetBeans, consiste en un midlet que, de manera aleatoria, mostrar una imagen en la pantalla. De esta forma trabajaremos con variedad de componentes sin liar excesivamente al principiante.

Tras abrir el IDE, seleccionaremos la opcin File/New Project.

Nos aparecer una ventana parecida a esta, en la que podremos seleccionar diferentes tipos de aplicaciones. Nosotros comenzaremos por un Midlet completo, de modo que elegiremos Mobile, y en la parte de Projects seleccionaremos Mobile Application.

8

Aqu nos pide un nombre para el proyecto, pondremos verono. Tambin lo elegiremos como proyecto maestro, por lo que activaremos el check de Set as Main Project. NetBeans nos ofrece la oportunidad de crear un Midlet de ejemplo, un tipo Hola Mundo. No lo necesitamos, por lo que desactivaremos el check Create Hello Midlet. Le damos a Next:

9

Aqu seleccionaremos la plataforma de emulacin, y dems opciones secundarias. Dejaremos todo tal cual vemos en la imagen. Cabe resear algo importante. NetBeans puede trabajar con el profile anterior (versin 1.0) o con el actual (versin 2.0). Nosotros seleccionaremos el ltimo (el 2.0), aunque si tenemos que trabajar para mviles antiguos, probablemente no acepten esta versin del MIDP. En el cdigo, una vez estemos trabajando con la aplicacin, se podr ver que alguna parte del mismo NetBeans la conserva de la versin antigua, solamente para cuestiones de compatibilidad. No obstante, siempre que podamos trabajaremos sobre el 2.0.

En esta pantalla podemos seleccionar diferentes templates de colores y aspectos. Dejamos todo tal como vemos en la imagen, sin seleccionar nada, y pulsamos el botn Finish para que nos realice el midlet. Tras unos instantes, que depender de las opciones elegidas, aparecer el proyecto en la ventana principal del RAD.

10

Aqu, como se puede ver, no aparece gran cosa. Si en nuestro IDE no aparece algunos de los campos o barras que vemos, podremos activarla desde el men Window.

Vamos al tree de la parte izquierda, en Projects, y seleccionamos el nuestro. Veremos que aparece ya un package, denominado Default package. Pulsamos sobre l con el botn derecho del ratn, y seleccionamos New/Visual Midlet, para que nos realice el esqueleto de un Midlet en el cual podremos trabajar visualmente. Si activsemos el Midlet a secas, solamente podremos trabajar en cdigo con l, algo que no es muy acertado en el IDE de NetBeans, pues parte de su cdigo no es modificable por el usuario.

11

Aqu le pondremos un nombre al Midlet, y un nombre al nuevo Package, que se crear junto a l. En todo ello pondremos verono, y pulsaremos en Finish. Trabajo visual con formularios

Ahora ya vamos viendo mas cosas, verdad? Bien. Pinchamos en el botn Screen Design, para comenzar a disear el Midlet visualmente. Por ahora tendremos que escribir poco cdigo, todo ser visual.

12

Lo primero que deberemos crear es un formulario, que es un contenedor sobre el que J2ME nos permite incorporar diferentes componentes, con sus clases. Para ello, en la parte de la derecha, Palette, seleccionaremos el componente Form, y lo arrastraremos, sin soltarlo, hasta la zona del Screen Design, justo donde est la zona sombreada de la pantalla del display, en donde lo soltaremos.

Una vez tengamos el form (en la parte de arriba nos saldr form1[Form], vamos a incorporar un botn. Podramos seleccionar un Command habitual, pero vamos a elegir uno de los prediseados. Los botones, o comandos, los arrastraremos de la misma forma sobre el form. Elegiremos por tanto el Exit Command, y lo pondremos sobre el form1.

13

Como vemos, el botn exit no posee ninguna accin asociada. Pondremos el puntero de nuestro ratn sobre la parte de la derecha, en la zona del Screen Design, y pulsaremos sobre Edit.

Aqu podemos ver que se pueden elegir diferentes acciones prefijadas, as como el cdigo que cada una de ellas autogenera sobre el Midlet. Seleccionaremos Exit application, y pulsaremos sobre OK.

14

Vemos que, en la parte de edicin, ya aparece la nueva accin para el comando.

Ahora incorporaremos un contenedor de imagen. Lo que haremos ser incorporar el propio Item, sobre la imagen trabajaremos despus. Seleccionaremos el ImageItem, tal como aparece en la figura, y lo arrastraremos sobre el Form.

Este es el aspecto que nos quedar tras la introduccin del ImageItem.

15

Ahora iremos a la zona del Inspector, en la parte izquierda inferior de la pantalla. En tems, seleccionaremos el ImageItem que acabamos de incorporar, y pulsaremos sobre Properties.

Cabe resear que si desplegamos el ImageItem, podremos incorporarle tambin el Command que ya tenemos en el form.

16

Bien, una vez hemos pulsado sobre Properties del ImageItem, nos aparece un cuadro como el que vemos.

17

Lo que tenemos que hacer es crear la imagen del contenedor. Para ello, desplegaremos el List que hay en Image, y elegiremos New Image Resource (nuevo recurso de imagen). Le daremos a Close y cerraremos el cuadro.

18

Observaremos que, en la zona del Inspector, bajo el tree de Resources, ya tenemos el nuevo Image1 que acabamos de incorporar. Con el botn derecho lo seleccionamos y pulsamos en Properties.

Aqu nos muestra la ruta para incorporar la imagen propiamente dicha. Como vemos, no tenemos ninguna imagen an, as que clikearemos sobre la zona punteada de Resource Path.

Cabe destacar que previamente deberamos tener una imagen en la carpeta del proyecto. Para ello la abriremos e introduciremos aqu la imagen. Como se puede ver, nosotros hemos puesto una imagen en png (tambin puede ser jpg o gif), y cuyo tamao es de 188 x 138. Aunque en la imagen que se ve hemos puesto el imagen1.png sobre el archivo raz del proyecto, lo suyo es que vaya directamente dentro del directorio de recursos, en la carpeta src (sources). Aunque esto es indiferente, solamente debemos destacar una ruta que nos sea cmoda y trabajar siempre sobre ella con las imgenes.

19

Una vez hayamos pinchado sobre el botn punteado con , elegiremos la imagen que queremos y pulsamos en Ok.

20

Este es el aspecto que debe mostrar el cuadro de dilogo una vez hayamos seleccionado la imagen.

Ahora, como se puede observar en la zona de diseo, el Label de la imagen muestra simplemente su nombre. Vamos a modificarlo. Iremos a sus propiedades (listado de la derecha), y en Label escribiremos Ver o No. Lo mismo que esto podemos hacer en el resto de componentes que integremos, muy parecido a otros IDEs de otros lenguajes de programacin.

21

Escribiendo cdigo

Ahora vamos a empezar a mirar algo de cdigo Java. Para ello, pulsaremos sobre el botn Source, en la zona de diseo del Midlet.

Este es el aspecto del cdigo Java. Como se puede ver, est todo perfectamente ordenado, indicado y comentado. Nosotros vamos a incorporar el cdigo necesario para: - Visualizar el Form que acabamos de crear. - Incorporar la visibilidad o no de la imagen, segn se de el caso. Ya que, aunque ahora la ejecutemos (men Run), el midlet no har nada. Aunque s podremos depurarlo (men Build).

Bajo la lnea del import lcdui que vemos, escribiremos: import java.util.Random; Tal como vemos en la imagen.

22

En la zona de declaraciones, como vemos en la imagen, pondremos una variable de tipo Integer y cuyo nombre ser uno. Como vemos, al incorporar la variable ya nos aparece en la zona de Properties del IDE algunas de sus caractersticas, que podemos modificar, e incluso comentarios que podremos aadir para la documentacin Javadoc.

Ahora vamos a escribir, tal como aparece en la imagen, el cdigo para Randomizar un nmero. Esto lo usaremos para obtener un nmero al azar al que recurriremos para ocultar o visualizar la imagen, segn sea el nmero. La lnea random.nextInt () % 10 tiene como significado la extensin del nmero. Es decir, sera lo mismo que: numb = Math.abs( random.nextInt() % BOUND); Con un Bound igual a 10 lo que le estamos diciendo es que nos devuelva un nmero del 1 al 10.

23

Aqu incorporaremos el cdigo propiamente dicho para visualizar el formulario y para ver o no la imagen. Todo ello lo realizaremos en el mtodo de inicializacin de la aplicacin (initialize() ) Primeramente, le daremos a la variable integer uno, un valor de 5. Despus, con getDisplay().setCurrent(get_form1()); le estamos diciendo al Midlet que visualice actualmente el form1, cargndolo con get. El nombre de form1 es el nombre del form, obtenido al principio del cdigo, en la lnea que nos pone: private Form form1; El resto del cdigo es una simple comprobacin, y con ello logramos que, si el random devuelto es mayor que el 5, que hemos metido en la variable uno (podramos obviar la variable y poner el 5 directamente, pero para fines didcticos no lo hemos hecho), no carge ninguna imagen en el imageItem1.

24

Ahora ya podremos comprobar el funcionamiento del Midlet. Mediante Run/Run main Project podremos ejecutarlo en un entorno virtual. Saliendo y entrando del midlet (sin necesidad de cerrar el simulador) podremos ver que se oculta y aparece la imagen, indistintamente. Por su parte, si quisieramos compilarlo, bien para comprobar errores o para distribuir el archivo a telfonos mviles, solamente tendremos que ir al men Build/Compile nuestroarchivo.java.

25

Este es el aspecto de nuestro primer Midlet en ejecucin. Algo tremendamente sencillo pero que nos hace ver la forma de trabajo con J2ME en NetBeans. La etiqueta que vemos de Ver o No es la propia etiqueta que hemos puesto nosotros en el Image Item. ltimas notas

Si volvemos al IDE, veremos que en nuestro proyecto hay dos packages. Uno, por defecto, y el otro que hemos creado a partir del mismo.

26

En una aplicacin podremos tener diferentes packages, al que llamar el usuario y activar, mediante el men del propio Midlet. Sin embargo, si quisiramos crear el Midlet sobre el mismo package, sin crear nada mas que uno, en lugar de seleccionar el Package propiamente dicho, seleccionaremos el proyecto, es decir, el primer tem del tree, es decir: verono, como se ve en la imagen. Una vez sobre el,con el botn derecho del ratn seleccionaremos VisualMidlet. Tambin podremos cambiarle el nombre del package en cuestin, realizando un doble clic sobre l. Lo veremos a continuacin, en el siguiente captulo.

Aqu puede verse el men que aparecera en el mvil, con diferentes packages. Huelga decir que el men se puede generar mediante cdigo Java, ya que existe un tem para ello, que es la clase List.

27

Nos falta tambin explicar dnde tendremos el archivo que distribuiremos al telfono mvil. Dentro de la carpeta verono, existe una carpeta, denominada dist (distribution).

Dentro de dicha carpeta, podremos encontrar el archivo de recursos .jad, y el archivo de cdigo .jar, que son los que pasaremos al mvil. Cambindole el nombre a un package Para modificar el nombre a un package (de forma similar se procede con el resto de archivos), se procede de la siguiente manera:

Seleccionamos el package a modificar, y, con el botn derecho, seleccionamos Refactor/Rename.

28

Nos aparecer una ventana para cambiar el nombre, en cuyo ttulo nos informar del nombre actual del package. Ponemos el nombre que deseemos y pulsamos en Next.

NetBeants nos indicar los archivos, en cascada, que incluye ese package y que se vern afectados. El cambio se realizar, pues, a todos. Si deseamos anular la accin, pulsaremos en Cancel, y el nombre no se modificar. Para realizar el cambio, pulsaremos en Do Refactoring, y, tras unos instantes de trabajo, NetBeans cambiar el nombre.

Una vez hecho esto, el nuevo nombre del package figurar en el tree del listado, en Projects.

Cabe sealar, no obstante, que todos los archivos y recursos del Package, o que afecten al archivo al que le hemos cambiado el nombre, se vern afectados. Por ejemplo, la ruta de la imagen deber ser modificada para darle la ruta del nuevo nombre. Esto puede hacerse desde cdigo, o en modo visual, seleccionando la imagen, yendo a Properties y eligiendo Resource Path, en donde le indicaremos la nueva ruta. De lo contrario, el Midlet no funcionar correctamente.

29

Aqu puede verse la nueva ruta especificada por el cambio de package a visual1. Eplogo Confo en que este sencillo tutorial te resulte muy til a la hora de realizar tus Midlets en un entorno grfico como es NetBeans. Tambin espero que te haya ayudado para familiarizarte con el IDE. A partir de aqu lo dems es cuestin de que lo vayas probando t mismo, y de que experimentes y codifiques directamente con el cdigo Java. Gracias por tu atencin. Arphean Nih