Idea para crear splash de publicidad en iOS con PhoneGap

Estamos empezando un proyecto de aplicaciones con PhoneGap de Adobe, es un framework gratuito para hacer aplicaciones móviles -aquí más info- por lo que iremos escribiendo pequeñas ideas y trozos de código que podrían ayudar a otros proyectos.

Algo que me viene rondando desde hace tiempo, es como hacer un splash con publicidad, es decir... en un proyecto de iOS estableces las imágenes que va a cargar la aplicación al ejecutarse, la mayoría de aplicaciones pues así funcionan... se lanza una "portada" y luego se muestra el contenido.

¿Que tal si ocupamos mostrar otra pantalla con digamos, publicidad, después de la carga de la aplicación y antes de mostrar el contenido?

Como vamos a trabajar con HTML y JavaScript, algo tendremos que hacer. Buscando información, me encontré con esta página "iOS PhoneGap / Cordova – Splash screen control" que indica como configurar iOS para que no esconda el splash una vez cargada la aplicación y para hacerlo en ejecución. Partiendo de allí y haciendo los cambios que indican, vamos a hacer una función como esta:

function laConfig() {
   //verificar que se tiene internet...
   $.post(url,{config:1},function(m) {
      //cargamos el splash
      if(m.splash) {
         var img = $("<img / >").attr('src',m.splash)
            .load(function() {
            if (!this.complete) {
               cordova.exec(null, null, "SplashScreen", "hide", []);
            } else {
               $(".splash").show().append(img);
               setTimeout(quitaSplash,1000*m.time);
            }
          });
         }
      },'json');
   // quitamos el splash, por default
   cordova.exec(null, null, "SplashScreen", "hide", []);
}

Donde, mando llamar a un url previamente definido, que me regresa un objeto JSON con dos parámetros: url de la publicidad (imagen) y tiempo en mostrarse.

Es una idea básica pero eso hace que mientras está cargando mi aplicación, se mantiene el splash en pantalla, voy y obtengo el url de la publicidad (puede ser una imagen que llene inclusive toda la pantalla), la cargo y muestro. Luego llamo a una función llamada quitaSplash() que manda el método hide() a mi publicidad para que la desaparezca.

... esa es la idea.

Aquí puedes ver las fotos del post

Almacenado en Apple, iOS, PhoneGap, PhoneGap

por Jorge Martínez Mauricio :)



¿Algo que comentar?


Suscríbete por correo electrónico, recibirás los nuevos escritos antes que nadie y es gratis 😊

¿Ya conoces los foros de tar?

Relacionadas

    tar.mx es un blog sobre tecnología y otras chunches