Aplicaciones WebWorks HTML5 de BlackBerry para la tableta

Transcripción

Aplicaciones WebWorks HTML5 de BlackBerry para la tableta
Aplicaciones
WebWorks HTML5
de BlackBerry para
la tableta
BlackBerry®
PlayBook™
Módulo 3 - Diseñar la
primera aplicación para
la tableta BlackBerry
PlayBook
Aplicaciones WebWorks HTML5 de BlackBerry
2
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
© 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
v0.01
3
Aplicaciones WebWorks HTML5 de BlackBerry
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 (http://www.apache.org/) y/o tiene licencia de
conformidad con la versión 2.0 de Apache License (http://www.apache.org/licenses/). 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.
4
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
5
Aplicaciones WebWorks HTML5 de BlackBerry
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 ............................................. 10
Creación de un ícono para la aplicación .................................... 11
Creación del documento de configuración “config.xml” ........................ 12
Compilar una aplicación WebWorks HTML5 ................................. 14
Crear un nuevo archivo ............................................... 14
Ilustración 3: carpeta Salida ............................................... 15
Integrar una aplicación para implementarla en el simulador ..................... 16
Compilación e integración de aplicaciones por medio del emulador Ripple ......... 19
Acceder a archivos desde el sistema de archivos local por medio de Ripple ......... 19
Acceder al archivo de un proyecto desde un servidor web remoto por medio de Ripple . 19
Opciones de integración del emulador Ripple ............................... 22
Configuraciones de integración optativas en el emulador Ripple ................. 24
Integración de aplicaciones por medio del emulador Ripple ..................... 24
Implementación de aplicaciones en el simulador de la tableta por medi
o del símbolo del sistema ............................................... 26
Implementación de aplicaciones en el simulador de la tableta por medio del emulador
Ripple............................................................... 31
Resumen y material adicional ............................................ 33
Resumen ......................................................... 33
Material adicional ................................................... 33
Recursos adicionales ................................................ 33
6
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
Módulo 3 – Diseñar la primera aplicación © 2012 Research In Motion Limited
v0.01
7
Aplicaciones WebWorks HTML5 de BlackBerry
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:
•
•
•
•
•
•
•
•
8
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®)
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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 http://www.7-zip.org/
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 www.dropbox.com
Módulo 3 – Diseñar la primera aplicación © 2012 Research In Motion Limited
v0.01
9
Aplicaciones WebWorks HTML5 de BlackBerry
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".
10
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
11
Aplicaciones WebWorks HTML5 de BlackBerry
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="http://www.w3.org/ns/widgets"
xmlns
:rim="http://www.blackberry.com/ns/widgets"
version="1.0.0.0">
<name>Hello World</name>
<icon src="icon.png"/>
<content src="index.html"/>
</widget>
12
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
http://www.w3.org/ns/widgets
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="http://www.w3.org/ns/widgets"
xmlns
:rim="http://www.blackberry.com/ns/widget
s" version="1.0.0.0">
<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
v0.01
13
Aplicaciones WebWorks HTML5 de BlackBerry
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.
14
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
15
Aplicaciones WebWorks HTML5 de BlackBerry
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 2.2.0.5\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
16
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
17
Aplicaciones WebWorks HTML5 de BlackBerry
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.
18
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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 http://localhost:9900/ seguido de la carpeta de
su proyecto y la página de aterrizaje
Por ejemplo:
http://localhost:9900/HelloWorld/index.html
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
v0.01
19
Aplicaciones WebWorks HTML5 de BlackBerry
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
20
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
Seleccione "Copiar en el portapapeles" Ilustración 8: copiar en el portapapeles
Pegue este vínculo en la barra de direcciones de Ripple
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
v0.01
21
Aplicaciones WebWorks HTML5 de BlackBerry
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.
22
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
23
Aplicaciones WebWorks HTML5 de BlackBerry
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,
1.0.0.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:
24
•
Seleccione el ícono de llave de tuerca
emulador Ripple.
•
Seleccione Integrar
que se encuentra en la esquina superior derecha del
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
•
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
v0.01
25
Aplicaciones WebWorks HTML5 de BlackBerry
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
26
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
27
Aplicaciones WebWorks HTML5 de BlackBerry
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 2.2.0.5\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:
28
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
29
Aplicaciones WebWorks HTML5 de BlackBerry
Ilustración 20: aplicación Hello World
30
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
31
Aplicaciones WebWorks HTML5 de BlackBerry
Ilustración 22: la aplicación Hello World se ejecuta en el simulador de la tableta BlackBerry
32
© 2012 Research In Motion Limited Módulo 3 – Diseñar la primera aplicación
v0.01
Aplicaciones WebWorks HTML5 de BlackBerry
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
v0.01
33

Documentos relacionados