Framework eMobc HTML5
Contents
1. Los temas y estilos son la base visual en las pantallas Aportan colores formas y fondos que crean una estructura vistosa y agradable al usuario La aplicaci n cuenta con un sistema personalizado de temas y estilos donde es posible aplicar una tem tica a un tipo de pantalla o incluso a una pantalla en concreto 6 1 Procedimiento general Inicialmente al parsear el archivo app xml se toman dos campos claves stylesFileName y formatsFileName C mo su nombre indica guardar n el nombre de los ficheros XML que contienen los estilos y los formatos Una vez hecho eso se parsean dichos ficheros XML En el XML de formato se establecen distintos tipos de formato que existen por ejemplo title1 title2 text1 etc Cada uno de esos tipos de formato contiene informaci n b sica a cerca de estilos de textos como textColor textSize textStyle typeFace Tras finalizar sto se almacena en un HashMap en un objeto de la clase ApplicationData En el XML de estilos se asigna a cada tipo de pantalla un background y adem s unos campos basicos referentes a los distintos Views de una pantalla en los que se indica el formato que va a tener Estos campos son header cabecera footer descripci n inferior basic_text textos simples selection_list t tulos de una lista o cualquier otro view NO GENERICO creado por un usuario Por ltimo como antes se almacena en otro HashMap en un objeto de la clase ApplicationData2. all rights not expressly granted by Licensor are hereby reserved including but not limited to the rights described in Section 4 e 4 Restrictions The license granted in Section 3 above is expressly made subject to and limited by the following restrictions a You may Distribute or Publicly Perform the Work only under the terms of this License You must include a copy of or the Uniform Resource Identifier URI for this License with every copy of the Work You Distribute or Publicly Perform You may not offer or impose any terms on the Work that restrict the terms of this License or the ability of the recipient of the Work to exercise the rights granted to that recipient under the terms of the License You may not sublicense the Work You must keep intact all notices that refer to this License and to the disclaimer of warranties with every copy of the Work You Distribute or Publicly Perform When You Distribute or Publicly Perform the Work You may not impose any effective technological measures on the Work that restrict the ability of a recipient of the Work from You to exercise the rights granted to that recipient under the terms of the License This Section 4 a applies to the Work as incorporated in a Collection but this does not require the Collection apart from the Work itself to be made subject to the terms of this License If You create a Collection upon notice from any Licensor You must to the extent practicable remove from the Collection
3. THE EXTENT REQUIRED BY APPLICABLE LAW IN NO EVENT WILL LICENSOR BE LIABLE TO YOU ON ANY LEGAL THEORY FOR ANY SPECIAL INCIDENTAL CONSEQUENTIAL PUNITIVE OR EXEMPLARY DAMAGES ARISING OUT OF THIS LICENSE OR THE USE OF THE WORK EVEN IF LICENSOR HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES 7 Termination a This License and the rights granted hereunder will terminate automatically upon any breach by You of the terms of this License Individuals or entities who have received Adaptations or Collections from You under this License however will not have their licenses terminated provided such individuals or entities remain in full compliance with those licenses Sections 1 2 5 6 7 and 8 will survive any termination of this License b Subject to the above terms and conditions the license granted here is perpetual for the duration of the applicable copyright in the Work Notwithstanding the above Licensor reserves the right to release the Work under different license terms or to stop distributing the Work at any time provided however that any such election will not serve to withdraw this License or any other license that has been or is required to be granted under the terms of this License and this License will continue in full force and effect unless terminated as stated above Pagina 5 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 8 Miscellaneous a Each time You Distribute or Publicly Perform the Work or
4. diam sed porta quam Donec sem magna molestie sodales tempus blandit elementum sit amet est Donec rutrum elementum urna non fringilla tortor facilisis vitae Nulla nisl risus dictum sagittis ullamcorper id scelerisque ut libero Donec scelerisque sagittis metus at tristique massa ultrices vel Etiam nulla mauris auctor vel mollis eget consectetur in quam Suspendisse potenti E a 2 Home i Figura 18 Ejemplo de la Pantalla de Image con Texto La ventana Imagen con descripci n es una ventana que mustra una imagen con un cuadro de texto en la parte superior Incluye adem s un enlace debajo del texto con un Next Level y puede llevar a otra pantalla El cuadro de texto con la descripci n es de formato nico y admite scroll si el contenido es mayor que el espacio reservado Si quiere utilizar texto con diferentes formatos puede considerar la pantalla de contenedor web 7 13 Pantalla de Imagen con Zoom Esta pantalla permite que el usuario pueda ver una imagen con gran Zoom con una gran resoluci n Debido a que la imagen es mayor que una imagen que se pueda mostrar en la galer a contamos con un contenedor especial que permita mostrar la imagen en tama o real y que ademas le permite al usuario navegar a trav s de la imagen para poder ver todas sus partes a un tama o real P gina 31 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 7 14 Pantalla de Imagen Lista Figura 1
5. from You to exercise the rights granted to that recipient under the terms of the Applicable License This Section 4 b applies to the Adaptation as incorporated in a Collection but this does not require the Collection apart from the Adaptation itself to be made subject to the terms of the Applicable License c You may not exercise any of the rights granted to You in Section 3 above in any manner that is primarily intended for or directed toward commercial advantage or private monetary compensation The exchange of the Work for other copyrighted works by means of digital file sharing or otherwise shall not be considered to be intended for or directed toward commercial advantage or private monetary compensation provided there is no payment of any monetary compensation in con nection with the exchange of copyrighted works d lf You Distribute or Publicly Perform the Work or any Adaptations or Collections You must unless a request has been made pursuant to Section 4 a keep intact all copyright notices for the Work and provide reasonable to the medium or means You are utilizing i the name of the Original Author or pseudonym if applicable if supplied and or if the Original Author and or Licensor designate another party or parties e g a sponsor institute publishing entity journal for attribution Attribution Parties in Licensor s copyright notice terms of service or by other reasonable means the name of such party or parties ii the tit
6. gt lt pointDatald gt lt entryPoint gt Simplemente hay que definir el levelld y su correspondiente datald y la aplicaci n iniciar con la pantalla especificada Si no se especifica ning n dato en ste campo es decir los campos no tienen ning n contenido establecido la aplicaci n carga una pantalla b sica por defecto que no es m s que una botonera de inicio 3 2 Algunas caracter sticas La pantalla de portada o como se ha explicado el EntryPoint est fuertemente relacionada con los men s y es por ello por lo que la pantalla de inicio cuenta con unas restricciones y caracter sticas nicas en cuanto a la creaci n de stos Todos los men s del EntryPoint tienen unas propiedades especificas e Las funciones de los men s no se ven afectadas por lo que funcionan de igual manera tanto en todas las pantallas como en la pantalla de EntryPoint e No se cuenta con boton home en ningun tipo de men para la pantalla de EntryPoint el sistema lo ignora si el usuario lo hubiese especificado en el xml e No se cuenta con boton back en ningun tipo de menu para la pantalla de EntryPoint el sistema lo ignora si el usuario lo hubiese especificado en el xml Por otro lado se tiene en cuenta si se encuentra en la pantalla de EntryPoint cuando se pulsa el bot n back del sistema ya que su funci n es distinta para el resto de pantallas Si se encontrase en la pantalla de EntryPoint el si
7. identified the publisher and in addition i in the case of a performance the actors singers musicians dancers and other persons who act sing deliver declaim play in interpret or otherwise perform literary or artistic works or expressions of folklore ii in the case of a phonogram the producer being the person or legal entity who first fixes the sounds of a performance or other sounds and iii in the case of broadcasts the organization that transmits the broadcast g Work means the literary and or artistic work offered under the terms of this License including without limitation any production in the literary scientific and artistic domain whatever may be the mode or form of its expression including digital form such as a book pamphlet and other writing a lecture address sermon or other work of the same nature a dramatic or dramatico musical work a choreographic work or entertainment in dumb show a musical composition with or without words a cinematographic work to which are assimilated works expressed by a process analogous to cinematography a work of drawing painting architecture sculpture engraving or lithography a photographic work to which are assimilated works expressed by a process analogous to photography a work of applied art an illustration map plan sketch or three dimensional work Pagina 2 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 relative to geography topography architecture o
8. la Pantalla de B squeda ooooononocococooococcnononnccnnnnnonnnnnnnnnnononnnnnnnnnnnncnnnnnnnannnnnns 31 Figura 17 Ejemplo dela Pantalla de Formula 31 Figura 18 Ejemplo de la Pantalla de Image con Text iia idas 32 Figura 19 Ejemplo de la Pantalla de Lista con ImMage oocccccccncnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnos 33 Fietira 20 Ejemplo de la Pantalla de Multimedia tie 33 Figura 21 Ejemplo de la Pantalla de CalendarlO ooocoocccccccononononoooooooonooono nono noooononnonoonnnonorononrnornnnnnns 34 Eisura 22 Ejemplo de la Partalla ds OZ a 35 P gina 8 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 1 Descripci n general eMobc es un framework que permite generar aplicaciones m viles definidas desde un panel de control o manualmente para distintas plataformas Android OS y HTML5 El framework est basado en archivos XML Una vez se ha definido la aplicaci n que se quiere crear ste genera una serie de archivos XML que describen todas las propiedades pantallas y funciones que tendr la aplicaci n Control Panel XML Archives embML Languaje eMobc eMobc eMobc Framework Framework Framework Android IOS HTML5 Eclipse Xcode Project HTML5 CSS Project jQueryMobile Project Figura 1 Esquema General de eMobc Cada plataforma dispone de un proyecto base donde se almacenaran estos archivos xml Durante la ejecucion de la aplicacion son parseados a medida que son necesarios para
9. y los AppLevelData AplicationData es el objeto que almacenar la informaci n del app xml Previsiblemente habr solo uno aunque es posible generarlo manera din mica en algunas ventanas como en los formularios AppLevelData es el objeto que almacena la informacion de cada uno de los archivos xml A su vez y como cada archivo de datos xml puede tener un conjunto de datos demasiado complejos para almacenarse en un tipo simple es posible que sea necesario utilizar estructuras de datos complejas Para estos nuevos tipos de datos se utilizan los Dataltem P gina 14 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 2 Descripci n del Parser Cada uno de los parser est ubicado en la carpeta parser y lleva el nombre de la actividad Por ejemplo para la actividad FORM ACTIVITY existe un archivo EMOBC_HTML5_HOME parser form_activity php el cual ser el encargado de parsear el contenido de los archivos xml de la actividad del tipo FORM_ACTIVITY A continuaci n se muestra el c digo de la funci n traer_info que debe ser implementada en estos archivos para el caso de la actividad FORM_ACTIVITY function traer_info xml data if strrpos __ xml http sx simplexml_load_file xml jelse content file_get_contents xml sx simplexml_load_string content A as item if data item gt datald foreach item gt form as item2 actionUrl item2 gt actionUrl foreach item2 gt fie
10. 9 Ejemplo de la Pantalla de Lista con Image Esta pantalla muestra al usuario una imagen acompa ada por una lista Es parecida a la pantalla de lista Las caracter sticas de esta pantalla en concreto es que se va a mostrar una imagen en la parte inferior de la pantalla y que las celdas de la lista s lo van a poder contener texto y no pueden ir acompa adas por otra imagen 7 15 Pantalla de Multimedia Figura 20 Ejemplo de la Pantalla de Multimedia La Pantalla de Multimedia mostrada en la Figura 20 permite reproducir audio tanto local como externo La reproducci n de un archivo externo se produce en straming Es posible reproducir el audio mientras se descarga en segundo plano La ventana tambi n muestra informaci n y una imagen de la pista de audio Si se va a reproducir una canci n es posible a adir las letras para que aparezcan en la ventana mientras se reproducen Incluye un panel de controles b sico para la reproducci n de audio P gina 32 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 e Bot n Play Pause e Bot n Anterior e Bot n Siguiente 7 16 Pantalla de Calendario a Noviembre 2012 a Lu Ma Mi Ju Vi Sa Do 3 4 6 7 8 9 10 11 14 16 17 18 20 21 22 23 24 25 27 28 29 30 Figura 21 Ejemplo de la Pantalla de Calendario La ventana de calendario permite mostrar eventos en un calendario de aspecto mensual Cada evento tiene asociada una descripci n y puede lleva
11. Manual del Usuario Framework eMobc HTML5 Version 0 1 A as Y Ae Framework eMobc HTML5 Manual del Usuario Versi n 0 1 P gina 1 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 AVISO LEGAL License THE WORK AS DEFINED BELOW IS PROVIDED UNDER THE TERMS OF THIS CREATIVE COMMONS PUBLIC LICENSE CCPL OR LICENSE THE WORK IS PROTECTED BY COPYRIGHT AND OR OTHER APPLICABLE LAW ANY USE OF THE WORK OTHER THAN AS AUTHORIZED UNDER THIS LICENSE OR COPYRIGHT LAW IS PROHIBITED BY EXERCISING ANY RIGHTS TO THE WORK PROVIDED HERE YOU ACCEPT AND AGREE TO BE BOUND BY THE TERMS OF THIS LICENSE TO THE EXTENT THIS LICENSE MAY BE CONSIDERED TO BE A CONTRACT THE LICENSOR GRANTS YOU THE RIGHTS CONTAINED HERE IN CONSIDERATION OF YOUR ACCEPTANCE OF SUCH TERMS AND CONDITIONS 1 Definitions a Adaptation means a work based upon the Work or upon the Work and other pre existing works such as a translation adaptation derivative work arrangement of music or other alterations of a literary or artistic work or phonogram or performance and includes cinematographic adaptations or any other form in which the Work may be recast transformed or adapted including in any form recognizably derived from the original except that a work that constitutes a Collection will not be considered an Adaptation for the purpose of this License For the avoidance of doubt where the Work is a musical work performance or phonogram the
12. Manual del Usuario Framework eMobc HTML5 Version 0 1 function traer_info xml data La cual ser la encargada de parsear el archivo y generar las estructuras de datos definidas con anterioridad P gina 36 de 36
13. Para aumentar la flexibilidad el fichero app xml cuenta con una etiqueta llamada levelFormat que indica el estilo espec fico y nico para un level de la aplicaci n y que actua de igual forma que lo explicado en el punto anterior lt levelFormat gt lt backgroundFileName gt background png lt backgroundFileName gt lt components gt header default footer default lt components gt lt levelFormat gt P gina 23 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 7 Descripci n de Todos los Tipo de Actividades La Tabla 1 muestra todos los tipos de pantallas soportados por el Framework eMobc y su descripci n de funcionalidad Es la primera pantalla que se muestra de nuestra aplicaci n Se muestra Pantalla de Splash para indicar que la aplicaci n se est cargando Una vez que desaparece no se puede volver a ella Pantalla de Cover Es la pantalla portada En ella podemos mostrar a todas las opciones y acciones que nuestra aplicaci n puede soportar Pantalla de Galer a de Im genes Esta pantalla muestra una galer a de im genes al usuario Pantalla de PDF Esta pantalla muestra al usuario un lector de paf Pantalla QR Esta pantalla permite al usuario escanear mediante la c mara un c digo QR Pantalla de Explorador Web Esta pantalla muestra al usuario un contenedor Web donde poder visualizar contenido on line como p ginas Web o HTML locales Esta pantalla le muestra al usuario una lista donde Permi
14. Usuario Framework eMobc HTML5 Version 0 1 Actualmente estamos en el escenario en el que el usuario pulsa un boton de la portada que tiene asociado un Next Level a una ventana web que cargara un archivo html local archivo html En ese momento se busca el level en el app xml por la etiqueta lt nextLevelLevelld gt portada xml lt button gt lt buttonTitle gt Navegador lt buttonTitle gt lt buttonFileName gt images buttonw png lt buttonFileName gt lt nextLevel gt lt nextLevelLevelld gt web lt nextLevelLevelld gt lt nextLevelDatald gt web1 lt nextLevelDatald gt lt nextLevel gt lt button gt app xml lt levels gt lt web gt lt level gt lt levelId gt web lt levelId gt lt levelTitle gt Ventana Web lt levelTitle gt lt levelFile gt web xml lt levelFile gt lt levelType gt WEB_ACTIVITY lt levelType gt lt level gt lt levels gt El level al que se ha hecho referencia dentro del app xml tiene asociado un archivo xml de datos en el tag lt levelFile gt Se busca ese archivo y dentro de l aquellos datos a los que se hace referencia con el tag lt nextLevelDatald gt del archivo portada xml portada xml lt button gt lt buttonTitle gt Navegador lt buttonTitle gt lt buttonFileName gt images buttonw png lt buttonFileName gt lt nextLevel gt lt nextLevelLevelld gt web lt nextLevelLevelId gt lt nextLevelDatald gt web1 lt nextLevelDatald gt lt nextLev
15. Y const QR_ACTIVITY QR_ACTIVITY const FORM_ACTIVITY FORM_ACTIVITY const MAP_ACTIVITY MAP_ACTIVITY const PDF_ACTIVITY PDF_ACTIVITY const SOUND_ACTIVITY SOUND_ACTIVITY const CALENDAR_ACTIVITY CALENDAR_ACTIVITY const QUIZ_ACTIVITY QUIZ_ACTIVITY const AUDIO_ACTIVITY AUDIO_ACTIVITY const CANVAS_ACTIVITY CANVAS_ACTIVITY const CRUD_ACTIVITY CRUD_ACTIVITY const PROFILE_ACTIVITY PROFILE_ACTIVITY const SEARCH_ACTIVITY SEARCH_ACTIVITY Si queremos agregar un nuevo tipo de actividad debemos en primer lugar agregarla aqu 8 1 2 Paso 2 Crear y definir un xml Este archivo XML va a contener los datos para poder crear la ventana Sin embargo no tiene porqu ser igual a otros archivos XML Por ejemplo una ventana de galer a no necesita los mismos datos que una ventana de v deo Nuestra nueva ventana puede necesitar una estructura y datos concretos que la diferencian de las dem s Es necesario definir una nueva estructura para esta ventana 8 1 3 Paso 3 Crear datos de la aplicaci n Necesitaremos crear estructuras de datos para albergar los datos que hayamos definido en la etapa anterior 8 1 4 Paso 4 A adir parser Necesitaremos crear un parser siguiendo la convenci n de nombre definida anteriormente ej EMOBC_HTML5_HOME parser nombre_actividad php para proporcionar el parser de la aplicaci n Este archivo PHP deber contar con la funci n P gina 35 de 36
16. a Collection the Licensor offers to the recipient a license to the Work on the same terms and conditions as the license granted to You under this License b Each time You Distribute or Publicly Perform an Adaptation Licensor offers to the recipient a license to the original Work on the same terms and conditions as the license granted to You under this License c lf any provision of this License is invalid or unenforceable under applicable law it shall not affect the validity or enforceability of the remainder of the terms of this License and without further action by the parties to this agreement such provision shall be reformed to the minimum extent necessary to make such provision valid and enforceable d No term or provision of this License shall be deemed waived and no breach consented to unless such waiver or consent shall be in writing and signed by the party to be charged with such waiver or consent e This License constitutes the entire agreement between the parties with respect to the Work licensed here There are no understandings agreements or representations with respect to the Work not specified here Licensor shall not be bound by any additional provisions that may appear in any communication from You This License may not be modified without the mutual written agreement of the Licensor and You f The rights granted under and the subject matter referenced in this License were drafted utilizing the terminology of the Berne Convent
17. anas lt levelTitle gt Ventana Web lt levelTitle gt todas ellas de tipo contenedor web y tan solo tendr un lt levelFile gt web xml lt levelFile gt level declarado en su app xml lt levelType gt WEB_ACTIVITY lt levelType gt lt level gt Para diferenciar cada una de estas 3 ventanas entre s porque previsiblemente querremos que contengan diferente informaci n se utilizan los datos asociados al level definidos mediante el tag nextLevelDatald de la llamada al Next Level ver figura 1 1 4 2 Asociaci n de datos de los levels Para identificar cada level y sus datos se utilizan identificadores de tipo String Un level tiene un identificador nico y un archivo xml de datos asociado Cada vez que se quiere crear un Next Level se utiliza el identficador del level que est definido en el app xml y el identificador de los datos Cada vez que se llama a un Next Level desde la aplicaci n se consulta la informaci n del app xml por levelld y se leen los datos identificados por el tag nextLevelDatald dentro del archivo xml especficado en el tag levelFile Un archivo de datos xml puede tener varios datos dentro Cada uno tiene un identficador nico al que se puede hacer referencia en cada llamada a un Next Level A continuaci n se muestra un ejemplo para clarificar el funcionamiento de los levels y los datos asociados Continuando con el escenario anterior en el que se tienen tres ventanas de tipo contenedo
18. any credit as P gina 3 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 required by Section 4 d as requested If You create an Adaptation upon notice from any Licensor You must to the extent practicable remove from the Adaptation any credit as required by Section 4 d as requested b You may Distribute or Publicly Perform an Adaptation only under i the terms of this License ii a later version of this License with the same License Elements as this License iii a Creative Commons jurisdiction license either this or a later license version that contains the same License Elements as this License e g Attribution NonCommercial ShareAlike 3 0 US Applicable License You must include a copy of or the URI for Applicable License with every copy of each Adaptation You Distribute or Publicly Perform You may not offer or impose any terms on the Adaptation that restrict the terms of the Applicable License or the ability of the recipient of the Adaptation to exercise the rights granted to that recipient under the terms of the Applicable License You must keep intact all notices that refer to the Applicable License and to the disclaimer of warranties with every copy of the Work as included in the Adaptation You Distribute or Publicly Perform When You Distribute or Publicly Perform the Adaptation You may not impose any effective technological measures on the Adaptation that restrict the ability of a recipient of the Adaptation
19. bapps y Web mobile Figura 12 Ejemplo de la Pantalla de Explorador Web La ventana permite no solo cargar una direcci n web externa sino que puede cargar tambi n archivo html guardados localmente en el proyecto Adem s si quiere realizar una aplicaci n completamente remota con contenidos web puede utilizar esta ventana La carga de archivos html locales est pensada para mostrar f cilmente texto con formato Usted puede cargar cualquier html pero no se recomienda generar aplicaciones que basen su IU en archivos html ya que puede haber problemas en c mo se muestran los contenidos en diferentes tipos de pantallas 7 7 Pantalla de Lista Web Ejemplo 2 Galeria Foto Ejemplo 3 Figura 13 Ejemplo de la Pantalla de Lista La ventana de lista muestra una lista con im genes en cada elemento Cada elemento de la lista tiene asociado un Next Level y puede llevar a una nueva ventana Las im genes de los elementos de la lista pueden ser tanto locales como remotos P gina 28 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 Si las im genes son remotas su carga se realiza de manera as ncrona para agilizar el movimiento y desplazamiento de la lista 7 8 Pantalla de V deo Video Programacion de aplicaciones moviles emobc compartir Mas informacii N Figura 14 Ejemplo de Pantalla de Video La ventana de v deo permite reproducir v deo desde una url El v deo ocupa la pantalla completa sin in
20. cluir los men s de navegaci n y banners de publicidad 7 9 Pantalla de Mapa SER Viveiro Gij n ad Mapa Sat lite k M7 gero K mic Santandero Bilbao Donostia San lt gt F Suge Oviedo ki P S Bastian ae ld y Santi de J 4 men N 45 Le n Vitor Gasieiz 5A INE xy N Pamplona _ i Porteves a9 Ourense RA 4 Burgos dort 4 MA f SN NOA j gt ae Lleida 2 Sa Valladolid gt gt AA Salamanca YE IS Avi ln ys fg Y Espa a Valencia Spain angsar la j y E D nia Alacant 9 C rdoba gt Elx Murcia ci Ae ar Sevilla EY 2 Huelva HA Granada Y c agene e q f 4 A Osuna Pri fj Goole Jerez de S Pees SOO Datos dekmapax2012 GeoBads BORG 122009 Google Tele Atlas Condiciones del servicio Figura 15 Ejemplo de la Pantalla de Mapa La pantalla de Mapa muestra un mapa de unas coordenadas espec ficas por las que el usuario se puede mover para ver los alrededores a la posici n dada P gina 29 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 Adem s esta pantalla permite a adir marcas de sitios preferidos o lugares de inter s que se cargar n a la vez que se carga el mapa 7 10 Pantalla de B squeda Home Buscar Figura 16 Ejemplo de la Pantalla de B squeda La pantalla de B squeda permite buscar dentro del contenido de la aplicaci n presentando el resultado de la b squeda como una lista de las pantallas a visitar y
21. crear un nuevo tipo de ventana para el proyecto HTMLS ooooccccccoccnncncnocncnnncnnnnnnnos 36 ll Paso pode acuda di AA 36 5 1 2 24502 Crear y delia lid 36 Salo Raso se Crear datosde la aplicaci n iaa 36 LABS ATA il DAS ais ab ato dnt doler rcoceies 36 BN PASO AMA ACON a ctl ccneaY cae a E 36 Indice de tablas Tabla 1 Tipos de Pantallas Soportadas por CMODC cc eeessssssssseeeececceeeceeeeeeeaaaasaesesssseeeeeeeeeeeeees 29 Indice de Figuras Pretra l Esquema General de e Mba Ana 9 Figura 2 Secuencia de Ejecuci n de una aplicaci n eMObC oooooooooccnnnnnnnnnnononananonanononononnnnnnnnnnnnnnnos 10 Figura 3 Flujo de generaci n de una aplicaci n eMObC ooonnnnnnncncnnnnncnononennnnnonnnnnonennnnnnnnnnnnnnninaninnns 14 Figura Rotaci nes de la Apical On 2 A AA AO 17 Preura Se Menus TOp Y BOU Meira iia dico 18 Pieu Toode Minis 19 Figura 7 Context Melina onae a E O S 19 Fig ra Tamano delos Me ii A A o ieoi 20 Figura Ejemplo dela Pantalla de COVO nto id 25 Figura 10 Ejemplo de la Pantalla de Galer a de Im genes oooooooooooooccncnnnoccnononnnnnnonnnnonononnnnnnnnnnnnnnnos 26 Pigura l1 Ejemplo dela Pantalla de PDE unica 27 Figura 12 Ejemplo de la Pantalla de Explorador Web oooooooocoooooooooccccnononcccccnononanonnnonnononnnnonnnnnnnnnnnnos 28 Fisuta 13 Ejemplo dela Pantallide Lista 29 Fisura 14Ejemplo de Pamalla de Vide dad 29 Fig ra 15 Ejemplo dela Pantalla de Mapas ai la EE 30 Figura 16 Ejemplo de
22. de Galeria de Imagenes localhost emobc html5 assets road jpg Figura 10 Ejemplo de la Pantalla de Galeria de Imagenes La galeria de imagenes se utiliza para mostrar un un conjunto de imagenes seleccionadas en una sola ventana El usuario puede desplazarse entre las imagenes para verlas Pagina 26 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 7 4 Pantalla de PDF e CY localhost Figura 11 Ejemplo de la Pantalla de PDF La ventana de pdf esta pensada para mostrar documentos externos principalmente de archivos pdf en la aplicacion Para documentos externos la ventana utiliza Google Docs para mostrar el contenido Ademas de pdf es posible utilizar otros formatos de archivos compatibles con Google Docs La herramienta de Google Docs permite descargar el archivo para tenerlo localmente y abrirlo con la aplicacion por defecto de lectura de archivos pdf que tenga el usuario instalada en su movil 7 5 Pantalla QR La pantalla QR es aquella que permite al usuario escanear c digos QR Esta opci n s lo esta disponible en las versiones nativas del Framework Android e OS por lo tanto en HTML5 parecer un mensaje avisando que este tipo de pantallas no est disponible P gina 27 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 7 6 Pantalla de Explorador Web Contenedor Web A wa r a Y Framework opensource para generar aplicaciones nativas en IOS y Android We
23. de existir alguno de esos tipos de Menu P gina 19 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 Label Figura 8 Tama o de los Menu En cambio los tipos de men Side Menu y Context Menu al ser emergentes no influyen en la reestructuraci n de los componentes de la pantalla Adem s si alguno de estos men s esta desplegado si el bot n back del sistema es pulsado su contenido volver a ocultarse 5 2 Como definir los tipos de Men Cada tipo de men tiene su propio archivo xml por tanto al existir 4 tipos distintos de men existir n tambien 4 ficheros xml destinados Todos tienen la misma estructura com n lt menuActions gt lt action gt lt actionTitle gt lt actionTitle gt lt actionlmageName gt lt actionlmageName gt lt systemAction gt lt systemAction gt lt leftiMargin gt lt leftMargin gt lt widthButton gt lt widthButton gt lt heightButton gt lt heightButton gt lt nextLevel gt lt nextLevell evelld gt lt nextLevelLevelld gt lt nextLevelDatald gt lt nextLevelDatald gt lt nextLevel gt lt action gt lt menuActions gt Existe una etiqueta global llamada menuActions que engloba toda y cada una de las distintas acciones con sus correspondientes caracteristicas Una acci n action no es m s que la definici n para un bot n del men es decir es un campo nico para cada bot n donde se almacenan los datos tanto
24. de presentaci n como de funcionalidad P gina 20 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 e actionTitle nombre de la acci n del men e actionlmageName nombre de la imagen que presentar ella acci n del men e systemAction opci n que define si la acci n es o no una acci n del sistema Las acciones de sistema son e back acci n del sistema para dirigirse a la pantalla anterior e home acci n del sistema para dirigirse al EntryPoint e tts acci n del sistema para presentar un Text to Search e search acci n del sistema para presentar un Search e share acci n del sistema para presentar un Share e map acci n del sistema para presentar un Map e leftMargin define los margenes entre las opciones del men e widthButton define el ancho del bot n de la acci n e heightButton define el alto del bot n de la acci n e nextLevel opci n que define la pantalla a la que se dirigir la aplicaci n al pulsar la opci n del men Teniendo en cuenta esta serie de par metros hay que tener en cuenta un factor importante Cada acci n del men puede o ser una acci n de sistema o abren una nueva activity nunca las dos cosas debido a que las propias acciones del sistema abren tambi n nuevas activities Visto en un ejemplo Acci n de Sistema Back lt menuActions gt lt action gt lt action Title gt Accio
25. el gt lt button gt web xml lt levelData gt lt data gt lt datald gt web1 lt datald gt lt headerImageFile gt images web png lt headerImageFile gt lt headerText gt Ventana Web lt headerText gt lt local gt true lt local gt lt webUrl gt archivo html lt webUrl gt lt data gt lt data gt lt datald gt web2 lt datald gt lt headerImageFile gt images web png lt headerImageFile gt lt headerText gt Ventana Web lt headerText gt lt local gt false lt local gt lt webUrl gt www google es lt webUrl gt lt data gt lt levelData gt app xml lt levels gt lt web gt lt level gt lt levelId gt web lt levelId gt lt levelTitle gt Ventana Web lt levelTitle gt lt levelFile gt web xml lt levelFile gt lt levelType gt WwEB ACTIVITY lt levelType gt lt level gt lt levels gt Pagina 13 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 La segunda ventana cargar la direcci n web http www google es dentro del contenedor web Hay que incluir en el archivo que define la portada portada xml otro bot n para que cargue los datos de la nueva ventana De esta manera cada vez que se pulse el segundo bot n se acceder al mismo archivo de datos xml web xml pero al nuevo identficar de datos que ahora contendr la informaci n para que se cargue google Lu portada xml lt button gt lt buttonTitle gt Navegador lt buttonT
26. finir la rotaci n por defecto both Nota La versi n HTML5 de eMobc NO soporta rotaciones P gina 17 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 5 Funcionamiento de los Men s 5 1 Los men s en la aplicaci n La aplicaci n cuenta con un sistema de men s para ofrecer acciones directas en cualquier pantalla Existen 4 tipos distintos de men s e Top Menu Es un tipo de men fijo que se posiciona en la parte superior de la pantalla Ver Figura 5 e Bottom Menu Es un tipo de men fijo que se posiciona en la parte inferior de la pantalla Ver Figura 5 e Side Menu Es un tipo de men emergente que aparece por un lateral de la pantalla que ofrece una lista de opciones Ver Figura 6 e Context Menu Es un tipo de men emergente que aparece al pulsar el boton MENU del sistema Ver Figura 7 TOP MENU BOTTOM MENU Figura 5 Men s Top y Bottom P gina 18 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 SIDE MENU gt O opl New Contact op2 Search Preferences Figura 6 Side Menu Figura 7 Context Menu Los tipos de menu Top Menu y Bottom Menu son los nicos con propiedad fija esto quiere decir que si est n definidos aparecer n fijos en pantalla reestructurando el resto de componentes de la pantalla Esos componentes est n en un contenedor llamado contentLayout que es precisamente el que reestructura la pantalla en caso
27. ights Nothing in this License is intended to reduce limit or restrict any uses free from copyright or rights arising from limitations or exceptions that are provided for in connection with the copyright protection under copyright law or other applicable laws 3 License Grant Subject to the terms and conditions of this License Licensor hereby grants You a worldwide royalty free non exclusive perpetual for the duration of the applicable copyright license to exercise the rights in the Work as stated below a to Reproduce the Work to incorporate the Work into one or more Collections and to Reproduce the Work as incorporated in the Collections b to create and Reproduce Adaptations provided that any such Adaptation including any translation in any medium takes reasonable steps to clearly label demarcate or otherwise identify that changes were made to the original Work For example a translation could be marked The original work was translated from English to Spanish or a modification could indicate The original work has been modfied c to Distribute and Publicly Perform the Work including as incorporated in Collections and d to Distribute and Publicly Perform Adaptations The above rights may be exercised in all media and formats whether now known or hereafter devised The above rights include the right to make such modfications as are technically necessary to exercise the rights in other media and formats Subject to Section 8 f
28. igura 2 Secuencia de Ejecuci n de una aplicaci n eMobc P gina 10 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 1 4 Level 1 4 1 Estructura de las aplicaciones Las aplicaciones que genera el framework se estrucutran en base a Levels niveles Un level es un tipo de ventana que tiene la aplicaci n Por esa raz n se incluyen todos los levels de una aplicaci n en el app xml 1 4 1 1 NextLevel Cuando en una ventana tiene un bot n y al pulsarlo tiene asociado un enlace a una nueva ventana Portada xml decimos que tiene un NextLevel asociado a la acci n lt button gt de pulsar el bot n lt buttonTitle gt Navegador lt buttonTitle gt lt buttonFileName gt images buttonw png lt buttonFileName gt Un Next Level es el level que se crear cuando se lt nextLevel gt realiza una acci n Para definir un Next Level es lt nextLevelLevelId gt web lt nextLevelLevelId gt necesario tanto el level que queremos crear como los e eo a datos asociados a l que la aplicaci n tendr que ia cargar lt button gt 1 4 1 2 Diferencia entre level y ventana Un level no es una de todas las pantallas que tendr la aplicaci n Si una aplicaci n tiene tres tipos de ventana lt levels gt diferentes por ejemplo calendario lista con im genes y a a ia z os lt Leve L gt lector pdf tendr tres levels definidos en su app xml Sin AA A embargo otra aplicaci n puede tener en total 3 vent
29. ion for the Protection of Literary and Artistic Works as amended on September 28 1979 the Rome Convention of 1961 the WIPO Copyright Treaty of 1996 the WIPO Performances and Phonograms Treaty of 1996 and the Universal Copyright Convention as revised on July 24 1971 These rights and subject matter take effect in the relevant jurisdiction in which the License terms are sought to be enforced according to the corresponding provisions of the implementation of those treaty provisions in the applicable national law If the standard suite of rights granted under applicable copyright law includes additional rights not granted under this License such additional rights are deemed to be included in the License this License is not intended to restrict the license of any rights under applicable law P gina 6 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 Indice de contenidos Indice de contenido AVIDO CECA nerean en te rset rene ene teri Meer on sas e Meese errr eee 2 E E ais oo E E anu E E E 2 Tice le Comat PP bpitea bdo A aed goalie tpitaae eee 7 Descripcion ena a ia 9 ME A acticin Saino ANE O I EA E OA 9 LACO SF INCXI LGV Bun ol 9 13 Funcionamiento de AAP IN CACIO I A a a a 10 E ea eee EN T E ANEA EEA A S ee E 11 4d Estructura delas PUC o ds Elo 11 iS o eo 11 41 2 Diferencia ente level Ventana ia 11 14 2 ASOCIACION de datos delos level nd ii 11 SAplcatondData y APppLevecliDatar aida lia 14 DES CAPO de Past 15 3 F
30. ir generando la aplicacion a partir de la informacion recopilada El c digo necesario para ejecutar la aplicaci n ya est disponible en los proyectos base Tan solo es necesario a adir los archivos xml y compilar el proyecto para obtener una aplicaci n funcional 1 1 App xml El archivo xml principal es el app xml Ver aplication data Toda la informaci n general que se aplica a la aplicaci n est en este archivo como el tipo de publicidad las rotaciones soportadas los men s de navegaci n ver men s o el Entry Point ver Entry Point El EntryPoint b sicamente es la pantalla que se mostrar en primer lugar por defecto ser la portada 1 2 Levels y NextLevels Los XML definen tanto la aplicaci n en general app xml como cada una de sus pantallas Estas pantallas est n estructuras en el framework como levels Un level es una ventana de la aplicaci n Es de un tipo concreto y tiene unos datos asociados Todos los levels que contiene una aplicaci n estar n definidos en su app xml lt levels gt lt web gt Las acciones dentro de las pantallas de la aplicaci n como lt level gt pulsar un bot n o una imagen pueden tener asociados un lt level Id gt web lt level Id gt Next Level Un Next Level es la pr xima ventana que se lt levelTitle gt Ventana Web lt levelTitle gt mostrar cuando el usuario realice la acci n a la que est lt levelFile gt web xml lt levelFile gt asociado ver Levels lt levelTy
31. itle gt lt buttonFileName gt images buttonw png lt buttonFileName gt lt nextLevel gt lt nextLevelLevelId gt web lt nextLevelLevelld gt lt nextLevelDatald gt web1 lt nextLevelDatald gt lt nextLevel gt lt button gt lt button gt lt buttonTitle gt Navegador lt buttonTitle gt lt buttonFileName gt images buttonw png lt buttonFileName gt lt nextLevel gt lt nextLevelLevelId gt web lt nextLevelLevelld gt lt nextLevelDatald gt web2 lt nextLevelDatald gt lt nextLevel gt lt button gt 1 5 AplicationData y AppLevelData Hasta ahora hemos visto que para consultar levels y sus archivos de datos xml se accede al app xml Esto no es del todo cierto Cuando se necesita acceder a los datos contenidos en un archivo xml primero se parsea el archivo y se transforma en en un objeto que al que luego se puede acceder mediante c digo E Panel de control i PHP Parser Dataltem java Figura 3 Flujo de generaci n de una aplicaci n eMobc Aplication Como puede verse en la figura 2 los XML los genera el panel de control pero la aplicaci n en s no accede a ellos Necesita un objeto que almacene esa informaci n y al que se pueda acceder desde c digo Aunque realmente el parser es parte de la aplicaci n trabaja como una entidad independiente y cuando es necesario genera estos objetos que la aplicaci n utilizar para construir las ventanas Ver parser Aqu es donde entran en juego los AplicationData
32. ld as item3 fieldType item3 gt fieldType fieldLabel item3 gt fieldLabel fieldNamel item3 gt fieldName fieldParam item3 gt fieldParam nextLevelLevelld item gt nextLevel gt nextLevelLevelld nextLevelDatald item gt nextLevel gt nextLevelDatald total 0 nextLevelLevelld total 1 SnextLevelDatald total 2 SactionUrl total 3 fieldType total 4 fieldLabel total 5 fieldName total 6 fieldParam return total Pagina 15 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 3 Funcionamiento del EntryPoint 3 1 Descripci n El EntryPoint es la pantalla que se carga por primera vez al iniciar la aplicaci n despu s de la pantalla SplashActivity Es posible pensar que exista una pantalla de inicio fija que es al fin y al cabo una portada y que sea la misma para todas las aplicaciones Pero en ocasiones el usuario necesita contar con una portada predefinida o que inicie la aplicaci n en una pantalla en concreto El EntryPoint es el principal encargado de ste cometido La funci n principal es especificar el levelld y el datald de la pantalla que se quiere iniciar que como ya se explico antes corresponde a una pantalla especifica La forma de establecer dicha informaci n se define en el fichero app xml concretamente en el campo entryPoint lt entryPoint gt lt pointLevelld gt lt pointLevelld gt lt pointDatald
33. le of the Work if supplied iii to the extent reasonably practicable the URI if any that Licensor specifies to be associated with the Work unless such URI does not refer to the copyright notice or licensing information for the Work and iv consistent with Section 3 b in the case of an Adaptation a credit identifying the use of the Work in the Adaptation e g French translation of the Work by Original Author or Screenplay based on original Work by Original Author The credit required by this Section 4 d may be implemented in any reasonable manner provided however that in the case of a Adaptation or Collection at a minimum such credit will appear if a credit for all contributing authors of the Adaptation or Collection appears then as part of these credits and in a manner at least as prominent as the credits for the other contributing authors For the avoidance of doubt You may only use the credit required by this Section for the purpose of attribution in the manner set out above and by exercising Your rights under this License You may not implicitly or explicitly assert or imply any connection with sponsorship or endorsement by the Original Author Licensor and or Attribution Parties as appropriate of You or Your use of the Work without the separate express prior written permission of the Original Author Licensor and or Attribution Parties e For the avoidance of doubt Non waivable Compulsory License Schemes In those ju
34. men s a la aplicaci n Una vez se han definido los distintos tipos de men hay que asignar a la aplicaci n los men s que se quieren activar Ese proceso se centra en el fichero app xml lt menu gt lt topMenu gt lt topMenu gt lt bottomMenu gt lt bottomMenu gt lt contextMenu gt lt contextMenu gt lt sideMenu gt lt sideMenu gt lt menu gt Simplemente menu es un campo en el que se pueden definir si est n o no activos los men s explicados anteriormente En cada una de las 4 etiquetas se asigna el nombre del fichero xml que define un men Si no se quiere aplicar alg n men hay que dejar la etiqueta vac a Visto en un ejemplo lt menu gt lt topMenu gt menu1 xml lt topMenu gt lt bottomMenu gt lt bottomMenu gt lt contextMenu gt menu2 xml lt contextMenu gt lt sideMenu gt menu2 xml lt sideMenu gt lt menu gt Esta definici n asigna las caracter sticas explicadas anteriormente e Las pantallas tendr n un men superior con las caracter sticas especificadas en el fichero menu1 xml e Las pantallas no contaran con ning n men inferior e Las pantallas tendr n un men contextual con las caracter sticas especficadas en el fichero menuz xml e Las pantallas tendr n un men lateral con las caracter sticas especificadas en el fichero menu2 xml P gina 22 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 6 Temas y Estilos
35. n1 lt actionTitle gt lt actionlmageName gt img1 png lt actionlmageName gt lt systemAction gt back lt systemAction gt lt leftMargin gt 20 lt leftMargin gt lt widthButton gt 40 lt widthButton gt lt heightButton gt 40 lt heightButton gt lt nextLevel gt lt nextLevelLevelld gt lt nextLevelLevelld gt lt nextLevelDatald gt lt nextLevelDatald gt lt nextLevel gt lt action gt lt menuActions gt Acci n normal Abrir nueva ventana lt menuActions gt lt action gt lt actionTitle gt Accion2 lt actionTitle gt lt actionlmageName gt img2 png lt actionlmageName gt lt systemAction gt lt systemAction gt lt leftMargin gt 20 lt leftMargin gt lt widthButton gt 40 lt widthButton gt lt heightButton gt 40 lt heightButton gt lt nextLevel gt lt nextLevelLevelld gt level_1 lt nextLevelLevelld gt lt nextLevelDatald gt data_1_1 lt nextLevelDatald gt lt nextLevel gt lt action gt lt menuActions gt Se observa por tanto que Pagina 21 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 e Siel campo systemAction est vac o el campo nextLevel toma los valores de una pantalla especifica e Si el campo systemAction tiene valor v lido el campo nextLevel est vac o En el caso de que se introduzca alg n dato desconocido por ejemplo un systemAction no definido la acci n simplemente no tendr ninguna funci n 5 3 Adici n de
36. nte quiera mostrar Pantalla de Quiz Permite generar tests con varias respuestas y muestra los resultados Tambi n permite generar aventuras interactivas con varios finales que dependen de las decisiones tomadas a lo largo de las preguntas P gina 24 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 Tabla 1 Tipos de Pantallas Soportadas por eMobc A continuacion se describe cada una de esta pantallas con mayor nivel de detalle 7 1 Pantalla de Splash 7 2 Pantalla de Cover Navegacion Menus Contenidos Formularios Utilidades Calendario Figura 9 Ejemplo de la Pantalla de Cover La ventana de portada esta disenada para ser la primera ventana de la aplicacion Habitualmente muestra una lista de botones con acciones b sicas en la aplicaci n o enlaces a otras ventanas secundarias La ventana de portada b sica se compone de una imagen de cabecera y unos botones con Next Level a otras ventanas de la aplicaci n B sicamente es el punto de partida desde donde el usuario puede acceder a todas las funciones de la aplicaci n Es importante saber que toda aplicaci n tiene que disponer de la Actividad de portada Es posible modificar la ventana inicial de la aplicaci n mediante la funci n entry point ver entry point pero la actividad de portada es la que se encarga de gestionarlo ver m s adelante SplashActivity P gina 25 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 7 3 Pantalla
37. pe gt WEB_ACTIVITY lt levelType gt lt level gt P gina 9 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 1 3 Funcionamiento de la aplicaci n El funcionamiento de una aplicaci n construida con el framework se basa principalmente en parseado de los archivos XML que definen la aplicaci n El primer archivo que se parsea es app xml Se generar n todos los datos de la aplicaci n Una vez la portada o el entry point sea visible cada acci n del usuario puede llevar a nuevas ventanas Next Level o a salir de la aplicaci n Cuando se realiza una acci n que tiene asociado un NextLevel la aplicaci n busca el archivo de datos xml asociado a ese NextLevel y lo parsea para recuperar la informaci n y crear la pantalla que se va a mostrar Ver Levels Conviene diferenciar tanto en Android como en OS la creaci n de la aplicaci n desde el panel de control del funcionamiento El panel de control es el que genera los archivos xml y el proyecto en Android e OS es el que va construyendo a partir de esos xml la aplicaci n en tiempo de ejecuci n Creaci n de la apliaci n Panel de Control Definici n de la aplicaci n a Generaci n de archivos XML Ejecuci n y funcionamiento Parseado de app xml Parseado del xml de datos de la ventana Generaci n de Datos de la aplicaci n Generaci n de Dataltem correspondiente 3 Mostrar ventana EntryPoint Mostrar portada Mostrar ventana NextLevel F
38. que contienen el resultado de la b squeda 7 11 Pantalla Formulario Nombre del cliente Nombre del proyecto Descripcion del proyecto Plataforma IOS Telefono Figura 17 Ejemplo de la Pantalla de Formulario La ventana de formulario se utiliza para mostrar formularios con campos para que el usuario los pueda rellenar Los campos que se mostrar n son previamente definidos por el xml y se crear n en tiempo de ejecuci n Incluye la funcionalidad de crear aplicaciones din micamente al pulsar el bot n de aceptar Puede utilizarse para P gina 30 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 mostrar diferentes pantallas seg n los datos introducidos por el usuario 7 12 Pantalla Imagen Texto molestie sodales tempus blandit elementum sit amet est Donec rutrum elementum urna non fringilla tortor facilisis vitae Nulla nisl risus dictum sagittis ullamcorper id scelerisque ut libero Donec scelerisque sagittis metus at tristique massa ultrices vel Etiam nulla mauris auctor vel mollis eget consectetur in quam Suspendisse potenti Ut at lorem ac turpis fermentum laoreet In elementum venenatis arcu id eleifend leo consequat in Aenean porttitor pulvinar dui nec convallis lectus ij non Sed quis dui non felis cursus dignissim Curabitur blandit gravida eratlwec sagittis Integer porttitor libero vitae diam aliquet eget tempor nunc hendrerit Aenean condimentum ornare eros eget mollis Nam ut metus
39. r a una nueva ventana En el calendario se indican los eventos con colores en los d as de la semana e Azul Indica que existen eventos en el d a e C rculo rojo Indica el d a actual Cuando se pulse un d a del calendario se mostrar n los eventos si los hay en la tabla de eventos Es posible cambiar el mes para visualizar los posibles eventos en otros meses pr ximos y pasados P gina 33 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 7 17 Pantalla de Quiz Quiz Este es un quiz de prueba Las preguntas tienen diferente peso seg n su dificultad El quiz tiene un peso total de 9 que en los resultados ser an 9000 puntos Seg n las respuestas podr s conseguir de O a 9000 puntos Pregunta 3 Qu aeropuerto es el que aparece en la imagen Barajas Sevilla Barcelona Figura 22 Ejemplo de la Pantalla de Quiz La ventana de quiz permite mostrar al usuario un cuestionario con una pregunta una imagen opcional y unas respuestas Una vez finalizado el quiz se mostrar n los resultados en una nueva ventana seg n los pesos de las preguntas y las respuestas que se hayan contestado La funci n Quiz dispone varias pantallas e Pantalla Inicial Muestra una descripci n del quiz Es la pantalla de preparaci n para inicial el quiz e Pantalla de preguntas Muestra las preguntas y respuestas hasta que no existan mas e Pantalla de resultados Muestra los resultados despu s de haber completado el q
40. r science a performance a broadcast a phonogram a compilation of data to the extent it is protected as a copyrightable work or a work performed by a variety or circus performer to the extent it is not otherwise considered a literary or artistic work h You means an individual or entity exercising rights under this License who has not previously violated the terms of this License with respect to the Work or who has received express permission from the Licensor to exercise rights under this License despite a previous violation Publicly Perform means to perform public recitations of the Work and to communicate to the public those public recitations by any means or process including by wire or wireless means or public digital performances to make available to the public Works in such a way that members of the public may access these Works from a place and at a place individually chosen by them to perform the Work to the public by any means or process and the communication to the public of the performances of the Work including by public digital performance to broadcast and rebroadcast the Work by any means including signs sounds or images Reproduce means to make copies of the Work by any means including without limitation by sound or visual recordings and the right of fixation and reproducing fixations of the Work including storage of a protected performance or phonogram in digital form or other electronic medium 2 Fair Dealing R
41. r web vamos a ver c mo se referencian entre s los tags y los archivos xml P gina 11 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 Primero se presentar n c mo son nuestros archivos xml y qu signfica cada tag dentro de ellos Este es un fragmento de portada xml Es la definici n de una ventana de portada que tiene entre otras cosas un boton de titulo Navegador con un Next Level asociado a una ventana de contenedor web La etiqueta lt nextLevelLevelld gt tiene el identificador del level al que se ira si se pulsa el boton La etiqueta lt nextLevelDatald gt tiene el identficador de los datos que el level debe cargar cuando se cree Este es un fragmento del archivo app xml donde se declaran los levels de nuestra aplicaci n Como solo tendr ventanas de tipo web solo aparece un level La etiqueta lt levelld gt contiene el identficador del level La etiqueta lt levelFile gt contiene el archivo xml que almacena los datos del level La etiqueta lt levelType gt contiene el tipo de ventana que corresponde al level en este caso web Este es un fragmento del archivo de datos del level web Por simplicidad se ha reducido el n mero de ventanas web de tres a dos La etiqueta lt datald gt contiene el identficador de los datos dentro del archivo xml de datos La etiqueta lt local gt establece si hay que buscar una direcci n en la web o en un archivo local La etiqueta lt webUrl gt con
42. risdictions in which the right to collect royalties through any statutory or compulsory licensing scheme cannot be waived the Licensor reserves the exclusive right to collect such royalties for any exercise by You of the rights granted under this License ll Waivable Compulsory License Schemes In those jurisdictions in which the right to collect royalties through any statutory or compulsory licensing scheme can be waived the Licensor reserves the exclusive right to collect such royalties for any exercise by You of the rights granted under this License if Your exercise of such rights is for a purpose or use which is otherwise than noncommercial as permitted under Section 4 c and otherwise waives the right to collect royalties through any statutory or compulsory licensing scheme and lli Voluntary License Schemes The Licensor reserves the right to collect royalties whether individually or in the event that the Licensor is a member of a collecting society that administers Pagina 4 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 voluntary licensing schemes via that society from any exercise by You of the rights granted under this License that is for a purpose or use which is otherwise than noncommercial as permitted under Section A c f Except as otherwise agreed in writing by the Licensor or as may be otherwise permitted by applicable law if You Reproduce Distribute or Publicly Perform the Work either by itself or as pa
43. rt of any Adaptations or Collections You must not distort mutilate modify or take other derogatory action in relation to the Work which would be prejudicial to the Original Author s honor or reputation Licensor agrees that in those jurisdictions e g Japan in which any exercise of the right granted in Section 3 b of this License the right to make Adaptations would be deemed to be a distortion mutilation modification or other derogatory action prejudicial to the Original Author s honor and reputation the Licensor will waive or not assert as appropriate this Section to the fullest extent permitted by the applicable national law to enable You to reasonably exercise Your right under Section 3 b of this License right to make Adaptations but not otherwise 5 Representations Warranties and Disclaimer UNLESS OTHERWISE MUTUALLY AGREED TO BY THE PARTIES IN WRITING AND TO THE FULLEST EXTENT PERMITTED BY APPLICABLE LAW LICENSOR OFFERS THE WORK AS IS AND MAKES NO REPRESENTATIONS OR WARRANTIES OF ANY KIND CONCERNING THE WORK EXPRESS IMPLIED STATUTORY OR OTHERWISE INCLUDING WITHOUT LIMITATION WARRANTIES OF TITLE MERCHANTABILITY FITNESS FOR A PARTICULAR PURPOSE NONINFRINGEMENT OR THE ABSENCE OF LATENT OR OTHER DEFECTS ACCURACY OR THE PRESENCE OF ABSENCE OF ERRORS WHETHER OR NOT DISCOVERABLE SOME JURISDICTIONS DO NOT ALLOW THE EXCLUSION OF IMPLIED WARRANTIES SO THIS EXCLUSION MAY NOT APPLY TO YOU 6 Limitation on Liability EXCEPT TO
44. stema cerrar la aplicaci n si el bot n atr s del sistema es pulsado 3 3 Su funcionamiento El funcionamiento de la pantalla de EntryPoint se basa nicamente en el paso de par metros Concretamente en una variable booleana que pasa como extra desde los m todos showNextLevel P gina 16 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 4 Funcionamiento de las Rotaciones Las rotaciones existen para aportar mas dinamismo o comodidad a la hora de utilizar una aplicaci n Hay tipos de pantallas que requieren una mejor vista de sus componentes y es por ello por lo que se ofrece un sistema de rotaciones personalizado Hay que tener en cuenta que rotar una pantalla es simplemente una reestructuraci n de los componentes por tanto ni su n mero ni su funcionamiento var a al rotar la pantalla _ LANDSCAPE Figura 4 Rotaciones de la Aplicaci n Las rotaciones se aplican para todas las pantallas de la aplicaci n Por tanto su propiedad se ver definida en el fichero app xml lt rotation gt lt rotation gt Los valores que puede tomar dicho campo son e portrait La pantalla se torna en modo vertical e landscape La pantalla se torna en modo horizontal e both Se toman valores del aceler metro del dispositivo m vil Por tanto la pantalla se torna en modo vertical u horizontal dependiendo de la orientaci n Si se insertase un valor desconocido o vac o la aplicaci n de
45. synchronization of the Work in timed relation with a moving image synching will be considered an Adaptation for the purpose of this License b Collection means a collection of literary or artistic works such as encyclopedias and anthologies or performances phonograms or broadcasts or other works or subject matter other than works listed in Section 1 g below which by reason of the selection and arrangement of their contents constitute intellectual creations in which the Work is included in its entirety in unmodified form along with one or more other contributions each constituting separate and independent works in themselves which together are assembled into a collective whole A work that constitutes a Collection will not be considered an Adaptation as defined above for the purposes of this License c Distribute means to make available to the public the original and copies of the Work or Adaptation as appropriate through sale or other transfer of ownership d License Elements means the following high level license attributes as selected by Licensor and indicated in the title of this License Attribution Noncommercial ShareAlike e Licensor means the individual individuals entity or entities that offer s the Work under the terms of this License f Original Author means in the case of a literary or artistic work the individual individuals entity or entities who created the Work or if no individual or entity can be
46. te seleccionar entre las opciones que muestra Contamos con varios formatos de la misma pantalla e Lista s lo con texto e Lista con im gen junto al texto Pantalla de Video Esta pantalla permite al usuario visualizar un video El video puede estar en el propio dispositivo o puede ser on line Pantalla de Mapa Esta pantalla muestra al usuario un mapa dependiendo de su localizaci n El mapa puede contener marcas de sitios preferidos que el usuario puede a adir Pantalla de B squeda Esta pantalla permite al usuario buscar una porci n de texto georeferencia o imagen dentro del framework Pantalla Formulario Esta pantalla permite al usuario crear una nueva pantalla simplemente rellenando los campos necesarios Pantalla Imagen Texto Esta pantalla muestra al usuario una Imagen acompa ado por un texto Pantalla de Imagen con Zoom Esta pantalla permite mostrar al usuario una imagen aumentada Pantalla de Imagen Lista Esta pantalla nos muestra una lista seleccionable por el usuario acompa ada por una imagen ajena a las celdas Pantalla de Multimedia Esta pantalla permite mostrar al usuario un men para acceder a las acciones multimedia como pueden ser Acceso a Fotos Acci n de Compartir Acceso a Videos Acceso a grabaciones de Voz etc Pantalla de Lista Pantalla de Calendario Esta pantalla muestra al usuario un calendario ajeno al calendario del sistema Este calendario muestra los eventos que la aplicaci n intername
47. tiene la direcci n web o el archivo html local que cargar el contenedor web Para m s informaci n de los tags de los archivos xml consulta Archivos xml Una vez explicados todos archivos xml que van a intervenir en el ejemplo se mostrar n las interacciones entre ellos portada xml lt button gt lt buttonTitle gt Navegador lt buttonTitle gt lt buttonFileName gt images buttonw png lt buttonFileName gt lt nextLevel gt lt nextLevelLevelId gt web lt nextLevelLevelId gt lt nextLevelDatald gt web1 lt nextLevelDatald gt lt nextLevel gt lt button gt app xml lt levels gt lt web gt lt level gt lt levelId gt web lt levelId gt lt levelTitle gt Ventana Web lt levelTitle gt lt levelFile gt web xml lt levelFile gt lt levelType gt WEB_ACTIVITY lt levelType gt lt level gt lt levels gt web xml lt levelData gt lt data gt lt datald gt web1 lt datald gt lt headerImageFile gt images web png lt headerImageFile gt lt headerText gt Ventana Web lt headerText gt lt local gt true lt local gt lt webUrl gt archivo html lt webUrl gt lt data gt lt data gt lt datald gt web2 lt datald gt lt headerImageFile gt images web png lt headerImageFile gt lt headerText gt Ventana Web lt headerText gt lt local gt false lt local gt lt webUrl gt www google es lt webUrl gt lt data gt lt levelData gt Pagina 12 de 36 Manual del
48. uiz Adem s de los un cuestionario tradicional la funci n Quiz puede ser utilizada para crear aventuras Una aventura es un quiz en el cual cada respuesta tiene definida una nueva pregunta De esta manera se pueden crear aventuras interactivas en las que el resultado final depende de las decisiones tomadas a lo largo del quiz P gina 34 de 36 Manual del Usuario Framework eMobc HTML5 Version 0 1 8 Gu a de programaci n 8 1 C mo crear un nuevo tipo de ventana para el proyecto HTML5 El siguiente documento es una gu a de programaci n para crear un nuevo tipo de ventana Muestra en detalle los archivos y m todos que hay que modficar para conseguir que el framework trabaje con el nuevo tipo de ventana apoy ndose en un ejemplo concreto ventana de calendario Puede consultar tambi n la gu a r pida nuevo tipo de ventana 8 1 1 Paso 1 Tipo de actividad La nueva ventana tiene su propio tipo de Activity Los tipos de activity se definen la clase ActivityType abstract class Activity Type const COVER_ACTIVITY COVER_ACTIVITY const BUTTONS ACTIVITY BUTTONS_ACTIVITY const IMAGE_TEXT_DESCRIPTION_ACTIVITY IMAGE_TEXT_DESCRIPTION_ACTIVITY const IMAGE_LIST_ACTIVITY IMAGE_LIST_ACTIVITY const LIST_ACTIVITY LIST_ACTIVITY const VIDEO_ACTIVITY VIDEO_ACTIVITY const IMAGE_ZOOM_ACTIVITY IMAGE_ZOOM_ACTIVITY const IMAGE_GALLERY_ACTIVITY IMAGE_GALLERY_ACTIVITY const WEB_ACTIVITY WEB_ACTIVIT
49. uncionamiento del EntryPolDt occcccccnnnnnnnnnnnnnnnonnnnnnnnnnnnnonnnnnnnnnonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnanannns 16 DAD o A aiuceceemeeten sual uaeucaeeaaane acu soautauteusuntuaeeueieces 16 ras AA E E hii edua ina de E ali Sa daaien etal 16 PORNON EO A ha cieeaneseeno oi sad sen daewarnslocesateemeeterae 16 A Puncionamiento de las ROtICIONES aeoiee 17 S Funcionamiento delos MEUS A E TEE ERS 18 Del NOs menus En Ia aP UCAC lOD isine i E iii beans 18 32 Como definir los tipos de Medi 20 DS Adiccion de menus laa UCA CON SD AE 22 TTA AST SUI OS nemira a E ee tala OA E E E ZS CAProcedimionto Senerare ann ta o e dt aul eae acs 23 7 Descripci n de Todos los Tipo de ActIVIdAdES occccccccnnnooonncccnnnonnnnnnnononoconnnnnononononncnnnnnnnnnnnnnnnoss 24 Tea Pantalla de plastos 25 TP ANN AACS ONG Ee deters eer cree onc E PO gash sete a oo aah aresen see a aa see a aA 25 7 Pantala de Galeria de lina genes ada 26 SP Pe AAAS ED Sgt asia nua ia ando 2 O AAA AT E A 27 TO rantal lane Explorador Webs 28 EA ttre dura e di aa dla deren lh ean 28 Tes Ba tala de VID ii 29 T9 Batalla de INA Ae toe AS 29 TAO Pantalla de BUSQUE ii 30 AU AA 31 7 12 Pantalla lina Sie VCXO as 31 TAS Pa tallarde IMmaser con LOMA ii 32 TIA O is id 32 A a AAA A A 33 ELIO Pantalla de Calendario A AA A Ai 34 117 Pantala de QUIZO 35 Guia de PLO STAAL ON q coa 36 P gina 7 de 36 Manual del Usuario Framework eMobc HTML5 Versi n 0 1 8 1 C mo
Download Pdf Manuals
Related Search