0

INSTITUTO TECNOLÓGICO DE MATEHUALA

Ingeniería en Sistemas Computacionales

Desarrollo de aplicaciones móviles con plataformas libres

Practica 1 Desarrollo de aplicaciones con J2ME

TUTOR:

MC. Luciano Contreras Quintero

AUTOR:

Marco Antonio Doñez Rubio…………..…………….…… 11660153

A 11/03/15

1

Índice

tema Pagina

Objetivo 1-Introducción 2-Desarrollo 2.1- hola mundo grafico (proyecto HolaGraf) 2.1.1-algoritmo del proyecto HolaGraf 2.1.2-diagramas de flujo de la clase HolaMoverMid 2.1.3-diagramas de flujo de la clase CanvasGrafico 2.1.4-diagramas de flujo de la clase TextoGrafico 2.1.5-diagrama UML de la clase HolaMoverMid 2.1.6-diagrama UML de la clase CanvasGrafico 2.1.7-diagrama UML de la clase TextoGrafico 2.1.8-codigo de la clase HolaMoverMid 2.1.9-codigo de la clase CanvasGrafico 2.1.10-codigo de la clase TextoGrafico 2.1.11-ejecucion del proyecto HolaGraf 2.1.12-conclusion del proyecto HolaGraf 2.2- método paint (proyecto ejemplo2) 2.2.1-algoritmo del proyecto ejemplo2 2.2.2-diagramas de flujo de la clase APIBajoMid 2.2.3-diagramas de flujo de la clase APIBajoCanvas 2.2.4-diagrama UML de la clase APIBajoMid 2.2.5-diagrama UML de la clase APIBajoCanvas 2.2.6-codigo de la clase APIBajoMid 2.2.7-codigo de la clase APIBajoCanvas 2.2.8-ejecución del proyecto ejemplo2 2.2.9-conclusión del proyecto ejemplo2 3- conclusión general 4- Referencias bibliográficas

02 02 03 03 04 04 06 07 08 09 09 10 12 13 14 14 15 15 16 17 19 19 20 22 31 34 34 34

2

Objetivo

El alumno debe aprender a desarrollar aplicaciones para el ámbito móvil con las herramientas

de programación que se le den a conocer, deberá ser capaz de llevar a cabo, en este caso, de

trabajar bajo la herramienta de programación netbeans con la distribución del JDK para

desarrollo de aplicaciones compatibles con MIDP, en este caso el SDK de Java 2 Micro Edition.

1. Introducción

A lo largo de la programación en java se han encontrado con que las tecnologías que antes

innovaban ahora se han vuelto obsoletas, es por eso que decidieron invertir en la creación de

aplicaciones para los dispositivos que en su tiempo fueron los más requeridos.

Cuantos de nosotros no moría por tener un teléfono celular o un palm, kindle, solo para poder

ejecutar algún juego o bien para trabajar sin la necesidad de conexiones alámbricas, por ello

java decide crear un API de herramientas que fuese utilizado como auxiliar en la creación de

aplicaciones para dispositivos móviles bajo las restricciones de java o bien que ejecutaran

aplicaciones java.

No era lo mismo crear una aplicación de escritorio a crear una aplicación para un dispositivo de

este tipo ya que la incompatibilidad entre los dos dispositivos era muy grande.

En el presente documento se plasmara la creación de proyectos para estos dispositivos móviles

con la finalidad de reafirmar la teoría vista en clase, haciendo uso de la herramienta de

programación ya mencionada NetBeans, esta a su vez implementada con el SDK de J2ME para

poder llevar a cabo dichas aplicaciones.

3

2. Desarrollo

Para empezar con el entorno de programación fue necesario conocer cómo poner a punto

nuestro entorno de programación esto ya que si no se configura adecuadamente la

herramienta es inútil empezar a crear aplicaciones compatibles con MIDP, para esto como ya

mencionábamos anterior mente necesitamos el apoyo de una herramienta de programación la

cual en este caso será NETBEANS la cual configuramos agregándole un SDK para el desarrollo

de aplicaciones bajo J2ME, hizo falta instalarle una plataforma adicional que viene por defecto

en el sdk, y por último la configuración de un dispositivo como emulador para visualizar las

aplicaciones que generemos.

2.1. Hola mundo grafico (proyecto HolaGraf)

Este proyecto se hace con la finalidad de conocer una de las clases más importantes del SDK de

J2ME la clase Canvas, tal vez nos preguntemos ¿porque esta clase es importante, aún más que

las demás?, esta clase es importante ya que es la que nos permite desplegar elemento en

pantalla de manera gráfica.

Recordemos los JFrame de J2SE estos poseían el valor de desplegar pantallas graficas en las

aplicaciones de escritorio, el API de J2ME retoma algunos de esos elementos y los convierte

agregándoles un poco más de propiedades a cada clase del API ya existente para la generación

de nuevas clases con nombre diferentes.

¿Qué hace esta clase? En pocas palabras, tal vez en exageración, lo único que hace es desplegar

un saludo en pantalla que dice hola mundo, solo que este ejemplo lo hace de una manera única

ya que el texto se desliza de la parte superior de la pantalla a la parte inferior de la pantalla.

Cabe mencionar que el algoritmo siguiente se hará de acuerdo a la clase en la que nos

posicionaremos y los diagramas de flujo de cada uno de los métodos de la clase.

4

2.1.1. Algoritmo del proyecto HolaGraf 1. inicio 2. crear mensaje hola mundo 3. desplegar mensaje hola mundo 4. desvanecer mensaje hola mundo 5. repetir hasta paso siguiente 6. pulsar salir 6. salir

2.1.2. Diagramas de flujo de la clase HolaMoverMid

Método constructor método startApp

Inicio

fin

Inicio

fin

5

Método pauseApp metodo destroyApp

Método CommandAction

Inicio

fin

Inicio

fin

Inicio

fin

6

2.1.3. Diagramas de flujo de la clase CanvasGrafico

Método constructor método paint

Método parar método arrancar

Inicio

fin

Inicio

fin

Inicio

fin

Inicio

fin

7

2.1.4. Diagramas de flujo de la clase TextoGrafico Método constructor método mover

Método paint método pararTarea

Inicio

fin

Inicio

fin

Inicio

fin

Inicio

fin

8

Método run

2.1.5. Diagrama UML de la clase HolaMoverMid

Inicio

fin

9

2.1.6. Diagrama UML de la clase CanvasGrafico

2.1.7. Diagrama UML de la clase TextoGrafico

10

2.1.8. Código de la clase HolaMoverMid

11

En el código anterior se muestra lo que lleva por dentro una aplicación J2ME, y empezare por

redactar lo que hace cada parte de la clase.

Al principio de la clase solo se agregan las librerías que serán necesarias para la ejecución y

agregación de clases internas del api de java, seguido del nombre de la clase que hace referencia

a que utilizara métodos de una clase del api interno de java para ello hace la referencia con la

palabra reservada extends que en java se utiliza para el tema de la herencia.

Tenemos la creación de los atributos de la clase seguido el método constructor por defecto el

cual solo hace una asignación de valores a la variable aceptar, el valor que le asigna es un botón

en la parte de la pantalla del dispositivo con la etiqueta aceptar.

El método start app contiene asignación de valores y llamados a los métodos para que cuando

estos sean solicitados este método se encargue de hacer las igualaciones, asignaciones, etc.

El método pause solo contiene un llamado al método de la clase canvas grafico desde una

variable propia de la clase.

El método destroy app también contiene el mismo llamado al mismo método que se mencionó

anterior mente.

El ultimo método lo que hace es colocar un botón en la pantalla el cual al pulsarlo esta aplicación

se cerrara ya que tenemos el llamado al método anterior destruir aplicación.

12

2.1.9. Código de la clase CanvasGrafico

el código anterior lo que hace es crear un objeto canvas en la pantalla del dispositivo, en el cual

se tomaran los valores de altura y anchura del propio dispositivo y se inicializara un mensaje de

hola mundo el cual estará dentro de un rectángulo relleno de color blanco.

El método paint es el encargado de pintar de blanco el objeto canvas y el fillRect lo que hace es

inicializar o dibujar un rectángulo con los siguientes parámetros: que inicie en el punto cero del

eje x y en el punto cero del eje y retomando el valor que retorne la variable altura y anchura

del dispositivo.

Aquí en esta clase es donde se encuentra el método parar, el cual solo hace llamados al método

parar tarea.

El método arrancar inicializa un hilo, el cual es el proceso de repetición del mensaje que se

explicara en la codificación siguiente.

13

2.1.10. Código de la clase TextoGrafico

Este código hace que el mensaje que se despliegue en la pantalla o mejor dicho en el objeto

canvas de la pantalla valla descendiendo de la parte superior de la pantalla a la parte inferior.

Esto lo hace llamando varias veces al método paint.

14

El método mover hace las referencias al eje x y el eje y donde aparecerá este rectángulo en

donde se plasmara el mensaje y toma los valores para ir disminuyendo el mensaje hacia abajo,

si lo invertimos lo hará de la parte inferior a la parte superior .

2.1.11 Ejecución del proyecto HolaGraf

2.1.12. Conclusión del proyecto HolaGraf

En este proyecto no hubo dificultades ya que solo se agregó un canvas para desplegar el

mensaje.

Parece muy innecesaria la manera de desplegar un simple saludo en la pantalla pero en la

manera en que esta vez lo hicimos fue para conocer la utilización de un canvas el cual vamos a

ver más adelante en la creación de proyectos para android.

15

2.2 método paint (proyecto ejemplo2)

En este proyecto nos basamos más que nada en el método pain o mejor dicho en lo que contiene

ya que el objetivo de este proyecto es el de tener en cuenta las instrucciones que se utilizan en

la creación de un proyecto con diferentes dibujos en pantalla así puede ser un arco hasta un

rectángulo pintado de negro.

También en este método se interactúa con las fuentes de letras incluyendo el estilo que se le

determine, cabe mencionar que es un proyecto con clases extensas, tal vez demasiado extensas

a lo que estamos acostumbrados a programar, pero en fin es un proyecto que veámoslo como

complejo o innecesario es bueno para el conocimiento del uso de estas clases.

Este proyecto es muy pobre en cuestión de clases ya que este solo cuenta con dos clases que

son las que hacen funcionar el proyecto como tal, parecerá algo sencillo pero es algo que

refuerza el conocimiento sobre el api de java.

2.2.1. Algoritmo del proyecto ejemplo2

1- Inicio 2- Desplegar en pantalla un arco 3- Pulsar siguiente 4- Desplegar en pantalla un arco relleno 5- Pulsar siguiente 6- Desplegar en pantalla una línea solida 7- Pulsar siguiente 8- Desplegar en pantalla una línea punteada 9- Pulsar siguiente 10- Desplegar en pantalla un rectángulo 11- Pulsar siguiente 12- Desplegar en pantalla un rectángulo relleno de color negro 13- Pulsar siguiente 14- Desplegar en pantalla un rectángulo redondeado 15- Pulsar siguiente 16- Desplegar en pantalla un rectángulo redondeado relleno de color negro 17- Pulsar siguiente 18- Desplegar en pantalla triangulo relleno de color negro 19- Pulsar siguiente 20- Desplegar en pantalla una imagen 21- Pulsar siguiente 22- Desplegar en pantalla la misma imagen invertida 23- Pulsar siguiente 24- Desplegar alguna escala de grises o de color 25- Pulsar siguiente 26- Desplegar tipos de fuentes en diferentes tamaños 27- Pulsar terminar 28- fin

16

2.2.2. Diagramas de flujo de la clase APIBajoMid

Método constructor método startApp

Método pauseApp método destroyApp

Inicio

Fin

Inicio

Fin

Inicio

Fin

Inicio

Fin

17

Método commandAction

2.2.3. Diagramas de flujo de la clase APIBajoCanvas. Método constructor método escalaGris método escalaColor

Inicio

Fin

Inicio

Fin

Inicio

Fin

Inicio

Fin

18

Método paint

3

9

19

2.2.4. Diagrama UML de la clase APIBajoMid

2.2.5. Diagrama UML de la clase APIBajoCanvas

20

2.2.6. Código de la clase APIBajoMid

21

El código anterior solo es una codificación de referencia ya que en el están declaradas las

variables que necesitaremos en la codificación siguiente, cabe mencionar que para no hacer

redundancia de código tenemos que optar por hacer la partición de código como en este caso.

Ya que como ya mencionamos se declaran las variables que corresponden al display, al canvas,

a la misma clase que creamos y se muestra más adelante, los botones de salir y de seguir.

Esta clase también es importante ya que hace que la codificación que sigue pueda mandarce

ejecutar desde el método startApp ya que de ahí con la variable canvas mandamos llamar a los

métodos de la clase APIBajoCanvas.

En las primeras líneas de esta clase tenemos nada más la declaración de las librerías que serán

necesarias para correr el proyecto, en las cuales se puede hacer la observación de agregado de

clases que vamos a requerir el .*; significa que necesitamos todo lo de esa librería, sin embargo

si en vez de eso ponemos el nombre de las clases específicas que se necesitan se pueden poner,

esto para hacer una agrupación que exige pero también da opción de omitir java.

El ultimo método llama mucho la atención ya que es el que agrega la función a los botones que

aparecerán en la pantalla y a la acción del botón siguiente ya que este proyecto aunque parezca

un menú a simple vista, no lo es los valores los va tomando continuamente para ejecutar de uno

por uno los casos de la codificación siguiente.

22

2.2.7. Código de la clase APIBajoCanvas

23

24

25

26

27

28

29

En esta clase de codificación nos vamos a posicionar ya que es la clase de funciones que contiene

nuestro proyecto en esta clase si vamos a hacer mención por cada uno de los métodos ya que

el más importante, o bien el que sacamos del libro con el objetivo de verificarlo es el método

paint.

Primer método:

El método constructor se le llama asi ya que contiene el mismo nombre de la clase en la que

esta, este método solo hace una asignación o igualación de valores a la variable display que sea

igual a la variable _display.

El segundo método:

Es el método por el cual hicimos este proyecto es el método paint, el cual inicia con la obtención

de los valores de la pantalla del dispositivo donde se ejecutara el proyecto esto es importante

ya que de esto depende la posición que se le dé a los objetos para desplegarce en la misma.

Seguido tenemos un borrado de pantalla completo a que se refiere, se refiere a que mandamos

limpiar la pantalla cada que el proceso valla a volver a iniciar o simplemente para preparar la

pantalla para la primera ejecución de los planos gráficos.

Un poco más abajo tenemos la declaración de una instrucción de selección, esto con la finalidad

de que al momento de ejecución se valla mostrando lo que contiene cada caso, en nuestro caso

quedo de la siguiente manera:

30

Caso 0: se despliega un arco en la pantalla del dispositivo con su respectivo nombre en la parte

inferior y al centro de la pantalla.

Caso 1: se despliega otro arco solo que a diferencia del arco anterior este nuevo arco este relleno

de la parte interna con un color negro, este también contiene su respectivo nombre al centro y

en la parte inferior de la pantalla.

Caso 2: en esta opción se despliega una línea común y corriente atravesada de un extremo de

la pantalla hacia otro, también contiene su nombre en la misma posición que los anteriores.

Caso 3: en esta opción despliega la línea pero esta vez la despliega de manera punteada, con su

respectivo nombre como las demás.

Caso 4: en esta opción empezamos con las figuras geométricas ya que esta opción lo que hace

es desplegar un rectángulo en la pantalla del dispositivo, al igual que todos los casos cuando se

mande llamar.

Caso 5: esta opción al igual que la anterior muestra el rectángulo, pero en esta ocacion lo hace

rellenando el rectángulo de color negro, y su respectivo nombre debajo de él.

Caso 6: este caso lo que hace es desplegar un rectángulo pero esta vez con las esquinas

curveadas.

Caso 7: esta opción nos muestra el mismo rectángulo con esquinas curveadas pero relleno de

color negro.

Caso 8: esta opción despliega un triángulo relleno de color negro en la pantalla del dispositivo.

Caso 9: en esta opción le pasamos parámetros para que pueda desplegarnos en pantalla una

imagen cualquiera, o mejor dicho la que le hallamos dado como parámetro para desplegar.

Caso 10: esta opción despliega la misma imagen pero la diferencia está en que la imagen se

despliega con un efecto de espejo, como invertida.

Caso 11: dentro de la opción tenemos otra instrucción de selección la cual le pasaremos el

parámetro fijo sobre los casos que contiene.

Caso 2: este caso está dentro del caso 11 lo que hace es tomar la pantalla y pintar en un

rectángulo dos tipos de grises.

Caso 4: esta opción del caso 11 hace lo mismo que el caso anterior solo que a diferencia de este

lo hace mostrando 4 grises.

Caso 16: este es el que pusimos por defecto el cual despliega degradado de grises o 10 tonos de

grises.

31

Caso 256: esta opción muestra en pantalla 256 colores esta opción es mejor conocida como 8

bits.

Caso 16777216: este caso mejor conocido como de 24 bits ya que hace que la pantalla resuelva

los 16777216 colores que contiene.

Volvemos a los casos primarios y seguimos con el caso 12: esta opción despliega en pantalla una

cadena en diferentes formatos de letra, eso sí respetando el tipo que es SISTEMA es la fuente

predeterminada en este caso.

Caso 13: en esta opción es repetitivo el proceso que el del caso 12 solo que en esta cambia el

estilo de letra por un proporcional.

Caso 14: esta opción es repetitiva a las anteriores solo que el tipo de letra predeterminado es

MONOSPACE.

En si es lo que hace esta clase es contener todo lo que será desplegado en la pantalla con su

respectivo llamado ya que no pueden ejecutarse todos a la vez

2.2.8. Ejecución del proyecto ejemplo 2

32

33

34

2.2.9. Conclusión del proyecto ejemplo 2

Me parece un proyecto demasiado complejo y divertido a la vez ya que jugando con las

instrucciones a los botones podemos hacer muchas cosas.

Es una codificación muy extensa, en la cual se tuvieron pocos errores por ejemplo para poder

visualizar la imagen no la visualizaba por que no estaba declarada y tampoco la encontraba, la

duda se resolvió con la ayuda del profesor, ya que él nos proporcionó las líneas de código que

hacían falta para poder tomar el valor de la imagen y poder desplegarla.

3. Conclusión general Al ver los proyectos tan extensos para poder ejecutar cosas tan sencillas nos damos cuenta que es un tanto difícil la programación para dispositivos móviles de este tipo de plataformas ya que, como lo vimos, codificamos mucho para tan poco, si hubo sus errores como todos pero al final se pudieron resolver. Con forme van pasando los días, la programación para dispositivos móviles se va haciendo cada vez más extensa, no se descarta la idea de mi parte que en algún futuro no muy lejano ya sea algo fundamental para los programadores, tomando en cuenta que ya todo se hace con la ayuda de estos dispositivos móviles, y como no va a ser si es más práctico y cómodo para todos.

He llegado a la conclusión que J2ME no es una plataforma con un muy amplio futuro ya que

ahora conociendo la plataforma de android, se podría decir que es más práctico y dinámico

trabajar para esa plataforma, es por ello que las empresas invierten en algo que está innovando,

y está dejando atrás las plataformas de antaño, pero claro como no hacer mención en que es

muy divertido poder aprender ciertos aspectos de la programación para plataformas como

symbian ya que hay personas que aún siguen con este tipo de productos y quisieran el soporte

para que sus dispositivos estén “al día”.

4. Referencia bibliográfica.

Agustin Froufe Quintas & Patricia Jorge Cardenes J2ME Java 2 Micro Edition manual de usuario

y tutorial editorial alfa-omega