He implementado una aplicación bastante simple, basandome en la documentacion, (de hecho, me he basado en la aplicación por defecto de Cordova y sólo le he modificado el contenido de los parrafos en el apartado visual, el elemento importante de este ejercicio era el manejo de Javascript). El ejercicio consiste en hacer que aparezcan mensajes de alerta cuando se pulsa la tecla de retroceso o de menú de un dispositivo móvil, mostrando un mensaje en el que se indica qué botón se ha pulsado:
<!DOCTYPE html>
<html>
<head>
<title>Ejemplos de manejador de eventos Apache Cordova</title>
<link rel="stylesheet" type="text/css" href="css/index.css" />
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
// Esperar a que carguen las librerias API del dispositivo
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
// Las APIs del dispositivo estan disponibles
//
function onDeviceReady() {
// Escuchadores de eventos
document.addEventListener("backbutton", onBackKeyDown, false);
document.addEventListener("menubutton", onMenuKeyDown, false);
}
// acciones
function onBackKeyDown() {
alert("retroceso");
}
function onMenuKeyDown() {
alert("menu");
}
</script>
</head>
<body onload="onLoad()">
<div class="app">
<h1>Manejador de Eventos</h1>
<div id="deviceready" class="blink">
<p class="event listening">Cargando...</p>
<p class="event received">LISTO!!!</p>
<p>Pulsa los botones de tu dispositivo para ver los mensajes de dialogo</p>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
En un principio quise hacerlo con el plugin de dialogos de Cordova, pero por ahora no me ha funcionado, seguiré investigando, ya que queda mucho más elegante y profesional que escribir un triste alert.
He aquí un video mostrando en ejecución el código anteriormente expuesto. A partir de aquí, iremos investigando, probando e implementando ejemplos de todos los diferentes tipos de eventos.
No hay comentarios:
Publicar un comentario