Icono y pantalla de bienvenida con todas las resoluciones

El objetivo

Como habremos observado, PhoneGap Build utiliza un icono por defecto al compilar nuestras aplicaciones. En este ejercicio vamos a ver cómo podemos cambiar el icono de nuestra aplicación de lista de tareas fácilmente y sin necesidad de instalar ningún software adicional en nuestros equipos. Además, también veremos cómo añadir una pantalla de bienvenida, lo que sin duda le dará un toque más profesional a nuestra aplicación.

El icono nos servirá para distinguir claramente cuál es nuestra app de entre todas las instaladas en el móvil, pudiendo elegir una imagen cualquiera que podemos descargar de Internet, o también diseñándola nosotros mismos.

La pantalla de bienvenida se visualizará al arrancar la aplicación, y permanecerá unos segundos, mientras el móvil carga nuestra app, o incluso se puede prorrogar el tiempo que nosotros decidamos.

Por ejemplo, yo he buscado un par de imágenes etiquetadas para reutilización, y he escogido las siguientes como icono y pantalla de bienvenida respectivamente:

Cómo generar las imágenes con las resoluciones necesarias

Para que nuestra app cumpla los requisitos necesarios para su distribución, necesitaremos generar diversas imágenes con resoluciones específicas que sean adecuadas para diversos dispositivos, tal como especifican Google y Apple.

Más adelante veremos cómo la herramienta de consola de IONIC nos permitirá genera los archivos necesarios automáticamente partiendo de nuestras imágenes elegidas como icono y pantalla de bienvenida. Sin embargo, para ello deberemos instalar dicha utilidad previamente.

De momento utilizaremos alguna web que nos permite subir nuestras imágenes y nos generará automáticamente todos los archivos necesarios que debemos incluir, sin necesidad de instalar nada en nuestros ordenadores.

Podemos encontrar por ejemplo las siguientes (en orden de preferencia según mi criterio):

  1. PhoneGap / Cordova Resource Generator
  2. Abiro PhoneGap Image Generator
  3. Ape Tools – Image Gorilla

En mi caso he utilizado el primer enlace. Basta con subir las dos imágenes en el apartado de Input -> Logo / Icon e Input -> Splashscreen, y al pulsar el botón Upload files, la web ya nos genera todos los archivos necesarios, que se pueden descargar pulsando el botón Download your files.  Además, a la derecha veremos las líneas necesarias que debemos añadir al fichero config.xml:

El archivo config.xml

Deberemos incluir las secciones específicas en nuestro archivo config.xml para que PhoneGap Build pueda reconocer y enlazar todos los archivos generados. Además, deberemos añadir una línea con <plugin name="cordova-plugin-splashscreen" /> para poder utilizar el plugin para mostrar la pantalla de bienvenida:

<?xml version="1.0" encoding="UTF-8" ?>
<widget xmlns   = "http://www.w3.org/ns/widgets"
    ...
    <plugin name="cordova-plugin-splashscreen" />
    ...

    <platform name="android">
        <icon qualifier="ldpi" src="res/icons/android/drawable-ldpi-icon.png" />
        ...
        <splash qualifier="land-ldpi" src="res/screens/android/drawable-land-ldpi-screen.png" />
        ...
    </platform>  
</widget>

Como podemos observar, respecto a las imágenes a utilizar sólo he incluido la sección correspondiente a Android, ya que de momento no voy a compilar para IOS:

<platform name="android">
   ...
</platform>

Además, se puede configurar el tiempo que permanece mostrándose la pantalla de bienvenida. El valor por defecto es de tres segundos. Con la siguiente línea lo establecemos a cinco segundos para que la podamos ver un poco mejor:

<preference name="SplashScreenDelay" value="5000" />

También debemos tener en cuenta que por defecto, la pantalla de bienvenida sólo se mostrará cuando se abra la aplicación, no cuando se encuentre en segundo plano y pase a estar activa. Una vez se haya ejecutado la app, para volver a visualizar la imagen de nuevo, deberemos cerrar la aplicación por completo y volverla a abrir.

En las páginas oficiales de Cordova podemos obtener toda la documentación:

En resumen, el contenido del archivo config.xml podría ser el siguiente:

<?xml version="1.0" encoding="UTF-8" ?>
<widget xmlns   = "http://www.w3.org/ns/widgets"
    xmlns:gap   = "http://phonegap.com/ns/1.0"
    id          = "com.fernandoruizrico.todo"
    versionCode = "1"
    version     = "0.0.1" >

    <name>ToDo!</name>

    <description>
        ToDo List.
    </description>

    <author href="https://fernandoruizrico.com" email="[email protected]">
        Fernando Ruiz Rico
    </author>

    <access origin="*" />
    <plugin name="cordova-plugin-whitelist" />
    <plugin name="cordova-plugin-vibration" />
    <plugin name="cordova-plugin-splashscreen" />

    <preference name="SplashScreenDelay" value="5000" />

    <platform name="android">
        <icon qualifier="ldpi" src="res/icons/android/drawable-ldpi-icon.png" />
        <icon qualifier="mdpi" src="res/icons/android/drawable-mdpi-icon.png" />
        <icon qualifier="hdpi" src="res/icons/android/drawable-hdpi-icon.png" />
        <icon qualifier="xhdpi" src="res/icons/android/drawable-xhdpi-icon.png" />
        <icon qualifier="xxhdpi" src="res/icons/android/drawable-xxhdpi-icon.png" />
        <icon qualifier="xxxhdpi" src="res/icons/android/drawable-xxxhdpi-icon.png" />
        <splash qualifier="land-ldpi" src="res/screens/android/drawable-land-ldpi-screen.png" />
        <splash qualifier="land-mdpi" src="res/screens/android/drawable-land-mdpi-screen.png" />
        <splash qualifier="land-hdpi" src="res/screens/android/drawable-land-hdpi-screen.png" />
        <splash qualifier="land-xhdpi" src="res/screens/android/drawable-land-xhdpi-screen.png" />
        <splash qualifier="land-xxhdpi" src="res/screens/android/drawable-land-xxhdpi-screen.png" />
        <splash qualifier="land-xxxhdpi" src="res/screens/android/drawable-land-xxxhdpi-screen.png" />
        <splash qualifier="port-ldpi" src="res/screens/android/drawable-port-ldpi-screen.png" />
        <splash qualifier="port-mdpi" src="res/screens/android/drawable-port-mdpi-screen.png" />
        <splash qualifier="port-hdpi" src="res/screens/android/drawable-port-hdpi-screen.png" />
        <splash qualifier="port-xhdpi" src="res/screens/android/drawable-port-xhdpi-screen.png" />
        <splash qualifier="port-xxhdpi" src="res/screens/android/drawable-port-xxhdpi-screen.png" />
        <splash qualifier="port-xxxhdpi" src="res/screens/android/drawable-port-xxxhdpi-screen.png" />
    </platform>  
</widget>

El archivo ZIP

Si utilizamos la web https://www.resource-generator.com, nos generará un archivo ZIP que contendrá los siguientes ficheros:

De ahí deberemos copiar la carpeta res e incluirla en nuestro archivo ZIP, junto con el fichero config.xml modificado que subiremos a PhoneGap Build:

El resultado

Desde los siguientes enlaces se pueden descargar todos los archivos utilizados en este ejemplo:

La pandilla digital y el profesor analógico

Una aventura inspirada en un futuro que ya es presente

Varios compañeros de clase se encuentran inmersos en un mundo controlado por las nuevas tecnologías y viven ajenos a muchas de las posibilidades que les ofrece el mundo real.

Un antes y un después

Los protagonistas compartirán una emotiva aventura en la que descubrirán una serie de experiencias completamente nuevas para ellos. Nos cuentan en primera persona cómo se desenvuelven en su vida actual, y veremos cómo poco a poco, gracias a sus profesores y familiares, van cambiando su escala de valores. A través de cosas tan simples como una mera conversación, una sonrisa de sus abuelos, un cielo lleno de estrellas, o una ráfaga de aire fresco, irán descubriendo una realidad que permanecía oculta para ellos.

Amistad y familia

Acompaña a nuestros personajes en un relato que fomenta el respeto, la cooperación, el autocontrol y la responsabilidad, para descubrir finalmente el verdadero valor de la amistad y la familia.

Cuentos para ser compartidos

Diez emotivos relatos que harán las delicias de pequeños y mayores

Cuentos infantiles escritos en un lenguaje adaptado a los niños que consigue emocionar a los adultos. Tratan temas diversos tales como las relaciones entre padres, hijos y hermanos, la motivación por la lectura, la práctica de deportes, los beneficios del reciclaje, las diferentes etapas de la vida, y la importancia de tener siempre una actitud positiva.

Sumérgete en estas entrañables historias que ensalzan el valor de la amistad y la familia, fomentando el respeto, la cooperación, la perseverancia, el autocontrol y la responsabilidad

Nuestros protagonistas nos ofrecen su visión del mundo que nos rodea, desde un punto de vista muy tierno y espontáneo. Comparte con ellos situaciones inspiradas en hechos reales a través de unos cuentos escritos para los más pequeños, pero recomendados para todas las edades:

  • El pirata: Una simple caja de cartón puede resultar un juguete maravilloso, y si juegas con tu hermano, cualquier momento se puede convertir en una fantástica aventura.
  • El mejor momento del día: Puedes compartir un maravilloso momento con tus padres mientras disfrutas al mismo tiempo de una buena lectura.
  • La competición de karate: La práctica de las artes marciales aporta a los niños educación y disciplina. Son un deporte muy acertado si queremos que nuestros hijos se mantengan en forma, y adquieran también respeto hacia los demás y confianza en sí mismos.
  • El aspirador reciclador: Es muy importante que los más pequeños de la casa aprendan a recoger su habitación.
  • La pantalla en blanco: Los cuentos de buenas noches son un momento ideal para compartir con nuestros hijos.
  • Para que jueguen los niños: A veces es difícil encontrar esos consejos que tanta falta hacen cuando estás dejando de ser niño y te estás haciendo mayor.
  • Libros de papel: ¿Qué nos deparará el futuro? Es importante no dejarnos arrastrar por los grandes avances tecnológicos.
  • Los ingredientes secretos: La simpatía y la amabilidad pueden resultar esenciales cuando tratas con los demás.
  • Campamento motivador: ¿Qué quieres ser de mayor? Nuestros profesores nos pueden ayudar a encontrar la respuesta a esa pregunta.
  • El músico: Si te gusta la música, no dejes pasar los años. Siempre puedes encontrar tiempo libre para tus aficiones.

Si te ha gustado este libro, no puedes perderte…

Disfruta de más de veinte conmovedores relatos en: Cuentos para ser escuchados y Cuentos para ser recordados.

Todos los beneficios son para Alianza española de familias de VHL

Comprando el libro aportamos un granito de arena para ayudar a la asociación de enfermos de von Hippel-Lindau (alianzavhl.org). Por ello, no sólo pretendemos regalar ilusión a quien lo lea, sino a todos aquellos enfermos y familiares que están esperando que les echemos una mano, ya que todos los beneficios de la venta del libro van destinados íntegramente a ellos.

Cuentos para ser escuchados

Doce emotivos relatos para potenciar la capacidad de superación

Cuentos infantiles educativos que tratan por un lado temas cotidianos tales como la sostenibilidad del medio en el que vivimos y los beneficios del trabajo en equipo, y por otro lado abordan temas sensibles tales como la pobreza, los complejos, la discapacidad y las enfermedades raras, para que los más pequeños crezcan acostumbrados a la diversidad y no les dé miedo lo diferente.

Conmovedoras historias que ensalzan el valor de la amistad y la familia

Nos ofrecen un punto de vista entrañable y espontáneo ante diversas situaciones inspiradas en hechos reales a las que se enfrentan nuestros protagonistas, utilizando un lenguaje adaptado a los niños que consigue emocionar a los adultos.

  • El médico que no creía en los besitos. Conoceremos a un médico que sólo receta inyecciones y medicinas. ¿Conseguirá curar a todos los pacientes que pasan por su consulta? En este emotivo relato nos meteremos en la piel de un niño que tiene miedo a los pinchazos y que además tal vez necesite un tratamiento especial.
  • Tú me dictas y yo escribo. En clase siempre hemos tenido compañeros y compañeras con diferentes destrezas, y el trabajo en grupo nos permite hacer tareas que no podríamos llevar a cabo nosotros solos. Descubre las fantásticas habilidades que desarrollan dos amigas cuando se ponen a trabajar juntas.
  • Para que coman los gatos. Un punto de vista diferente para entender los motivos que nos mueven a los adultos a tomar ciertas decisiones.
  • Mi almuerzo. El protagonista se olvida un día el almuerzo en casa, y su profesora y compañeros le enseñarán lo bonito que puede llegar a ser el mero hecho de compartir algo.
  • El cuentacuentos. La evolución de las nuevas tecnologías podría llegar a conducirnos a un futuro en el que no todo es mejor que antes. ¿Dónde está el límite en el uso de los teléfonos móviles?
  • Las hadas de las profesiones. ¿Alguna vez te han dicho que tienes la cabeza llena de pájaros? ¿Alguna vez has querido ser inventor?
  • Déjalo como está. La acumulación de basura puede llegar a convertirse en un gran problema.
  • No te entiendo. ¿Podemos hablar sin palabras? ¿Podemos entendernos sin hablar? De nuevo será un niño quien nos enseñe lo fácil que puede resultar llegar a entablar conversación con alguien aunque parezca que no nos escucha.
  • Grrrrrrrrrr. ¿Quién está gruñendo? ¿Es el ruido del viento? ¿Es un animal peligroso?. Esta historia te pondrá los pelos de punta…
  • Leo, mi mejor amigo. Una conmovedora historia dedicada a esos amigos incondicionales que siempre están a nuestro lado, pase lo que pase, sin pedir nunca nada a cambio.
  • La princesa y el viajero. A veces encuentras tu destino en el camino menos esperado… pero hay que ser muy perseverante y seguir caminando hasta que encuentres lo que estás buscando.
  • La contraseña. Un fantástico reto que conducirá al protagonista a resolver diversos acertijos con ayuda de sus padres.

Disponible en inglés y en francés

Puedes leer todos los cuentos también en inglés (Tales to find a cure), y en francés (Des contes pour être écoutés).

Segundo y tercer libro de cuentos ya a la venta

Disfruta de otros veinte emotivos relatos en: Cuentos para ser compartidos y Cuentos para ser recordados.

Todos los beneficios son para Alianza española de familias de VHL

Comprando el libro además ponemos un granito de arena para ayudar a la asociación de enfermos de von Hippel-Lindau (alianzavhl.org). Por ello, no sólo pretendemos regalar ilusión a quien lea el libro, sino a todos aquellos enfermos y familiares que están esperando que les echemos una mano, ya que todos los beneficios de la venta del libro van destinados íntegramente a ellos.