Abridor de puerta de garaje eléctrica Imp (7 / 11 paso)

Paso 7: La aplicación de HTML – detalles de configuración

La aplicación que se ejecuta en el iPhone es una página web que es una combinación de HTML, CSS y Javascript. Para obtener la página web parecen ser un nativo iOS de la aplicación, existen etiquetas meta son entendidos por el navegador Safari que ocultan la barra de navegación en la parte superior de la pantalla y la barra de botones en la parte inferior. Para obtener la aplicación sin ser cargado desde un servidor web, puede almacenar la página en el teléfono. Esto significa que puede cargar la página desde un servidor web temporal en el teléfono y luego se apagará el servidor web para que nadie más puede acceder a la aplicación. Una vez que ha sido en caché la página a tu teléfono, Safari se no hacer solicitudes HTTP de la página cuando se abre a cargar directamente desde la memoria caché local y mostrarla como una aplicación nativa. Las etiquetas que controlan el formato de visualización son:

• Punto de visión

Define cómo se mostrará la Página Web y debe establecer como se muestra según las directrices de Apple. Usted necesitará asegurarse de que los botones y las imágenes son bastante grandes porque el usuario no será capaz de ampliar la página.

• Apple-móvil-web-app-capaz

Esta etiqueta hace que la página web en modo de pantalla completa. Se ocultan las barras de navegación del navegador

• Apple-Mobile-Web-App-Status-Bar-Style

Muestra una barra de estado negra en la parte superior del teléfono. Menos molesto supongo.

Este es el comienzo del archivo HTML con las etiquetas meta definido
< html manifest="manifest.appcache" >
< head >
< meta charset = "utf-8" / >
< nombre de meta "viewport" contenido = "escala inicial = 1.0, escalable por el usuario = no" / >
< nombre de meta = "apple-móvil-web-app-capaz" content = "yes" / >
< meta name="apple-mobile-web-app-status-bar-style" contenido = "negro" / >

Icono de la aplicación
Para hacer un icono de la aplicación, es necesario crear una imagen png de 114 x 114 píxeles. iOS se encargará de redondear las esquinas y aplicar el "brillo".

Memoria caché
Finalmente para almacenar en caché de la aplicación, necesita un archivo de manifiesto. Asegúrese de que el servidor web sirve el archivo de manifiesto con el tipo MIME "texto/cache-manifest" para esto a trabajar. IIS Express, es editar el archivo application.config para agregar el tipo de archivo. Para otros servidores – su kilometraje puede variar.
La App HTML se carga con la última versión cargada de la imagen y archivos de caché HTML. Si existe conectividad de red, el navegador comprobará el estado del archivo de manifiesto en el servidor. Si ha cambiado el archivo de manifiesto, se cargarán los archivos nuevos. Esto es útil durante el desarrollo cuando se actualizan los archivos, puede cambiar el número de versión en el archivo de manifiesto para forzar nuevos archivos para ser cargados y almacenados en caché. Sin embargo, a veces tienes que borrar manualmente la caché para obtener archivos de nuevo a la carga. Algo que sucede que tienes que ser consciente de. También encontré más fácil durante la depuración para eliminar la declaración manifiesta. Una vez que el archivo que se está depurando, se puede trabajar con la versión de caché.

El archivo de manifiesto tiene dos secciones: archivos que se almacenará en caché y archivos que se cargan desde la red. Para esta aplicación, todos los archivos en caché y deje en blanco la sección de red.

MANIFIESTO DE LA CACHÉ

#version 3.3

MEMORIA CACHÉ:

index.html
imágenes/hitchhikeguidetogalaxy0.png
imágenes/hitchhikeguidetogalaxy1.png
imágenes/hitchhikeguidetogalaxy2.png
imágenes/hitchhikeguidetogalaxy3.png
images/garage_icon.png

RED:

El número de versión es un disparador para el navegador web para cargar nuevas versiones del archivo.  He encontrado una entrada en el blog bueno que cubre esta en http://matt.might.net/articles/how-to-native-iphone-ipad-apps-in-javascript/ si necesita más información acerca de HTML aplicaciones en el iPhone.