Manual de usuario del Plugin MyMobileWeb versión 1.2
De MorfeoWiki
Tabla de contenidos |
Instalación
Prerrequisitos
Antes de instalar el plugin MyMobileWeb se debe:
- Tener instalado:
- Descargar:
- Plugin MyMobileWeb versión 1.2 Plugin que integra la plataforma MyMobileWeb con el entorno de desarrollo eclipse.
- SDK de MyMobileWeb versión 3.2 Contiene el SDK de MyMobileWeb
NOTA: Es necesario descargarse los ejemplos del SDK para un correcto funcionamiento.
¿Cómo instalarlo?
- Como la mayoría de los plugins de eclipse para instalarlos, basta con copiar la carpeta del plugin de MyMobileWeb en el directorio "plugins" de Eclipse.
Configuración
Una vez que se tiene el plugin instalado, se puede pasar a configurarlo, para ello debemos de seguir
Configurar servidores
Con el nuevo Eclipse Europa, se puede hacer correr las aplicaciones de MyMobileWeb en diversos servidores, a continuación se indicará como se configura cada uno de los que se han probado:
Tomcat
- Descargar Tomcat aquí
- Descomprimir la carpeta que resulte
- Arrancar eclipse Europa
- Ir a preferencias, hacer clic sobre Tomcat, una vez aquí:
- Especificar la versión de Tomcat que descargamos en el paso 1
- Poner en "Tomcat home" la ruta donde descomprimimos el Tomcat en el paso 2
- Desplegar la carpeta "Tomcat" donde antes hicimos clic para que se despliegue un menú y seleccionar "Advanced", dentro de el poner en "Tomcat base" la ruta donde descomprimimos el Tomcat en el paso 2
- Una ves seguidos estos pasos, el servidor estará listo para ejecutarse.
NOTA: Para que soporte la nueva versión de WURLF debemos modificar un parámetro de arranque del Servidor que estemos utilizando, en el caso de Tomcat sería:
- Desplegar la vista donde se encuentran los servidores.
- Hacer doble clic sobre el servidor Tomcat, para el caso del la imagen es "Tomcat v5.5 Server at localhost"
- Saldrá una pantalla de el siguiente estilo:
- A continuación pulsar en el enlace "Open launch configuration"
- En esta pantalla habrá que ir a la pestaña "Arguments" y en el el área de texto "VM Arguments" añadir un argumento mas que sea: -Xms512m -Xmx512m
JBoss
- Descargar JBoss aqui
Nota: recomendado descargarse la versión estable 4.2 en formato zip
- Descomprimir la carpeta que resulte
- Arrancar eclipse Europa
- Crear un nuevo servidor con el botón derecho sobre los proyectos: New-> Other -> Buscar Sever y seleccionar el JBoss 4.2
- Seguir los pasos, debemos tener en cuenta que hay que cambiar la ruta donde se encuentra, hay que indicar la carpeta base (la que se descomprimirlo en el paso 2)
- Una vez definida la ruta se utiliza igual que si fuera Tomcat, incluido la parte en la que se configuran los parámetros del servidor.
GlassFish
- Descargar GlassFish aqui
- Descomprimir la carpeta que resulte
- Ejecutar el fichero que resulta e instalarlo, siguiendo los pasos.
NOTA: Al instalarlo te pedirá que pongas un usuario y contraseña, recuerdala si la modificas ya a la hora de usarlo la se necesitará.
- Arrancar eclipse Europa
- Crear un nuevo servidor con el botón derecho sobre los proyectos: New-> Other -> Buscar Sever y en vez de seleccionar uno de la lista como se hizo para JBoss o Tomcat, se debe instalar uno nuevo ya que el GlassFish no viene por defecto para ello,seguir los siguientes pasos:
- Pulsar en el enlace "Download additional server adapter".
- Esperar a que se carge una lista de servidores y seleccionar GlassFish
- Seguir las instrucciones de instalación, las cuales pedirán que se reinicie el equipo
- Una vez instalado para utilizarlo se utilizara como los anteriores Servidores, es decir:
- Crear un nuevo servidor con el botón derecho sobre los proyectos: New-> Other -> Buscar Sever y seleccionar el GlassFish
- Seguir los pasos, debemos tener en cuenta que hay que cambiar la ruta donde se encuentra, hay que indicar la carpeta base (la que se descomprimirlo en el paso 2)
- Una vez definida la ruta se utiliza igual que si fuera Tomcat, excepto porque hay que introducir el nombre de usuario y contraseña que se puso en la instalación.
NOTA: Si tienes dudas puedes consultar el siguiente manual
Configurar preferencias:
Seguir los siguientes pasos:
- Descomprimir el fichero SDK de MyMobileWeb versión 3.2 descargado.
- Arrancar Eclipse e ir a la barra de menú "Window", pinchar en "Preferencias" y una vez dentro desplegar "MyMobileWeb".
- A continuación indicar la ruta del SDK y apuntar a la carpeta "MyMobileWeb_SDK_xx" que se acaba de descomprimir.
Configurar emuladores:
Además podemos selecinar diferentes navegadores donde vamos a poder correr las aplicaciones que generemos, para ello debemos:
- Desplegar el menú "Window".
- Pinchar en "Preferences".
- Al abrirse la ventana, desplegar la pestaña "MyMobileWeb".
- Seleccionar "Emuladors".
- Una vez en "Emuladores" podemos añadir emuladores, Pulsando en el botón "Add".
- Se desplegara una ventana donde podremos elegir el navegador pulsando el botón "Add".
La plataforma soporta diversos emuladores, por ahora se ha verificado su funcionamiento en:
NOTA: Se pueden borrar navegadores que ya no se utilicen dando al botón "Remove".
NOTA: Se pueden ordenar los navegadores por orden de precedencia de ejecución, de tal manera que posteriormente al dar a la ejecución rápida se cargará el primero de la lista. Esto se detallara en el apartado de [#Ejecución de emuladores|"Ejecución de emuladores"]
Desactivar validadores
- Para desactivarlos se debe ir a la barra de menú "Window", pinchar en "Preferencias" y una vez dentro desplegar "Validación",una vez allí desactivar todos los campos.
NOTA: Es conveniente desactivar los validadores ya que ralentizan el funcionamiento de la plataforma.
Creación de componentes
En este apartado se detallara cada uno de los componentes que se puede crear con la plataforma de desarrollo MyMobileWeb. Cada uno de estos componentes viene acompañado de un asistente de creación para facilitar su utilización. Es conveniente para evitar problemas, crear cada componente con el asistente que proporciona la plataforma, debido a que cada componente escribe en ficheros de configuración.
Crear un nuevo proyecto
Existen dos formas de acceder a la creación de un proyecto.
- Ir la barra de menú "Archivo", desplegar el submenú "Nuevo" y pinchar en "Proyecto".
- Pulsar el botón derecho en el espacio de generación de proyectos, desplegar el menú "Nuevo" y pulsar en "Proyecto".
Una vez que se ha accedido nos muestra un asistente con las siguientes pantallas:
- Seleccionar la carpeta "MyMobileWeb" o "MyMobileWeb Examples" dependiendo de si se quiera hacer un proyecto nuevo, o bien utilizar uno de los ejemplos como base.
- Poner el nombre del proyecto que se va a crear.
- Seleccionar un emulador, si no existe ningún emulador configurado, pinchar en "New" y seleccionar uno de los que estén instalados en la máquina.
NOTA: Es aconsejable definir el emulador vinculado al proyecto al generarlo ya que luego es muy probable que no nos deje vincularlo.
- Para especificar otros valores del proyecto pulsar en el botón "Next".
- Una vez aquí, el sistema nos muestra una pantalla donde podemos determinar:
- El nombre del paquete base de la aplicación.
- El nombre del paquete base del manejador de eventos.
- Y si se activa la casilla de verificación, para poder especificar la primera OP que cargará la aplicación así como una presentación básica que contiene un pequeño menú de ejemplo.
- Una vez finalizado el proceso, se obtendrá un árbol de directorios con la estructura siguiente:
Crear hoja de estilo (CSS)
- Acceder a la ventana de creación de CSS:
- Pulsar el botón derecho sobre el proyecto que deseamos crear la hoja de estilo, se desplegará un menú.Seleccionar el menú "MyMobileWeb" y dentro de el submenú "New Css".
- O bien, Desplegar el menú rápido de MyMobileWeb y seleccionar "Nueva CSS"
- A continuación aparecerá una pantalla donde podremos modificar:
- Nombre de familia o tecnología, solo con modificar el nombre se creara una nueva.
- Nombre de la hoja de estilo.
Crear OP (caso de uso)
- Pulsar el botón derecho sobre el proyecto que deseamos crear una OP (caso de uso), se desplegará un menú. Seleccionar el menú "MyMobileWeb" y dentro de el submenú "New OP".
- O bien, Desplegar el menú rápido de MyMobileWeb y seleccionar "Nueva OP"
- A continuación aparecerá una pantalla donde podremos modificar:
- Nombre de OP que vamos a generar.
- Se ha incorporado una casilla de verificación, para preguntar al usuario si desea crear un manejador de eventos para una determinada OP.
- Si deseamos crear una OP pulsar en el botón "Finish"
- Si deseamos crear una presentación podemos pulsar en el botón "Next"
- Cambios internos generados:
- Incorporar un manejador de eventos en WebContent/WEB-INF/src/NombrePaqueteBase.event.NombreOP/NombreOpHandlerEvent.java
- Incorporar una constante en el fichero de constantes: WebContent/WEB-INF/src/NombrePaqueteBase/MyOps.java
Crear una presentación
Existen dos formas de acceso:
- Pulsar el botón derecho sobre el proyecto que deseamos crear una presentación, se desplegará un menú.
- Seleccionar el menú "MyMobileWeb" y dentro de el submenú "New Op".
- A continuación aparecerá una pantalla donde podremos modificar:
- Nombre de OP que vamos a generar.
- Pulsar en el botón "Next"
- A continuación aparecerá otra pantalla donde podremos modificar:
- Nombre de OP que vamos a generar, usar el selector si se desea elegir una ya creada.
- Nombre de familia o tecnología a la que pertenece, usar el selector si se desea elegir una ya creada.
- Nombre de la presentación a generar.
- Pulsar en el botón "Finish"
- Pulsar el botón derecho sobre el proyecto que deseamos crear una presentación, se desplegará un menú.
- Seleccionar el menú "MyMobileWeb" y dentro de el submenú "New Presentation".
- A continuación aparecerá otra pantalla donde podremos modificar:
- Nombre de OP que vamos a generar, usar el selector si se desea elegir una ya creada.
- Nombre de familia o tecnología a la que pertenece, usar el selector si se desea elegir una ya creada.
- Nombre de la presentación a generar.
- Se ha incorporado una casilla de verificación, para preguntar al usuario si desea crear un manejador de eventos para una determinada Presentación.
- Pulsar en el botón "Finish"
- Cambios internos generados:
- Incorporar un manejador de eventos en WebContent/WEB-INF/src/NombrePaqueteBase.event.NombreOP/NombrePresentacionHandlerEvent.java
- Incorporar una constante en el fichero de constantes: WebContent/WEB-INF/src/NombrePaqueteBase/MyPresentations.java
Crear una OA (Operación de aplicación)
NOTA: Se trata de partes de código ejecutables que el programador podrá definir y posteriormente llamar al producirse algún evento, como cargar una presentación. Este código puede realizar acciones como cargar datos de una base de datos externa, poner datos en contexto, ...
- Pulsar el botón derecho sobre el proyecto que deseamos crear una OA (operación de aplicación), se desplegará un menú. Seleccionar el menú "MyMobileWeb" y dentro de el submenú "New OA".
- O bien, Desplegar el menú rápido de MyMobileWeb y seleccionar "Nueva OA"
- A continuación aparecerá una pantalla donde podremos modificar:
- Nombre de OA que vamos a generar.
- Si deseamos crear una OA pulsar en el botón "Finish"
- Cambios internos generados:
- Se creara un fichero en el paquete referido a las OAs y dentro de el una clase donde se podrá definir el comportamiento de dicha OA.
- Un fichero de MyOAs donde se declararan todas las OAs que tengamos hasta el momento como constantes.
- Se incorporarán al fichero de config/OAConfig.xml.
Borrar una OA (Operación de aplicación)
- Pulsar el botón derecho sobre la OA que se desea eliminar y del menu que se desplega elegir la opción "Borrar OA".
- Cambios internos generados:
- Se borrara un fichero en el paquete referido a las OAs y la clase donde estaría definido el comportamiento de dicha OA.
- Se borrara la constante relativa a la OA definida en el fichero de MyOAs.
- Se eliminara la linea relativa a la OA en el fichero de config/OAConfig.xml.
Generación de código
La plataforma MyMobileWeb nos permite generar código JSP, interpretable por los navegadores web, a partir de ficheros XML definidos como presentaciones y clases java definidas como OAs donde se especifica la funcionalidad.
Para aumentar la eficiencia de la generación se han definido 3 niveles a los que se puede generar JSPs. Cada nivel genera las presentaciones correspondientes al nivel jerárquico en el que nos encontremos.
Estos niveles se detallan a continuación.
Generar toda la aplicación
Generará el código relativo a la aplicación donde nos encontremos, para realizarlo se deberán seguir los siguientes pasos:
- Pulsar el botón derecho sobre el proyecto que se desee generar el código.
- Se desplegará un menú donde habrá que seleccionar el menú "MyMobileWeb" y dentro de el submenú "Generate Application".
Generar una OP
Generará el código relativo a la OP donde nos encontremos, para realizarlo se deberán seguir los siguientes pasos:
- Pulsar el botón derecho sobre la OP del proyecto que deseamos generar las páginas JSP, se desplegará un menú.
- Seleccionar el menú "MyMobileWeb" y dentro de el submenú "Generate OP".
Generar una Presentación
Generará el código relativo a la presentación donde nos encontremos, para realizarlo se deberán seguir los siguientes pasos:
- Guardar una presentación que se estaba editando (Control + S) o bien
- Pulsar el botón derecho sobre la presentación del proyecto que deseamos generar el código.
- Se desplegará un menú donde habrá que seleccionar el menú "MyMobileWeb" y dentro de el submenú "Generate Presentation".
Generar presentaciones vinculadas a CSS
Las hojas de estilo, en la que se define el aspecto de las páginas que se generaran, pueden ser modificadas y guardarse (Control + S) se generan automáticamente todas las presentaciones que estén asociadas a la misma.
Generador automático
Para facilitar la labor del desarrollador al guardar una presentación, (Control + S) se genera automáticamente el código JSP vinculado a esa presentación.
Si no se desea dotar de esta funcionalidad, se puede desactivar, en el menú "Window" preferencias y dentro de "MyMobileWeb" quitar los ticks de: "Generate presentations automatically".
Extractor de literales
Existe únicamente un nivel de extracción de literales, a nivel de aplicación, es decir, sobre todas las presentaciones. Antes de generar JSPs para aplicación, es conveniente extraer literales porque estos son necesarios para la generación de código JavaScript
La forma en la que se extraen los literales es la siguiente:
- Pulsar el botón derecho sobre el proyecto que deseamos extraer los literales de las páginas JSP, se desplegará un menú.
- Seleccionar el menú "MyMobileWeb" y dentro de el submenú "Literals Extractor".
Gestión de errores
La plataforma dispone de una herramienta de gestión de errores, para ayudar al desarrollador a escribir las presentaciones sintácticamente correctas.
Además de ello se recomienda instalar un plugin http://colorer.sourceforge.net/ para ayudar en la escritura correcta de los XML.
Para determinar si una presentación es correcta basta con guardarla, con esto se consigue que la plataforma valide su contenido y si encuentra un error nos muestra un mensaje donde detalla: el número de línea y la causa por la que no se ha generado. Un ejemplo de vista de errores es el siguiente:
Si no aparece por defecto la vista de errores de MyMobileWeb puede activarse pulsando en el menú: "Windows" -> "Show Views" -> "Other" y dentro de ella se elige la vista de "MyMobileWeb".
Información de dispositivos
La plataforma dispone de una herramienta externa para determinar las características propias de cada dispositivo móvil. La forma de acceder a esta herramienta es:
- Desplegar el menú del botón
- Seleccionar "Device information".
- Desplegar el menú del botón
- Esperar a que carge la siguiente aplicación:
Ejecución de emuladores (nuevo)
Antes de poder arrancar un emulador es necesario configurar un servidor donde va a correr, sino se ha configurado todavía se puede hacer siguiendo las instrucciones detalladas en el apartado de configuración
NOTA: Si no existe ningún servidor configurado al intentar correr las aplicaciones aparecerá una pantalla para poder configurar el servidor. Ejemplo: seleccionar el servidor "Apache" y dentro de el "Tomcat v5.5 Server" Es conveniente tiquear la casilla donde pone "Always use this server where running this project" para que siempre se arranque el servidor seleccionado.
Existe varias formas de correr las aplicaciones estas son:
- Forma 1:
- Asegurarse de que este un proyecto seleccionado.
- Desplegar el menú del botón
.
- Seleccionar un emulador de la lista.
- Forma 2:
- Sobre el proyecto que deseemos correr, pulsar al botón derecho.
- Seleccionar "MyMobileWeb".
- Pinchar en "Run emulator".
- NOTA: Esto hará que se ejecute el primer emulador de la lista de emuladores seleccionados en la parte de configuración
- Forma 3: (Nueva)
- Desplegar el botón de arranque de aplicaciones y pinchar en "Open Run Dialog...".
- Crear una nueva aplicación MyMobileWeb.
- Configurar los servidores que se desee que arranquen para esa aplicación, para ello debemos incluirles en la lista de "Emulator selected" pulsando el botón de "Add->"
- Forma 4: (Nueva)
- Sobre el proyecto que deseemos correr, pulsar al botón derecho.
- Seleccionar "Run As".
- Pinchar en "MyMobileWeb".
Multidioma (nuevo)
La plataforma permite:
- Añadir/Eliminar idiomas.
- Modificar el idioma por defecto.
Añadir/Eliminar idiomas
Para ello debemos seguir los siguientes pasos:
- Ir al fichero de configuración MyMobileWeb.Global.xml ubicado en:
- Ir al fichero de configuración MyMobileWeb.Global.xml ubicado en:
/MiAplicacion/WebContent/config/MyMobileWeb.Global.xml (para Ecipse Europa)
/MiAplicacion/WebContent/config/MyMobileWeb.Global.xml (para Ecipse Clasico)
- Añadir/Eliminar un idioma a el modulo "Global" el campo "Instaled_Languages"
- Añadir/Eliminar un idioma a el modulo "Global" el campo "Instaled_Languages"
Ejemplo: Añadir el idioma francés "fr_FR"
NOTA: Cambios internos realizados por la plataforma
- Se han modificado el ficheros internos de configuración:
- Se han modificado el ficheros internos de configuración:
/.config/MyMobileWeb.CodeGen.xml
/.config/MyMobileWeb.LiteralExtractor.xml
Modificar el idioma por defecto
Para ello debemos seguir los siguientes pasos:
- Ir al fichero de configuración MyMobileWeb.Global.xml ubicado en:
- Ir al fichero de configuración MyMobileWeb.Global.xml ubicado en:
/MiAplicacion/WebContent/config/MyMobileWeb.Global.xml (para Ecipse Europa)
/MiAplicacion/WebContent/config/MyMobileWeb.Global.xml (para Ecipse Clasico)
- Modificar el idioma a el modulo "Global" el campo "Default_Language"
- Modificar el idioma a el modulo "Global" el campo "Default_Language"
Ejemplo: Modificar el idioma al ingles "en_US"
Detectar problemas internos del plugin
- El plugin de MyMobileWeb dispone de un volcado de trazas que se puede consultar desplegando la
Si no aparece por defecto la vista de errores de MyMobileWeb puede activarse pulsando en "Windows" -> "Show Views" -> "Other" y dentro de ella se elige la vista de "Error Log".
