PhoneGap Construir un lector de feeds - Configuración

Esta es la tercera y última parte de la serie sobre Audero Feed Reader. En este artículo, aprenderá cómo crear el archivo de configuración y completar el proyecto que comenzamos en una lección anterior..


1. Acabando la aplicación

Un diseño mejor sensible

En la primera parte de esta serie escribí sobre la importancia de la datos-iconpos atributo para los enlaces en el encabezado y el pie de página. En esta sección, aprenderá acerca de por qué los usamos. Lo estoy usando, con un poco de JavaScript, para crear un mejor efecto de respuesta. Lo uso para ocultar el texto de los enlaces donde se aplica. El propósito de esto es ahorrar espacio, lo cual es importante, especialmente para pantallas más pequeñas. Pero, ¿qué pasa si la pantalla es lo suficientemente grande, digamos de más de 480 píxeles, para mostrar el texto? Para esto, escucharemos la pagebeforecte evento, y adjuntar un controlador, el updateIcons () método de la Solicitud Clase, para reaccionar una vez que se dispara. Como lo indican los nombres, el evento se activa antes de que la página y sus widgets se inicialicen. Nuestro manejador, primero probará si la página es más grande que 480px y, si es así, eliminará datos-iconpos atributo, por lo que se mostrará el texto del enlace.

El código que implementa este método es el siguiente:

 updateIcons: function () var $ buttons = $ ('a [icono de datos], botón [icono de datos]'); var isMobileWidth = ($ (window) .width () <= 480); isMobileWidth ? $buttons.attr('data-iconpos', 'notext') : $buttons.removeAttr('data-iconpos'); 

2. Construir configuración

El servicio Adobe PhoneGap Build le permite especificar los metadatos de su proyecto con un archivo de configuración llamado config.xml. Sigue la especificación del widget W3C y debe permanecer dentro de la raíz de la aplicación, en el mismo nivel de index.html. La primera línea es la declaración XML y la raíz del documento es una Etiqueta que tiene varios atributos disponibles. Los más importantes son. carné de identidad, el identificador único de la aplicación, y versión, que especifica la versión de la aplicación. Dentro de etiqueta, puedes escribir los metadatos.

Si ha seguido el tutorial hasta el momento, recordará que cuando inicializamos la aplicación usando el PhoneGap CLI, creó un archivo de configuración por defecto. La configuración generada especifica demasiados ajustes para cada plataforma en comparación con nuestras necesidades. De hecho, usaremos varias configuraciones, pero como se trata de un tutorial, nos centraremos en algunas plataformas. Sin embargo, usted es absolutamente libre de expandirse para adaptarse a sus necesidades individuales.

En el archivo de configuración, tenemos:

  • Nombre (requerido): Este es el nombre de la aplicación. No tiene que ser único..
  • Descripción (requerido): Texto que especifica para qué es tu aplicación. Esto es muy importante porque aparecerá como la descripción de su aplicación en los mercados..
  • Autor (opcional): El autor de la aplicación. Tiene dos propiedades opcionales: href, una URL para la página de inicio del desarrollador o de la empresa, y correo electrónico, la dirección de correo electrónico del desarrollador o la empresa. Desafortunadamente, solo puede especificar un autor, por lo que no puede tener detalles de varios autores aquí.
  • Icono (opcional): este será el ícono que se mostrará en los dispositivos que instalan su aplicación. Si no se especifica, se utilizará el logotipo de Cordova..
  • Chapoteo (opcional): establece la pantalla de inicio de la aplicación, esta es la imagen que se muestra durante la carga.
  • Preferencia (opcional): un conjunto de preferencias que desea aplicar a su aplicación. Es una etiqueta cerrada y puedes tener cero o más Etiquetas dentro del archivo. Tiene dos atributos y ambos son obligatorios. nombre y valor. Hay varias preferencias que puedes definir, pero la más importante de usar en mi opinión es la versión de Cordova..
  • Acceso (opcional): le brinda a su aplicación acceso a recursos en otros dominios, en particular, le permite a su aplicación cargar páginas de dominios externos que pueden ocupar toda su vista web. Tenga en cuenta lo que expliqué anteriormente en la sección titulada "El complemento InAppBrowser": para abrir los enlaces externos en Cordova WebView, debe agregarlos a la lista blanca de aplicaciones. Para mayor brevedad, permitiremos cualquier recurso externo utilizando el * personaje especial.
  • Gap: plugin (opcional): especifica las funciones que desea utilizar. Por ejemplo, Android antes de instalar cualquier aplicación, muestra al usuario los permisos que necesita y, si el usuario acepta, continúa..

Si ha leído detenidamente la lista anterior y ha usado PhoneGap en el pasado, probablemente notó la introducción, en la versión 3.0.0, de una nueva configuración llamada brecha: plugin. Este último ha sustituido al característica ajuste pero, aparte del nombre, el concepto es exactamente el mismo.

Ahora que he notado los puntos clave del formato, puede comprender la fuente del archivo de configuración de nuestro proyecto. Sin embargo, si desea leer más sobre este tema, eche un vistazo a la página de documentación oficial. El archivo completo está abajo..

   Audero Feed Reader  Audero Feed Reader es un agregador de feeds muy básico para guardar en un solo lugar todas las noticias y los artículos que le interesan..   Aurelio de rosa                               

3. Habilitar la aplicación para ejecutar

En este punto hemos llegado al final de esta serie. Su propósito ha sido demostrar cómo podemos iniciar la aplicación de forma segura con todos los archivos que hemos creado hasta ahora. Nuestros controladores y métodos pueden ejecutarse de manera segura una vez que Cordova esté completamente cargado, asegurándose de que puede llamar a las API de Cordova. Pero espera ... ¿Cuándo está listo Córdoba? Me alegra que hayas preguntado! El marco proporciona un evento llamado deviceready que puedes escuchar Dado que, en el index.html archivo (el punto de entrada de la aplicación), escucharemos el evento y adjuntaremos como controlador nuestro initApplication () método de la Solicitud clase. Se ejecutará una vez que se dispare el evento..

El código que implementa esto se muestra a continuación..

 

4. Construir y probar la aplicación

Nuestra aplicación ahora está completa. Todo lo que queda por hacer es construirlo y probarlo en un emulador o en un dispositivo real. Para crear la aplicación, tiene dos posibilidades: su computadora o el servicio en la nube de Adobe, llamado Adobe PhoneGap Build. Recuerde que si desea utilizar su computadora, debe instalar el SDK para cada plataforma que desee apuntar. los PhoneGap CLI tiene un comando para construir la aplicación (construir), para probarlo (instalar), y realizar ambas tareas (correr). Entonces, digamos que quieres construir y probar Audero Feed Reader en Android, tienes que escribir el siguiente comando:

phonegap ejecutar android

Tenga en cuenta que si tiene un dispositivo Android conectado y configurado correctamente en la computadora, la aplicación se ejecutará en él de manera predeterminada. De lo contrario, se ejecutará en el emulador SDK..

En caso de que quiera usar Adobe PhoneGap Build para generar los archivos instalables, también puede usar la CLI, simplemente usando la remoto comando como se muestra a continuación:

Phonegap Remote Build Android

Tenga en cuenta que dado que el entorno de compilación remoto no tiene un emulador, el instalar y correr comandos simplemente generan un código QR en el PhoneGap Build interfaz. Además, para utilizar el servicio necesita tener una cuenta de Adobe. Esto significa que (desafortunadamente) usted no poder utilizar las credenciales de GitHub.


Conclusión

Como ha visto a lo largo de esta serie, crear un Feed Reader puede ser muy fácil gracias a marcos como jQuery Mobile y Cordova, y a algunas API como la API de Google Feed. Espero que hayas disfrutado de este tutorial y, si deseas mejorar aún más el proyecto, considera agregar algunas funciones que crees que me perdí y utilízalo en tus propios dispositivos móviles..