Aplicaciones WebWorks HTML5 de BlackBerry para. la tableta BlackBerry. PlayBook Módulo 3 - Diseñar la primera aplicación para.

Transcripción

1 Aplicaciones WebWorks HTML5 de BlackBerry para la tableta BlackBerry PlayBook Módulo 3 - Diseñar la primera aplicación para la tableta BlackBerry PlayBook

2 Research In Motion Limited Módulo 3 Diseñar la primera aplicación

3 2012 Research In Motion Limited. Todos los derechos reservados. BlackBerry, RIM, Research In Motion, SurePress, SureType y las marcas comerciales, nombres y logotipos relacionados son propiedad de Research In Motion Limited y se encuentran registrados o se utilizan en los Estados Unidos y otros países. Ripple es marca comercial de tinyhippos, Inc.; JavaScript es marca comercial de Oracle America, Inc.; Dropbox es marca comercial de Dropbox, Inc. Corporation; WinZip es marca comercial registrada de WinZip International LLC; VMware es marca comercial VMware, Inc.; Windows es marca comercial de Microsoft Corporation; Mac OS es marca comercial de Apple Inc.; Google Chrome es marca comercial de Google Inc.; Mozilla y Firefox son marcas registradas de Mozilla Foundation; Web Inspector es marca comercial de Wintriss Engineering Corporation. Las demás marcas comerciales pertenecen a sus respectivos propietarios. Esta documentación, incluida cualquier documentación que se incorpore como referencia como la proporcionada o disponible como hipervínculo, se proporciona o se pone a disposición "TAL CUAL" y "SEGÚN SU DISPONIBILIDAD" sin ninguna condición, responsabilidad o garantía de ningún tipo por Research In Motion Limited y sus empresas afiliadas ("RIM") y RIM no asume ninguna responsabilidad por los errores tipográficos, técnicos o cualquier otra imprecisión, error u omisión contenidos en esta documentación. Con el objeto de proteger la información confidencial de RIM y sus secretos comerciales, la presente documentación describe algunos aspectos de la tecnología de RIM en términos generales. RIM se reserva el derecho de modificar de forma periódica la información contenida en este documento, sin que exista el compromiso de realizar tales modificaciones, actualizaciones, mejoras ni agregados, o de que se produzcan de forma oportuna. Esta documentación puede contener referencias a fuentes de información, hardware, software, productos, servicios, componentes y contenido de terceros como, por ejemplo, el contenido protegido por derechos de propiedad intelectual y sitios web de terceros (que en adelante se denominarán conjuntamente los productos y servicios de terceros ). RIM no controla ni es responsable por los productos y servicios de terceros, incluido de forma no taxativa, el contenido, la exactitud, el cumplimiento de los derechos de propiedad intelectual, la compatibilidad, el desempeño, la confiabilidad, la legalidad, la decencia, los vínculos y todo otro aspecto que corresponda a los productos y servicios de terceros. La inclusión de una referencia a los productos y servicios de terceros en este documento no implica responsabilidad alguna de RIM por tales productos y servicios de terceros ni por tales terceros. SIN PERJUICIO DE LAS PROHIBICIONES ESPECÍFICAS DE LA LEGISLACIÓN VIGENTE DE SU JURISDICCIÓN, QUEDAN EXCLUIDAS POR EL PRESENTE TODAS LAS CONDICIONES, APROBACIONES Y GARANTÍAS DE CUALQUIER TIPO, EXPLÍCITAS E IMPLÍCITAS, INCLUSO, AUNQUE DE FORMA NO TAXATIVA, TODA CONDICIÓN, APROBACIÓN, GARANTÍA, DECLARACIÓN O GARANTÍA DE DURABILIDAD, IDONEIDAD PARA UN FIN O USO ESPECÍFICO, COMERCIABILIDAD, CALIDAD COMERCIAL, AUSENCIA DE INCUMPLIMIENTOS, CALIDAD SATISFACTORIA O TITULARIDAD, O QUE DERIVE DE UNA LEY O COSTUMBRE O DEL CURSO DE LAS NEGOCIACIONES O USO COMERCIAL, O VINCULADO CON LA DOCUMENTACIÓN O SU USO, O EL DESEMPEÑO O MAL RENDIMIENTO DE TODO SOFTWARE, HARDWARE, SERVICIO O CUALQUIER PRODUCTO O SERVICIO DE TERCEROS MENCIONADOS AQUÍ. ASIMISMO, ES POSIBLE QUE EXISTAN OTROS DERECHOS QUE VARÍAN DE UN ESTADO O PROVINCIA A OTRO. ES POSIBLE QUE ALGUNAS JURISDICCIONES NO PERMITAN LA EXCLUSIÓN O LIMITACIÓN DE GARANTÍAS IMPLÍCITAS Y CONDICIONES. SIN PERJUICIO DE LAS DISPOSICIONES LEGALES VIGENTES, TODA GARANTÍA IMPLÍCITA O CONDICIÓN RELACIONADA CON LA DOCUMENTACIÓN QUE NO PUEDA EXCLUIRSE TAL Y COMO SE HA EXPUESTO ANTERIORMENTE, PERO QUE PUEDA SER LIMITADA, POR LA PRESENTE QUEDARÁ LIMITADA A NOVENTA (90) DÍAS DESDE DE LA FECHA DE ADQUISICIÓN DE LA DOCUMENTACIÓN O EL ELEMENTO QUE ES SUJETO DEL RECLAMO. SIN PERJUICIO DE LAS DISPOSICIONES LEGALES VIGENTES EN SU JURISDICCIÓN, RIM NO ASUMIRÁ RESPONSABILIDAD ALGUNA POR NINGÚN TIPO DE DAÑO RELACIONADO CON ESTA DOCUMENTACIÓN O SU USO, EL DESEMPEÑO O MAL DESEMPEÑO DE TODO SOFTWARE, HARDWARE, SERVICIO O PRODUCTOS Y SERVICIOS DE TERCEROS QUE AQUÍ SE MENCIONAN, INCLUIDOS, AUNQUE DE FORMA NO TAXATIVA, LOS DAÑOS DIRECTOS, CONSECUENTES, EJEMPLIFICADORES, INCIDENTALES, INDIRECTOS, ESPECIALES, PUNITIVOS Y AGRAVADOS, DAÑOS POR LUCRO CESANTE, IMPOSIBILIDAD DE OBTENER LOS AHORROS ESPERADOS, INTERRUPCIÓN DE LA ACTIVIDAD COMERCIAL, PÉRDIDA DE INFORMACIÓN COMERCIAL, PÉRDIDA DE OPORTUNIDADES DE NEGOCIO O DAÑO O PÉRDIDA DE DATOS, IMPOSIBILIDAD DE TRANSMITIR O RECIBIR DATOS DE CUALQUIER ÍNDOLE, PROBLEMAS VINCULADOS CON TODA APLICACIÓN QUE SE UTILICE JUNTO CON PRODUCTOS Y SERVICIOS DE RIM, COSTOS PRODUCIDOS POR EL TIEMPO DE INACTIVIDAD, PÉRDIDA DE USO DE LOS PRODUCTOS Y SERVICIOS DE RIM EN TODO O EN PARTE O DE CUALQUIER SERVICIO DE TIEMPO DE AIRE, COSTO DE BIENES SUSTITUTOS, COSTOS DE COBERTURA, INSTALACIONES O SERVICIOS, COSTO DE CAPITAL O TODA PÉRDIDA MONETARIA SIMILAR, TANTO SI LOS DAÑOS FUERON PREVISTOS O NO, Y AUN SI HUBIERE EXISTIDO AVISO A RIM DE LA POSIBILIDAD DE QUE SE PRODUJERAN TALES DAÑOS. SIN PERJUICIO DE LAS DISPOSICIONES LEGALES VIGENTES EN SU JURISDICCIÓN, RIM NO TENDRÁ NINGÚN OTRO TIPO DE OBLIGACIÓN O RESPONSABILIDAD CONTRACTUAL, EXTRACONTRACTUAL NI DE OTRAS ÍNDOLES, INCLUIDA LA RESPONSABILIDAD POR NEGLIGENCIA Y LA RESPONSABILIDAD ESTRICTA. Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 3

4 LAS LIMITACIONES, EXCLUSIONES Y RENUNCIAS DE RESPONSABILIDAD SE APLICARÁN: (A) INDEPENDIENTEMENTE DE LA NATURALEZA DE LA CAUSA DE LA ACCIÓN, DEMANDA O ACCIÓN SUYA, INCLUIDA PERO NO LIMITADA AL INCUMPLIMIENTO DEL CONTRATO, NEGLIGENCIA, AGRAVIO, EXTRACONTRACTUAL, RESPONSABILIDAD ESTRICTA O CUALQUIER OTRA TEORÍA DEL DERECHO Y DEBERÁN SOBREVIVIR A UNO O MÁS INCUMPLIMIENTOS ESENCIALES O AL INCUMPLIMIENTO DEL PROPÓSITO ESENCIAL DE ESTE CONTRATO O CUALQUIER SOLUCIÓN CONTENIDA AQUÍ; Y (B) A RIM Y A SUS EMPRESAS AFILIADAS, SUS SUCESORES, CESIONARIOS, AGENTES, PROVEEDORES (INCLUIDOS LOS PROVEEDORES DE SERVICIOS DE USO), DISTRIBUIDORES AUTORIZADOS POR RIM (INCLUIDOS TAMBIÉN LOS PROVEEDORES DE SERVICIOS DE USO) Y SUS RESPECTIVOS DIRECTORES, EMPLEADOS Y CONTRATISTAS INDEPENDIENTES. ADEMÁS DE LAS LIMITACIONES Y EXCLUSIONES MENCIONADAS ANTERIORMENTE, LOS DIRECTORES, EMPLEADOS, AGENTES, DISTRIBUIDORES, PROVEEDORES, CONTRATISTAS INDEPENDIENTES DE RIM Y TODA PERSONA O ENTIDAD RELACIONADA CON RIM DESLINDAN TODA RESPONSABILIDAD DERIVADA O RELACIONADA CON LA DOCUMENTACIÓN. Antes de instalar, utilizar o suscribirse a cualquiera de los productos y servicios de terceros, es responsabilidad del usuario asegurarse de que su proveedor de servicios de tiempo de aire ofrezca compatibilidad con todas sus funciones. Es posible que algunos proveedores de servicios de tiempo de aire no ofrezcan las funciones de exploración de Internet con una suscripción a BlackBerry Internet Service. Consulte con su proveedor de servicios acerca de la disponibilidad, arreglos de itinerancia, planes de servicio y funciones. La instalación o el uso de productos y servicios de terceros con productos y servicios de RIM puede requerir la obtención de una o más licencias de patentes, marcas comerciales, derechos de propiedad intelectual o de otro tipo para prevenir la violación de los derechos de terceros. Es responsabilidad exclusiva del usuario determinar si corresponde utilizar dichos Productos y servicios de terceros y averiguar si tales licencias de terceros son necesarias, en cuyo caso será responsable también de su adquisición. Los productos y servicios de terceros no deberán instalarse ni utilizarse hasta que el usuario haya adquirido todas las licencias necesarias. Todo producto o servicio de terceros ofrecido junto con los productos y servicios de RIM se proporciona para comodidad del usuario y en el estado en que se encuentra, y RIM no ofrece ningún tipo de condición, aval ni garantía explícita ni implícita, ni asume responsabilidad alguna en este sentido. El uso de productos y servicios de terceros se rige por las cláusulas de las posibles licencias y acuerdos correspondientes celebrados con terceros y dependerá de su aceptación por parte del usuario, sin perjuicio de toda disposición expresamente estipulada al respecto en virtud de una licencia u otro tipo de acuerdo celebrado con RIM. Algunas características mencionadas en esta documentación necesitan una versión mínima del software de BlackBerry Enterprise Server, BlackBerry Desktop Software y/o BlackBerry Device Software, y puede que se requiera desarrollo adicional o Productos o servicios de terceros para acceder a las aplicaciones de la empresa. Este producto incluye el software desarrollado por Apache Software Foundation ( y/o tiene licencia de conformidad con la versión 2.0 de Apache License ( Para obtener más información, consulte el archivo NOTICE.txt incluido con el software. A menos que se exija por la ley aplicable o se acuerde por escrito, el software distribuido bajo la licencia se distribuye TAL CUAL, SIN GARANTÍAS NI CONDICIONES DE NINGÚN TIPO, ni expresa ni implícita. Consulte la licencia para el idioma específico que rige los permisos y limitaciones en la licencia. Los términos de uso de cualquier producto o servicio de RIM se presentan en una licencia independiente o en otro acuerdo con RIM que se aplica en este caso. NINGUNA PARTE DE LA PRESENTE DOCUMENTACIÓN TIENE POR OBJETO PREVALECER SOBRE CUALQUIER ACUERDO EXPRESO ESCRITO NI GARANTÍA PROPORCIONADA POR RIM EN RELACIÓN CON PARTES DE PRODUCTOS O SERVICIOS DE RIM AL MARGEN DE ESTE DOCUMENTO Research In Motion Limited Módulo 3 Diseñar la primera aplicación

5 Acerca de este manual de laboratorio Este material se ha diseñado con el supuesto de que los participantes cumplen todos los requisitos previos necesarios antes de completar los ejercicios. Para que no se generen impactos negativos en la calidad de la experiencia de aprendizaje, RIM recomienda que los participantes cumplan todos los requisitos previos. Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 5

6 Contenidos Acerca de este manual de laboratorio... 5 Descripción general... 8 Objetivos... 8 Requisitos previos recomendados... 8 Requisitos de software... 8 Creación de un archivo.html Creación de un ícono para la aplicación Creación del documento de configuración config.xml Compilar una aplicación WebWorks HTML Crear un nuevo archivo Ilustración 3: carpeta Salida Integrar una aplicación para implementarla en el simulador Compilación e integración de aplicaciones por medio del emulador Ripple Acceder a archivos desde el sistema de archivos local por medio de Ripple Acceder al archivo de un proyecto desde un servidor web remoto por medio de Ripple.19 Opciones de integración del emulador Ripple Configuraciones de integración optativas en el emulador Ripple Integración de aplicaciones por medio del emulador Ripple Implementación de aplicaciones en el simulador de la tableta por medi o del símbolo del sistema Implementación de aplicaciones en el simulador de la tableta por medio del emulador Ripple Resumen y material adicional Resumen Material adicional Recursos adicionales Research In Motion Limited Módulo 3 Diseñar la primera aplicación

7 Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 7

8 Descripción general Objetivos En este módulo, el participante accederá a los siguientes conceptos: Creación de un archivo index.html para una aplicación Uso de un gráfico existente para el ícono de la aplicación Creación de un archivo config.xml para una aplicación Integración de los archivos de la aplicación en un archivo ".bar" por medio de BlackBerry WebWorks Packager utilizando el símbolo del sistema Acceso a un archivo de proyectos desde un servidor web remoto en el emulador Ripple para ver la aplicación Integración de aplicaciones por medio del emulador Ripple Implementación de aplicaciones en el simulador de BlackBerry PlayBook por medio del símbolo del sistema Integración y ejecución de aplicaciones en el simulador de BlackBerry PlayBook por medio del emulador Ripple Requisitos previos recomendados Para este módulo, los requisitos previos relacionados con las aptitudes y áreas de conocimiento son: Conocimiento de estándares web como HTML, CSS y JavaScript Experiencia en el uso de la herramienta Símbolo del sistema de Windows Experiencia en el uso de aplicaciones para crear un archivo.zip Requisitos de software Para completar este módulo, se requiere: Un editor de HTML (como el Bloc de notas) El archivo "icon.png de la carpeta de código de muestra Los archivos index.html y config.xml de la carpeta código de muestra Una aplicación que pueda crear archivos.zip como WinZip Instalación del SDK de BlackBerry WebWorks Instalación del simulador de BlackBerry PlayBook (por medio de VMWare ) Instalación del software del emulador Ripple Acceso a un servidor web remoto (como Dropbox ) Research In Motion Limited Módulo 3 Diseñar la primera aplicación

9 El archivo icon.png es un archivo de imagen gráfica que puede utilizarse como el ícono de la aplicación que diseñarán los participantes. Este ícono aparecerá en la pantalla de inicio de BlackBerry PlayBook, en el simulador de BlackBerry PlayBook. Si WinZip no está instalado en la computadora anfitriona local, se puede descargar y utilizar una aplicación de código abierto como 7-zip. 7-zip puede descargarse de Para probar una aplicación, el simulador de BlackBerry PlayBook debe estar instalado antes de comenzar este módulo. Las instrucciones de instalación, junto con los requisitos de hardware y software recomendados, están incluidos en el Módulo 2. Asimismo, las instrucciones para la instalación del software del emulador Ripple también se encuentran en el Módulo 2. Para este módulo, se puede crear una cuenta de Dropbox sin costo alguno en Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 9

10 Creación de un archivo.html Para comenzar a diseñar la aplicación "Hello World", abra un editor de texto como el Bloc de notas para crear un nuevo archivo. Este archivo incluirá el contenido de la aplicación. Este archivo se guardará como un archivo.html. En el nuevo archivo, agregue el código HTML: <!DOCTYPE html> <html> <head> <style type="text/css"> body { font-size: 5em; } </style> </head> <body> <p> Hello World </p> </body> </html> Después de agregar el código HTML como el contenido del archivo, guárdelo como "index.html" Research In Motion Limited Módulo 3 Diseñar la primera aplicación

11 Creación de un ícono para la aplicación Para crear una aplicación accesible para los usuarios, debería contar con un ícono en el que los usuarios puedan hacer clic desde la pantalla de inicio de la tableta para iniciar la aplicación. Los íconos pueden servirse de un gráfico existente o pueden crearse en forma personalizada por medio de un software de edición de gráficos (como Adobe Photoshop). También se pueden reutilizar imágenes de su propio sitio web o de una base de datos en línea de imágenes libres de derechos de autor (como istockphoto.com). Otra opción es crear su propio ícono utilizando una aplicación como Icon Maker para BlackBerry PlayBook Si desea crear o utilizar un gráfico existente para un ícono, se recomienda utilizar las siguientes dimensiones y formatos de archivo: Dimensiones recomendadas: 86 x 86 píxeles Formato de archivo recomendado: PNG Para este módulo, utilizaremos el gráfico "icon.png" que se incluye en la carpeta de código de muestra con este módulo. Ilustración 1: ícono Hello World icon.png Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 11

12 Creación del documento de configuración config.xml El documento de configuración de WebWorks HTML5 es un archivo.xml que contiene los elementos para definir el espacio de nombres de la aplicación WebWorks HTML5 de BlackBerry, el nombre de la aplicación, los permisos de la aplicación, la página de inicio y los íconos que se utilizarán para la aplicación. También incluye los elementos para definir información como autor, dirección de correo electrónico y otros parámetros. El documento de configuración contiene el elemento widget como su raíz. El elemento widget proporciona un contenedor para todos los otros elementos. El documento de configuración es un documento XML basado en especificaciones W3C. El archivo config.xml contiene elementos para definir: El espacio de nombres de la aplicación y su nombre Permisos de la aplicación Página de inicio Ícono que se utilizará para la aplicación Nombre del desarrollador de la aplicación Otros parámetros de configuración (como prioridad de transporte de la red, opciones de inicio, etc.) El documento config.xml también define parámetros de configuración adicionales como prioridad de transporte de la red, opciones de inicio, información de la licencia, etc. Encontrará un listado completo en el Blog de desarrolladores de BlackBerry. Para crear el documento "config.xml", abra un editor de texto como el Bloc de notas y cree un nuevo archivo. Cuando el nuevo archivo esté abierto, agregue el siguiente contenido XML al archivo: <?xml version="1.0" encoding="utf-8"?> <widget xmlns=" xmlns :rim=" version=" "> <name>hello World</name> <icon src="icon.png"/> <content src="index.html"/> </widget> Research In Motion Limited Módulo 3 Diseñar la primera aplicación

13 Al crear un archivo config.xml para una aplicación WebWorks HTML5, debe asignar el espacio de nombres para la aplicación WebWorks HTML5 de BlackBerry al elemento widget. Si falta el espacio de nombres, el archivo de la aplicación no será válido. El espacio de nombres de la aplicación es El espacio de nombres para las extensiones de WebWorks HTML5 de BlackBerry no es optativo. El espacio de nombres para extensiones de aplicaciones exclusivas de BlackBerry es xmlns:rim El archivo config.xml define las características visuales de la aplicación. Por ejemplo, en el siguiente código XML: <?xml version="1.0" encoding="utf-8"?> <widget xmlns=" xmlns :rim=" s" version=" "> <name>hello World</name> <icon src="icon.png"/> Las etiquetas destacadas en rojo indican las características visuales de la aplicación: el nombre de la aplicación (Hello World) y su gráfico (el gráfico "icon.png"). Ilustración 2: ícono Hello World Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 13

14 Compilar una aplicación WebWorks HTML5 Tras crear un elemento index.html, un elemento config.xml y un ícono, se podrá cargar y crear una aplicación WebWorks HTML5 básica en el simulador de BlackBerry PlayBook. Antes de cargar la aplicación en el simulador de BlackBerry PlayBook o en la tableta, los archivos deben estar compilados en un archivo ".bar". Al compilar una aplicación WebWorks de BlackBerry, BlackBerry WebWorks Packager realiza las siguientes acciones: Valida el contenido del archivo de WebWorks HTML5 de BlackBerry Crea una carpeta destino de salida y limpia todos los archivos antiguos (de ser necesario) Crea una carpeta destino de origen (si se lo especifica) y limpia todos los archivos antiguos (de ser necesario) Crear un nuevo archivo Un archivo WebWorks HTML5 de BlackBerry es un archivo ".zip", que puede crear con cualquier herramienta de archivado zip, que luego se compila por medio de la herramienta de línea de comando de BlackBerry WebWorks Packager (bbwp) para crear la aplicación. El archivo de la aplicación contiene los siguientes recursos: documento de configuración (archivo.xml ) página de inicio (otros archivos.html ) íconos de la aplicación (archivo.png ) otros recursos y objetos a los que se hace referencia en su aplicación El nombre del archivo.zip no debe ser superior a 10 caracteres (sin incluir la extensión.zip). Si previamente ha enviado la aplicación a BlackBerry App World, no podrá cambiar el nombre del archivo.zip para los próximos lanzamientos: debe permanecer igual. Si el nombre del archivo.zip se modifica, no se podrá actualizar la aplicación. No coloque ninguno de los archivos fuentes de su aplicación, o el archivo de su aplicación, en la carpeta de instalación de BlackBerry WebWorks Packager. Al compilar una aplicación por medio de la herramienta de línea de comando "bbwp", la carpeta de salida predeterminada es "bin", que intentará sobrescribir el directorio "bin" del SDK de WebWorks de BlackBerry, que contiene archivos esenciales Research In Motion Limited Módulo 3 Diseñar la primera aplicación

15 Para crear el archivo.zip, siga estos pasos: 1. Cree una carpeta para almacenar los archivos C:\mi_aplicación Guarde los elementos config.xml, index.html e icon.png en esta carpeta 2. Guarde los elementos index.html, config.xml e icon.png como un archivo.zip Vuelva a nombrar el archivo.zip como "hw.zip" 3. Cree una segunda carpeta en el directorio C:\mi_aplicación llamada salida" C:\mi_aplicación\salida Necesitará la carpeta C:\mi_aplicación\salida cuando se compile la aplicación. Cuando la aplicación se compile por medio de BlackBerry WebWorks Packager, se proporcionará un archivo ".bar" que se almacenará en la carpeta "salida". Este archivo.bar se implementará en la tableta. Ilustración 3: carpeta Salida Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 15

16 Integrar una aplicación para implementarla en el simulador Cuando se haya creado el archivo, la aplicación WebWorks HTML5 podrá compilarse e integrarse para su implementación. Para implementar la aplicación en el simulador de la tableta BlackBerry, debe estar compilada como un archivo ".bar". El primer método que puede utilizarse para integrar una aplicación WebWorks HTML5 es utilizar la herramienta de símbolo del sistema de Windows y la herramienta BlackBerry WebWorks Packager (bbwp.exe). Para acceder a la herramienta de símbolo de sistema en una computadora Windows, haga clic en el menú Inicio Ejecutar cmd (presione la tecla Intro ) Para utilizar el símbolo del sistema, escriba: cd C:\Program Files\Research In Motion\SDK de BlackBerry WebWorks HTML5 para SO de tabletas \bbwp Compile la aplicación por medio de la siguiente sintaxis: bbwp C:\mi_aplicación\hw.zip o C:\mi_aplicación\salida Ilustración 4: integrar una aplicación para su implementación Research In Motion Limited Módulo 3 Diseñar la primera aplicación

17 Si la compilación fue exitosa, se creará un archivo.bar en la carpeta C:\mi_aplicación\salida, si se especificó el parámetro o. Si no se especificó el parámetro o, el archivo.bar se creará en una subcarpeta denominada bin, que se encuentra en la carpeta C:\mi_aplicación. Ilustración 5: integrar una aplicación para su implementación Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 17

18 Ilustración 6: archivo.bar creado en un directorio específico Si la aplicación se compiló correctamente, un archivo.bar se creará en el directorio C:\mi_aplicación\salida, como se mostró en el diagrama anterior Research In Motion Limited Módulo 3 Diseñar la primera aplicación

19 Compilación e integración de aplicaciones por medio del emulador Ripple Un segundo método para integrar e implementar una aplicación es utilizar el emulador Ripple. Cuando se desarrollan los archivos para una aplicación (los elementos ".html", "config.xml", "icon.jpg" y otros archivos relacionados), se los puede integrar por medio del emulador Ripple para su implementación en el simulador de PlayBook. Acceder a archivos desde el sistema de archivos local por medio de Ripple Si los archivos de la aplicación están almacenados en la computadora local de un desarrollador, se puede acceder a ellos si no hay un servidor web remoto disponible. Desde el emulador Ripple, puede abrir archivos directamente desde el sistema de archivos locales de su computadora por medio de los siguientes pasos: 1. Copie la carpeta de su proyecto y todo su contenido en la carpeta RippleSites. Si esta carpeta no existe, debe crearla en una de las siguientes ubicaciones: Windows XP: C:\Documents and Settings\<Nombre de usuario>\ripplesites Windows 7: C:\Usuarios\<Nombre de usuario>\ripplesites Mac OS: /Usuarios/<Nombre de usuario>/ripplesites 2. Desde Ripple, en la barra de direcciones, escriba seguido de la carpeta de su proyecto y la página de aterrizaje Por ejemplo: Para obtener más información sobre cómo acceder a archivos por medio de Ripple si no hay disponible un servidor web remoto, acceda al Blog de desarrolladores de BlackBerry. Acceder al archivo de un proyecto desde un servidor web remoto por medio de Ripple Para probar una aplicación WebWorks HTML5 en el emulador Ripple que está instalado en un servidor web remoto (como Dropbox), los archivos deben estar almacenados en una carpeta pública. Cualquiera de Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 19

20 los archivos estará disponible para el público. Para utilizar un servicio como Dropbox, coloque los archivos index.html, config.xml e icon.png y los demás archivos en una carpeta pública. Si utiliza Dropbox, guarde los archivos index.html, config.xml e icon.png en la carpeta pública de su cuenta de Dropbox. Después de guardar los archivos en la carpeta pública, siga estos pasos: Abra su cuenta de Dropbox en un navegador (como Google Chrome, Mozilla Firefox, etc.) Navegue hasta la carpeta pública, haga clic con el botón derecho en el archivo índice, seleccione "Copiar vínculo público" Ilustración 7: acceder a un archivo de proyecto desde Dropbox Research In Motion Limited Módulo 3 Diseñar la primera aplicación

21 Seleccione "Copiar en el portapapeles" Pegue este vínculo en la barra de direcciones de Ripple Ilustración 8: copiar en el portapapeles Ilustración 9: barra de direcciones de Ripple El mensaje Hello World aparecerá en la pantalla de PlayBook en el emulador Ripple Ilustración 10: mensaje Hello World en el emulador Ripple Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 21

22 Opciones de integración del emulador Ripple El emulador Ripple puede utilizarse para integrar y compilar los archivos para una aplicación WebWorks HTML5. Antes de comenzar a compilar una aplicación por medio del emulador Ripple, debe estar familiarizado con algunas de las opciones de integración disponibles. Para obtener información sobre cómo descargar e instalar el software del emulador Ripple, consulte el Módulo 2. Para utilizar alguna de estas opciones de integración, los parámetros deben estar configurados para la plataforma que se está utilizando en el emulador Ripple (por ejemplo: WebWorks-SO de tabletas). Para configurar los parámetros, haga clic en la opción "Plataformas" del menú y seleccione3 "WebWorks-SO de tabletas". Ilustración 11: selección de su opción de integración Para acceder a las opciones de integración en el emulador Ripple, haga clic en el ícono de llave de tuerca que se encuentra en la esquina superior derecha de la pantalla. Se pueden utilizar las siguientes opciones para la integración: Ilustración 12: opciones de integración Integrar: esta opción crea e integra la aplicación. En el caso de aplicaciones para la tableta BlackBerry, esta opción crea los archivos.zip y.bar para la aplicación. Integrar y firmar: esta opción crea, integra y firma la aplicación. En el caso de aplicaciones para la tableta BlackBerry, esta opción crea el archivo.zip y los archivos.bar firmados para la aplicación Integrar y ejecutar: esta opción crea, integra y ejecuta la aplicación en el simulador especificado. En el caso de aplicaciones para la tableta BlackBerry, esta opción crea los archivos.zip y.bar para la aplicación Research In Motion Limited Módulo 3 Diseñar la primera aplicación

23 Para integrar una aplicación en el emulador Ripple: Seleccione el ícono de llave de tuerca que se encuentra en la esquina superior derecha del emulador Ripple y seleccione Configuración. En el cuadro de diálogo "Integrar", deberá ingresar la ubicación del SDK de WebWorks HTML5 de BlackBerry y la ubicación de los archivos de la aplicación Hello World. Para obtener información sobre cómo descargar e instalar el software del SDK de WebWorks HTML5 de BlackBerry, consulte el Módulo 2. Ruta del SDK: la ruta en la que se instala el SDK de WebWorks HTML5 de BlackBerry. Esta información se requiere para integrar la aplicación. A continuación, presentamos las rutas del SDK predeterminadas: Windows XP: C:\Archivos de programa\research In Motion\SDK de WebWorks de BlackBerry para SO de tabletas <número de versión> Windows 7: C:\Archivos de programa (x86)\research In Motion\SDK de WebWorks de BlackBerry para SO de tabletas <número de versión> Mac OS: /Desarrollador/SDKs/Research In Motion/SDK de WebWorks de BlackBerry para SO de tabletas <número de versión> Raíz del proyecto: la ubicación de su proyecto (donde están guardados los archivos index.html, config.xml e icon.png) Esta configuración se requiere para integrar la aplicación. Ejemplo: C:\mi_aplicación\hw Nombre de archivo: el nombre que pertenecerá al archivo (por ejemplo: hw o HelloWorld ). Esta configuración se requiere para integrar la aplicación. Carpeta Salida: la ubicación donde residirán los archivos de salida. No puede ser la misma ubicación que la de la Raíz del proyecto. Esta información se requiere para integrar la aplicación. Ejemplo: C:\mi_aplicación\salida Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 23

24 Ilustración 13: ejemplo C:\mi_aplicación\salida Configuraciones de integración optativas en el emulador Ripple Existen configuraciones de integración adicionales en el emulador Ripple. Entre ellas se incluyen: Activar Web Inspector: esta configuración especifica si activar o desactivar el inspector web remoto para depurar y perfilar la aplicación en un dispositivo activo Nota: esta opción deberá estar desactivada cuando se integre la aplicación para distribuirla a la tienda BlackBerry App World Condicional: esta configuración se requiere únicamente si el desarrollador está probando la aplicación por medio de un inspector web remoto Contraseña CSK: la contraseña especificada para el almacén de claves de un desarrollador (cuando un desarrollador está registrado en la Autoridad de firmas de RIM para claves de firma de código) Condicional: esta contraseña se requiere únicamente si se firma la aplicación Contraseña P12: la contraseña que el desarrollador especifica cuando crea su certificado de desarrollador. Por otra parte, se trata de la contraseña de su almacén de claves Condicional: esta contraseña se requiere únicamente si se firma la aplicación Número de paquete: el número de paquete para la aplicación del desarrollador (por ejemplo, x, donde "x" es el número de paquete). Tras firmar la aplicación correctamente, este número automáticamente aumentará en 1. Condicional: esta contraseña se requiere únicamente si se firma la aplicación IP de PlayBook: la dirección IP del simulador de la tableta BlackBerry del desarrollador. Condicional: esta configuración se requiere únicamente si se ejecuta la aplicación en un simulador Contraseña de PlayBook: la contraseña del simulador de la tableta BlackBerry del desarrollador Condicional: esta configuración se requiere únicamente si se ejecuta la aplicación en un simulador Integración de aplicaciones por medio del emulador Ripple Antes de comenzar a integrar la aplicación por medio del emulador Ripple, asegúrese de que los parámetros de "Compilación" estén configurados. También asegúrese de que el archivo del documento de configuración (config.xml) esté almacenado en la raíz del proyecto. Para integrar la aplicación: Seleccione el ícono de llave de tuerca que se encuentra en la esquina superior derecha del emulador Ripple. Seleccione Integrar Research In Motion Limited Módulo 3 Diseñar la primera aplicación

25 El emulador Ripple crea la aplicación. Si la compilación y la integración se completan correctamente, se mostrará el mensaje "Se ha compilado correctamente" y el archivo ".bar" se almacenará en la carpeta Salida Ilustración 14: compilación exitosa Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 25

26 Implementación de aplicaciones en el simulador de la tableta por medio del símbolo del sistema Tras integrar y compilar correctamente la aplicación, recomendamos que se someta la aplicación a prueba en el simulador de BlackBerry PlayBook antes de implementarla en la tableta. El simulador de la tableta BlackBerry permite que los desarrolladores ejecuten y sometan a prueba una aplicación cuando no cuentan con acceso al hardware físico. Probar y depurar una aplicación es una fase importante en el proceso de desarrollo de software. Esto también se aplica a la hora de crear aplicaciones móviles para dispositivos como teléfonos inteligentes y tabletas. Implementar la aplicación en el simulador de la tableta BlackBerry permite que los desarrolladores vean y prueben las aplicaciones de la manera en que funcionarían en una verdadera tableta BlackBerry PlayBook por medio del software VMWare. Para probar la aplicación en el simulador de BlackBerry PlayBook por medio del símbolo del sistema, siga estos pasos: Inicie el simulador de BlackBerry PlayBook en VMWare Player Active el "Modo de desarrollo" El "Modo de desarrollo" del simulador de la tableta BlackBerry PlayBook debe estar activado antes de que se pueda cargar la aplicación. Para activar el "Modo de desarrollo", haga clic en el ícono de engranaje esquina superior derecha de la pantalla del simulador que se encuentra en la Ilustración 15: activar el modo de desarrollo Research In Motion Limited Módulo 3 Diseñar la primera aplicación

27 En la pantalla de Seguridad, haga clic en "Modo de desarrollo". Para utilizar la etiqueta Modo de desarrollo, configure el Modo de desarrollo en "ACTIVADO". En el campo Contraseña del dispositivo (en el menú principal de Seguridad), ingrese la contraseña para la tableta (la contraseña predeterminada para la tableta es "PlayBook"). Ilustración 16: modo de desarrollo Registre la dirección IP del simulador. Puede ver la dirección IP de la tableta presionando el ícono que se encuentra a la derecha del reloj de la barra de estado Ilustración 17: obtener la dirección IP Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 27

28 Abra una ventana de símbolo del sistema y navegue hasta la carpeta bbwp\blackberry-tablet-sdk\bin, que se encuentra debajo de la carpeta de instalación del SDK de WebWorks de BlackBerry. Ingrese el siguiente texto: C:\Archivos de programa\research In Motion\SDK de WebWorks de BlackBerry para SO de tabletas \bbwp\blackberry-tablet-sdk\bin Escriba el siguiente comando para cargar y ejecutar su aplicación en el simulador: blackberry-deploy -installapp -password <contraseña del simulador> -device <dirección IP del simulador> -package <ruta del archivo BAR> Ilustración 18: integrar la aplicación por medio del símbolo del sistema de Windows Regrese al simulador de PlayBook y haga clic en la opción "Todos" del menú. El ícono de la aplicación "Hello World" debería verse como se muestra a continuación: Research In Motion Limited Módulo 3 Diseñar la primera aplicación

29 Ilustración 19: aplicación Hello World Haga clic en el ícono de la aplicación "Hello World" para verla Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 29

30 Ilustración 20: aplicación Hello World Research In Motion Limited Módulo 3 Diseñar la primera aplicación

31 Implementación de aplicaciones en el simulador de la tableta por medio del emulador Ripple Una aplicación también puede implementarse en el simulador de BlackBerry PlayBook por medio del emulador Ripple. Antes de implementar la aplicación en el simulador de BlackBerry PlayBook, asegúrese de configurar los parámetros de "Compilación" y "Ejecución" en el emulador Ripple Asegúrese de almacenar el archivo del documento de configuración (config.xml) en la raíz del proyecto. Asegúrese de que el simulador de la tableta PlayBook ya esté iniciado (en VMWare Player) Para implementar una aplicación en el emulador Ripple, Seleccione el ícono de llave de tuerca Ripple. que se encuentra en la esquina superior derecha del emulador Seleccione Integrar y ejecutar. El emulador Ripple crea la aplicación. Si la creación y la integración se completan correctamente, se mostrará el mensaje "Se ha creado correctamente" Ilustración 21: compilación exitosa En el caso de aplicaciones para la tableta BlackBerry, los archivos.zip y.bar para la aplicación se almacenan en la carpeta de salida especificada. El simulador de la tableta BlackBerry ejecuta la aplicación. Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 31

32 Ilustración 22: la aplicación Hello World se ejecuta en el simulador de la tableta BlackBerry Research In Motion Limited Módulo 3 Diseñar la primera aplicación

33 Resumen y material adicional Resumen En este módulo, se cubren los siguientes temas: Creación de un archivo index.html para una aplicación Uso de un gráfico existente para el ícono de la aplicación Creación de un archivo config.xml para una aplicación Integración de los archivos de la aplicación en un archivo ".bar" por medio de BlackBerry WebWorks Packager Acceso a un archivo de proyectos desde un servidor web remoto en el emulador Ripple para ver la aplicación Integración de aplicaciones por medio del emulador Ripple Implementación de aplicaciones en el simulador de BlackBerry PlayBook por medio del símbolo del sistema Integración y ejecución de aplicaciones en el simulador de BlackBerry PlayBook por medio del emulador Ripple Material adicional Tras completar este módulo con éxito, los siguientes pasos incluyen preparar una aplicación para implementarla en una tableta. Entre estos pasos se encuentran: Configurar la computadora de un desarrollador para solicitar claves de firma de códigos Firmar una aplicación para implementarla en una tableta Crear un token de depuración para implementar una aplicación en una tableta Utilizar la herramienta Web Inspector para realizar pruebas y depurar aplicaciones La información sobre los pasos siguientes puede encontrarse en el "Módulo 4 - Prueba, firma e implementación de aplicaciones en la tableta BlackBerry PlayBook". Recursos adicionales A continuación, presentamos recursos adicionales a los que se pueden acceder para obtener más información sobre temas incluidos en este módulo. Para más información sobre documentos de configuración, vea Crear un documento de configuración de WebWorks Para más información sobre el simulador de la tableta BlackBerry, vea Utilizar el simulador de tabletas. Para más información sobre cómo utilizar un servidor web remoto de código abierto como Dropbox, visite los Foros de asistencia técnica de BlackBerry Para más información sobre cómo acceder a proyectos locales por medio de Ripple, visite el portal WebWorks HTML5 de BlackBerry Para más información sobre más parámetros de configuración en el archivo XML, visite Trabajar con el archivo de configuración XML Módulo 3 Diseñar la primera aplicación 2012 Research In Motion Limited 33