Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para...

116

Transcript of Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para...

Page 1: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,
Page 2: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,
Page 3: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

Editorial Universidad Manuela Beltrán

Programación Avanzada para Dispositivos Móviles

2018

Page 4: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,
Page 5: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

Programación Avanzada para Dispositivos Móviles

Autores

Yamil Buenaño Palacios

Carlos Augusto Sánchez Martelo

Henry Leonardo Avendaño Delgado

Manuel Antonio Sierra Rodríguez

Carlos Andrés Collazos Morales

Domingo Alirio Montaño Arias

Breed Yeet Alfonso Corredor

José Daniel Rodríguez Munca

Page 6: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,
Page 7: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

Edición

Editorial Universidad Manuela Beltrán

Autores

Yamil Buenaño Palacios

Dr. (c) en Ingeniería de las

Ciencias de la Información y el

Conocimiento, Magíster en

Ingeniería de Software para la

Web, Esp. En Construcción de

Software para la Web,

Ingeniero de Sistemas, Gerente

General de Softwarecom.

Carlos Augusto Sanchez

Martelo

Dr. (c) en Pensamiento

Complejo, Maestría en Diseño,

Gestión y Dirección de

Proyectos, Ingeniero de

sistemas, Certificado

Internacionalmente en ITIL Foundation v3,

Procesos en Desarrollo de Software y TIC

Henry Leonardo Avendaño

Delgado

Dr. (c) en Educación línea de

investigación Tecnologías de

la Información y

Comunicación para la

inclusión, Magister en

Educación, Especialista en Gerencia de

Telecomunicaciones, Ingeniero Electrónico.

Manuel Antonio Sierra

Rodríguez

Dr. (c) en Proyectos en la línea

de investigación en

Tecnologías de la Información

y Comunicación, Magíster en

Software Libre, Especialista en

Seguridad en Redes, Ingeniero de Sistemas,

Consultor en Seguridad de la Información y

Comunicaciones.

Domingo Alirio Montaño Arias

Dr. En Genética, Magister en

Biología, Biólogo, Investigador

Asociado, Universidad Manuela

Beltrán, BSc, MSc, PhD

Intereses de investigación en

Neurociencias, Genética y TIC

Aplicadas a la Educación.

Miembro comité editorial revista Journal of

Science Educations. Miembro fundador de la

Sociedad Iberoamericana de Biología Evolutiva.

Carlos Andres Collazos

Morales

Postdoctorado en Ciencia y

Tecnología Avanzada, Dr. en

Ciencias, Magister en

Ingeniería Electrónica y

Computadores, Físico.

Breed Yeet Alfonso Corredor

Dr. (c) en Proyectos, Magister

en Educación, Especialista en

Desarrollo e Implementación

de Herramientas Telemáticas,

Ingeniera Electrónica,

Directora Académica y

Calidad, Consultora Nacional e Internacional

Académica de Educación Superior.

José Daniel Rodríguez Munca

Magister en Ciencias de la

Educación, Master en

Estrategias y Tecnologías

para el Desarrollo,

Especialista en docencia

mediada por las TIC e

Ingeniero Electrónico.

Daniela Suarez Porras

Corrección de estilo (Editor secundario)

Diagramación: Cesar Augusto Ricautre

Diseño de portada: Cesar Augusto Ricautre

Publicado en Julio de 2018

Formato digital PDF (Portable Document Format)

Editorial Universidad Manuela Beltrán

Avenida Circunvalar Nº 60-00

Bogotá – Colombia

Tel. (57-1) 5460600

Page 8: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

Yamil Buenaño Palacios, Carlos Augusto Sánchez Martelo, Henry

Leonardo Avendaño Delgado, Manuel Antonio Sierra Rodríguez,

Carlos Andrés Collazos Morales, Domingo Alirio Montaño Arias,

Breed Yeet Alfonso Corredor, José Daniel Rodríguez Munca

Programación Avanzada para Dispositivos Móviles, Bogotá, UMB

© Yamil Buenaño Palacios, Carlos Augusto Sánchez Martelo,

Henry Leonardo Avendaño Delgado, Manuel Antonio Sierra

Rodríguez, Carlos Andrés Collazos Morales, Domingo Alirio

Montaño Arias, Breed Yeet Alfonso Corredor, José Daniel

Rodríguez Munca

© Universidad Manuela Beltrán

Bogotá, Colombia

http:// www.umb.edu.co

Queda prohibida la reproducción total o parcial de este libro por

cualquier proceso gráfico o fónico, particularmente por fotocopia,

Ley 23 de 1982

Programación avanzada para dispositivos móviles. / Yamil Buenaño Palacios…

(y otros 7) - Bogotá: Universidad Manuela Beltrán, 2018.

116 p.: ilustraciones, gráficas, tablas; [versión electrónica]

Incluye bibliografía

ISBN: 978-958-5467-12-5

1. Computación móvil 2. Aplicaciones para dispositivos móviles. 3. Apps

para móviles. i. Buenaño Palacios, Yamil ii. Sánchez Martelo, Carlos Augusto. iii.

Avendaño Delgado, Henry Leonardo iv. Sierra Rodríguez, Manuel Antonio v.

Collazos Morales, Carlos Andrés vi. Montaño Arias, Domingo Alirio. vii. Alfonso

Corredor, Breed Yeet. viii. Rodríguez Munca, José Daniel.

005.25 cd 21 ed.

CO-BoFUM

Catalogación en la Publicación – Universidad Manuela Beltrán

Page 9: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

Autoridades Administrativas

Gerente

Juan Carlos Beltrán Gómez

Secretario General

Juan Carlos Tafur Herrera

Autoridades Académicas

Rectora Alejandra Acosta Henríquez

Vicerrectoría de Investigaciones

Carlos Andrés Collazos

Coordinador General UMB Virtual Gustavo Adolfo Salas Orozco

ISBN: 978-958-5467-12-5

Page 10: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,
Page 11: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

11

TABLA DE CONTENIDO

Programación Avanzada para Dispositivos Móviles

Contenido Prólogo ............................................................................................................................................ 13

Introducción ................................................................................................................................... 15

Capítulo I......................................................................................................................................... 17

1. Interactividad y navegación de aplicaciones ................................................................... 19

1.1. Intent .................................................................................................................................... 19

1.1.1. Enviar datos hacia otra actividad ......................................................................................... 23

1.1.2. Acciones descriptivas sobre acciones ............................................................................... 25

1.2. ListView ............................................................................................................................... 25

1.2.1. Implementación de una lista .................................................................................................. 27

1.2.2. Adaptador ................................................................................................................................... 27

1.2.3. ListView-Adapter ...................................................................................................................... 28

1.3. WebView ............................................................................................................................. 30

1.3.1. Elementos para visualizar páginas en Android ................................................................ 31

1.3.2. Cargar una URL en Android................................................................................................... 32

1.4. Thread ............................................................................................................................. 33

1.4.1. Construcción de hilos ............................................................................................................. 34

1.4.1. Componentes de un hilo ........................................................................................................ 35

1.5. Toast .................................................................................................................................... 36

1.5.1. Componentes de un toast ...................................................................................................... 37

1.5.2. Estructura de un toast ............................................................................................................. 37

1.5.3. Constantes de la clase toast ................................................................................................. 38

1.6. Manifest ............................................................................................................................... 39

1.7. Composición de una aplicación Android ................................................................... 40

1.8. Estructura de una aplicación Android ........................................................................ 40

Capítulo II ....................................................................................................................................... 45

2. Conectividad ............................................................................................................................. 47

2.1. HTTP..................................................................................................................................... 47

2.1.1. HTTP Client ................................................................................................................................ 48

2.1.2. Acceso vía GET ......................................................................................................................... 48

2.1.3. Acceso vía POST ...................................................................................................................... 53

Page 12: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

12

2.1.4. Servlets ....................................................................................................................................... 54

2.1.5. Middleware ................................................................................................................................. 63

2.1.6. Modelo Vista Controlador (MVC) .......................................................................................... 63

2.1.7. Bases de datos .......................................................................................................................... 64

2.1.8. Web Services ............................................................................................................................. 65

Capítulo III ...................................................................................................................................... 83

3.1. Desarrollo de Aplicaciones Avanzadas ...................................................................... 84

3.1.1. Introducción ............................................................................................................................... 84

3.1.2. Sistema de Sensores ............................................................................................................... 84

3.1.3. Listar los sensores asociados a un terminal .................................................................... 86

3.1.4. Ejemplos ..................................................................................................................................... 86

3.1.5. Ejercicios de reflexión ............................................................................................................. 89

3.1.6. Conclusiones ............................................................................................................................. 92

3.2. Aplicación de Sensores .................................................................................................. 93

3.2.1. Introducción ............................................................................................................................... 93

3.2.2. Marco conceptual ..................................................................................................................... 94

3.2.3. Parámetros que proporciona................................................................................................. 94

3.2.4. El acelerómetro en los móviles............................................................................................. 95

3.2.5. Ejemplos ..................................................................................................................................... 95

3.2.6. Ejercicios de reflexión ............................................................................................................. 99

Page 13: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

13

PRÓLOGO

La programación avanzada para dispositivos móviles, es la base fundamental

para la formación en el área de Ingeniería de Software. Con el itinerario del

presente libro, los lectores podrán implementar aplicaciones para dispositivos

móviles en Android que sean capaces de usar y organizar la información de forma

interactiva. Por otra parte, se analizarán y utilizarán buenas prácticas para el

desarrollo y buen diseño de una aplicación para dispositivos móviles. También se

analizarán y desarrollarán temáticas como los intent, objetos que tienen como

función navegar de una página a otra; los listview, para la generación de listas;

webview, para visualizar páginas; los hilos, para el manejo de procesos, y los

manifest, para vincular las actividades a la aplicación. Además, se propondrán

actividades para fijar y evaluar la temática orientada.

Hoy en día la mayoría de los nuevos dispositivos móviles son capaces de

conectarse a Internet. De hecho, la tendencia en el consumo de datos está

cambiando: ya se accede más a Internet desde dispositivos móviles que desde

terminales fijos. En este libro se describen algunas formas de acceder a la red

para realizar peticiones desde una aplicación Android. La forma más habitual de

hacerlo es utilizando un servidor web con HTTP. Desde la aplicación Android se

realizará una solicitud HTTP y se enviará al servidor HTTP. También se

desarrollarán temáticas como los Servlets como clases especiales, concepto de

Middleware para la integración de sistemas, los web services para establecer

comunicación entre aplicaciones, los métodos POST y GET para envío de

información, el patrón MVC para diseño de aplicaciones.

Yamil Buenalo Palacios

Page 14: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

14

Page 15: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

15

INTRODUCCIÓN

Teléfono móvil se entiende como un dispositivo electrónico de comunicación,

normalmente de diseño reducido y sugerente, basado en la tecnología de ondas

de radio (es decir, transmite por radiofrecuencia), que tiene la misma funcionalidad

que cualquier teléfono de línea fija. Su rasgo característico principal es que se

trata de un dispositivo portable e inalámbrico. Esto es que la realización de

llamadas no es dependiente de ningún terminal fijo y que no requiere de ningún

tipo de cableado para llevar a cabo la conexión a la red telefónica (Basterretche,

2007).

Con la evolución de los dispositivos móviles han cambiado también los

productos que estos pueden tener. Además, con el pasar del tiempo, se han

convertido en instrumento de mínima capacidad de cálculo, con disponibilidad de

512Mb en memoria y 1Ghz de procesamiento aproximadamente, lo que posibilita

construir apps anheladas. Estas posibilidades han dado como resultado la

concepción de nuevos conceptos y tecnologías.

Bajo la denominación de sensores se engloba un conjunto de dispositivos con

los que se puede obtener información del mundo exterior (en este conjunto no se

incluye la cámara, el micrófono o el GPS). Como se verá en este capítulo, todos

los sensores se manipulan de forma homogénea. Por lo tanto, se identificarán y se

conocerán los dispositivos de entrada de mayor novedad que incorpora Android y

con ellos, posteriormente, se implementarán diseños atractivos e interactivos para

el usuario final. Además, se mostrará cómo se emulan estos procesos y las

herramientas existentes para tal fin.

Page 16: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

16

Page 17: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

17

CAPÍTULO I

Implementación de Apps Interactivas y Usables

Page 18: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

18

Page 19: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

19

1. INTERACTIVIDAD Y NAVEGACIÓN DE APLICACIONES

En este apartado se definirán cinco elementos de Android que permitirán

diseñar y construir aplicaciones usables por los usuarios: los intent, las list, los

webview, las thread y los toast.

1.1. Intent

Los intent son mensajes del sistema, que forman una red de comunicaciones

entre las aplicaciones Android dentro de un dispositivo. Los intent notifican a las

aplicaciones desde cambios hardware (como insertar una tarjeta SD), hasta la

recepción de datos (cuando llega un SMS) y eventos de aplicación (cuando se

lanza una aplicación).

Aparte de los intent ya definidos por el sistema, se pueden definir nuevos intent

para lanzar otras actividades dentro de una aplicación o para informar de un

evento producido en el dispositivo a varios destinatarios.

Un intent es básicamente una estructura de datos que contiene una descripción

abstracta de una acción a realizar. Los atributos principales en un intent son:

Acción: acción a realizar en forma de cadena. Por ejemplo:

“android.intent.action.VIEW”.

Datos: expresados en forma de objetos URI. Por ejemplo:

“content://contacts/people/1”.

Si se juntan la acción y los datos del ejemplo anterior, se formaría un intent, que

representa la acción de mostrar la información de persona que tiene como

identificador “1” dentro de los contactos. Para ver la información, se podría usar

una aplicación incorporada ya en Android, a través de la invocación del intent.

También un intent puede incorporar los siguientes atributos secundarios:

Categoría: proporciona información adicional de la acción a ejecutar.

Page 20: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

20

Tipo: especifica un tipo específico (un tipo MIME) de los datos del intent.

Normalmente este tipo se puede deducir a partir de los propios datos.

Utilizando este atributo se fuerza a un tipo explícito.

Componente: especifica el nombre exacto de una clase componente para

ser usada por el intent. Usualmente, esto es determinado a partir de la

acción, el dato o tipo, y la categoría. Especificando este atributo, el resto de

los atributos de un intent se convierten en opcionales.

Extras: información adicional contenida en un bundle. Puede ser usado

para proporcionar información adicional a un componente. Por ejemplo,

para mandar un e-mail, se podría añadir información extra aquí para el

asunto del e-mail y el cuerpo del mensaje.

Cuando un componente, como por ejemplo activity quiere invocar un intent,

puede hacerlo de dos formas:

Invocación implícita: donde la plataforma determina cuál componente es el

más adecuado para ejecutar el intent mediante un proceso de resolución de

intent a partir de la acción, datos y categoría.

Un ejemplo de invocación implícita para abrir el marcador de teléfono (sin hacer

una llamada) que proporciona Android, sería el siguiente, donde se crea un intent

a partir de la acción “Intent.ACTION_DIAL” y los datos en forma de objeto URI:

Al ejecutarlo, nos aparece directamente el marcador con el número de teléfono

indicado:

Intent intent = new Intent(Intent.ACTION_DIAL, Uri.parse("tel:3142875423")); startActivity(intent);

Page 21: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

21

Figura 1- Navegación entre activities.

Fuente: elaboración propia.

Invocación explícita: donde se especifica directamente en código una

referencia a componente (por ejemplo, a una clase activity o service) que

procesará el intent.

Por ejemplo, para crear un intent y lanzar una activity explícitamente, se tiene

que crear un objeto de la clase intent con la sintaxis: intent (context/contexto,

class/clase). Se lanzará invocando al método “startActivity()” pasándole por

argumento el intent creado:

Intent intent = new Intent(this, OtraActividad.class); startActivity(intent);

Intent i=new Intent(contexto.this, pagina.class); startActivity(i);

Page 22: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

22

El contexto se refiere a la página origen desde donde se pretende realizar la

acción y la pagina.class, página de destino a la cual se pretende navegar.

Ejemplo:

La activity menú es la página desde donde se invocará la página de Facebook.

Si además se desea pasar los datos por parámetro, se puede hacer a través de

un objeto bundle:

Si se quieren leer desde la clase “OtraActividad” esos datos, se tendrá que

hacer de la siguiente forma:

Se pueden registrar tres componentes de Android como controladores intent:

las activity, los broadcast receiver y los services. Estas clases se pueden registrar

Intent i; i=new Intent(Menu.this, faceboock.class); startActivity(i);

Bundle bundle = new Bundle(); bundle.putString("nombreParametro", "valor"); Intent intent = new Intent(this, OtraActividad.class); intent.putExtras(bundle); startActivity(intent);

Bundle bundle = this.getIntent().getExtras(); String valorParametro = bundle.getString("nombreParametro");

Page 23: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

23

en como destinos de intent con el elemento <intent-filter> en el fichero

“AndroidManifest.xml”:

Cada vez que se instala una aplicación en la plataforma Android se registran

sus filtros de intent. De esta forma, sabe asignar las solicitudes de intent entrantes

al controlador correspondiente. Las comparaciones que se realizan para asignar la

solicitud son las siguientes:

La acción y la categoría deben de coincidir.

Si se especifica el tipo de datos, debe de coincidir también.

1.1.1. Enviar datos hacia otra actividad

Los objetos intent, además de navegar de una actividad a otra, se pueden

utilizar para comunicar y navegar entre dos o más actividades contenidas en una

aplicación móvil. A este tipo de información se le denomina extras y en su

estructura está compuesta por un identificador y un valor.

Para iniciar una actividad, se debe anexar los datos al intent mediante el

método putExtra(). Este método tiene como objetivo enviar diferentes tipos de

datos.

Para visualizar su utilización es necesario enviar la información mediante texto

desde la actividad de origen, para ser visualizada por otra actividad, el visor. La

información enviada estará representada por el nombre de la imagen que se va a

<activity android:name=".HolaMundoActivity" android:label="@string/app_name"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity>

Page 24: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

24

visualizar, por ejemplo “imagen.jpg”. Para ello se debe agregar un TextView en el

cual se mostrará la información en el atributo text.

En la actividad main se declara la constante de tipo string, el cual representa el

identificador del dato extra para el objeto intent.

Ejemplo:

Es de gran relevancia contar con una cadena de texto única, de tal forma que

no se cruce con otra información. Por eso se elige el nombre del paquete del

proyecto que se esté realizando, con lo cual se asegura que no se repita. A

manera de ejemplo, se mostrará la implementación del método putExtra():

Recibir la información de la otra actividad

Para poder recibir la actividad proveniente de otra, se invoca el método

getIntent(), contenida en la clase activity, y posteriormente se obtiene el intent que

inicializó la actividad. Normalmente, todos las activity son inicializadas por un

intent. De hecho, se puede obtener el intent proveniente de la actividad principal

inicializando el sistema.

A partir del método onCreate() del visor, se obtiene el intent. Después de este,

se extrae la cadena de texto de la información enviada a través del método

getStringExtra(), asignándosele al atributo text del TextView:

public final static String VAR_EXTRA = "NOMBRE_PAQUETE.NOMBRE_ACTIVITY";

//Iniciando la actividad Visor Intent intent = new Intent(this,Visor.class); //Adjuntando la cadena de texto intent.putExtra(NOMBRE_PAQUETE,"imagen.jpg"); //Ejecutando el intent startActivity(intent);

Page 25: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

25

Ejemplo

1.1.2. Acciones descriptivas sobre acciones

Tabla 1 - Acciones descriptivas

Constante Representativas Acción

ACTION_MAIN Empieza la actividad de una aplicación con el punto principal de entrada

ACTION_VIEW Muestra información al usuario

ACTION_ATTACH_DATA Indica que cierta información debe ser añadida en una parte específica

ACTION_PICK Selecciona un ítem de un conjunto de datos y retorna en él

ACTION_DIAL Marca un número para iniciar una llamada

ACTION_CALL Realiza una llamada a un número especificado

ACTION_ANSWER Gestiona una llamada entrante

ACTION_SEARCH Realiza una búsqueda

ACTION_WEB_SEARCH Realiza una búsqueda web Fuente: https://developer.android.com/reference/android/content/Intent.html

1.2. ListView

Las listas en Android son contenedores supremamente útiles para organizar

información en forma vertical y con la capacidad de usar scrolling

(desplazamiento) para simplificar su visualización. Esta técnica es muy popular en

muchas aplicaciones, ya que permite mostrarle al usuario un conjunto de datos de

forma práctica y accesible.

// del TextView nombre_imagen = (TextView)findViewById(R.id. nombre_imagen); // Obtención de la instancia del Intent Intent intent Obtención de la instancia = getIntent(); //Se extrae el extra de tipo cadena String nombre = intent.getStringExtra(Main. VAR_EXTRA); //Mostrando el valor del extra en el TextView nombre_imagen.setText(nombre);

Page 26: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

26

La clase ListView representa una lista vertical en el API de Android con el

mismo nombre. Esta clase viene preparada para recibir los ítems que se

desplegarán en la interfaz, facilitando al programador la implementación de sus

características y comportamientos. Si en algún momento los ítems que contiene

dificultan la visualización total en la actividad de la aplicación, automáticamente

implementará scrolling para que el usuario pueda desplegar los elementos ocultos.

Estructuralmente un ListView contiene un view específico por cada fila. También

se compone de un ScrollView, el cual permite generar el desplazamiento vertical

por si se agota la pantalla para nuestros elementos (Gramlich, 2010)

Diseño de un ListView. Para la implementación de una lista, se crea la

siguiente estructura:

Como se puede ver, el elemento <ListView> es el equivalente de la clase

ListView y ha sido declarado como elemento raíz. Si se observan sus

dimensiones, se le ha asignado match_parent para que se ajuste al tamaño de la

actividad (actividad basada en una lista) (Gramlich, 2010).

<ListView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/lista"/>

Page 27: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

27

El código anterior en el layout deberá generar una imagen como la siguiente:

Figura 2- Diseño de lista.

1.2.1. Implementación de una lista

Para diseñar una lista de datos para móviles se emplean algunos elementos

que permiten darle funcionalidad y facilitar su implementación:

1.2.2. Adaptador

Un adaptador es un objeto que comunica a un ListView los datos necesarios

para crear los registros de la lista, es decir, permite conectar la lista con el origen

de información. Además, provee la información y genera los views para cada

elemento de la lista. En otras palabras, se encarga de todo. Sin embargo, es la

lista la que muestra la información final. Por otro lado, en programación los

adaptadores se representan por la clase Adapter (Revelo, 2014).

Page 28: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

28

1.2.3. ListView-Adapter

Cuando se referencia un adaptador a un ListView inmediatamente se comienza

un proceso de comunicación interno para poblar la lista con los datos

correspondientes. Dicha comunicación se basa principalmente en los siguientes

métodos del adaptador:

getCount(): retorna en la cantidad de elementos que tiene un adaptador.

Con este valor la lista ya puede establecer un límite para añadir filas.

getItem(): obtiene un elemento de la fuente de datos asignada al adaptador

en una posición establecida. Normalmente, la fuente de datos es un arreglo

o lista de objetos.

getView(): retorna en el view elaborado e inflado de un elemento en una

posición especifica (Revelo, 2014).

Figura 3 - Estructura del diseño de una lista.

Fuente: http://www.hermosaprogramacion.com/2014/10/android-listas-adaptadores/

Page 29: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

29

Los siguientes son algunos de los parámetros para la construcción de la lista:

Declarar las instancias de la lista y el adaptador:

Fuente: http://www.hermosaprogramacion.com/2014/10/android-listas-adaptadores/

Obtener programáticamente una referencia de la lista:

Fuente: http://www.hermosaprogramacion.com/2014/10/android-listas-adaptadores/

Relacionando el adaptador con la lista:

Fuente: http://www.hermosaprogramacion.com/2014/10/android-listas-adaptadores/

El propósito de ellos es:

Context context: representa el contexto de la aplicación. Se usa this para

indicar que será la actividad que se basa en la creación de la lista.

Int resource: es el recurso de diseño o layout que representará cada fila de

la lista. En este caso, se usa un recurso del sistema llamado

simple_list_item_1.xml. Este layout contiene un solo TextView que

contendrá el texto de cada fila.

T[] objects: es la referencia del array de objetos de tipo T con los cuales se

creará la lista. Si desea, puede variar el constructor y usar una lista

dinámica List<T>, en lugar del array.

ListView lista; ArrayAdapter<String> adaptador; ...

lista = (ListView)findViewById(R.id.lista);

lista.setAdapter(adaptador);

Page 30: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

30

Código que construye los elementos para la lista

ListView listview1= (ListView)findViewById(R.id.lista1);

String listview_array[]={"Elemento 1", "Elemento 2", "Elemento 3", "Elemento 4"};

listview1.setAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,

listview_array));

Figura 4 - Lista de elementos.

Fuente: elaboración propia.

1.3. WebView

El WebView es considerado el navegador interno de las aplicaciones Android,

es decir, el visor de páginas web nativo de Android. Por lo tanto, es muy propenso

a recibir ataques desde páginas web maliciosas. También, es una aplicación

dispuesta por Android a la que tienen acceso los desarrolladores a la hora de

programar sus aplicaciones.

Hasta Android 5.0 Lollipop eran los fabricantes quienes se encargaban de

lanzar estos parches de seguridad con actualizaciones de sistema. Sin embargo,

con las nuevas versiones de Android esta tarea recayó en Google gracias a las

actualizaciones del componente WebView a través de Google Play, con lo que

puede corregir los fallos de seguridad en menor tiempo y para el mayor número de

dispositivos.

Page 31: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

31

1.3.1. Elementos para visualizar páginas en Android

WebView. Objeto que permite mostrar páginas web.

loadUrl(). Función que permite cargar páginas web.

Figura 5 - Imágen de WebView

Fuente: http://www.elandroidelibre.com/2015/06/que-es-webview-y-por-que-tengo-que-actualizarlo.html

Implementando un WebView en Android.

Implementado un WebView en un layout.

Fuente: https://danielme.com/2012/05/19/android-webview-incrustar-un-navegador-en-nuestras-apps/

<?xml version="1.0" encoding="utf-8"?> <WebView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/webview" android:layout_width="fill_parent" android:layout_height="fill_parent" />

Page 32: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

32

1.3.2. Cargar una URL en Android

Ejemplo:

WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.loadUrl("http://www.example.com");

//Se debe crear la clase Externa Web View import android.webkit.WebView; import android.webkit.WebViewClient; public class ViewClient extends WebViewClient { public boolean shouldOverrideUrlLading(WebView v, String url){ v.loadUrl(url); return true; } }

public class google extends Activity { WebView sitio; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.google); sitio = (WebView)findViewById(R.id.wvNavegador); sitio.setWebViewClient(new ViewClient()); sitio.getSettings().setJavaScriptEnabled(true); sitio.getSettings().setLoadWithOverviewMode(true); sitio.getSettings().setUseWideViewPort(true); sitio.loadUrl("http://www.google.es"); } }

Page 33: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

33

Código Fuente propia

Estos códigos de javascript son de gran relevancia para la configuración de las

páginas invocadas desde una aplicación Android, porque permiten ajustarlas de

acuerdo a la resolución y tamaño del dispositivo.

sitio.setWebViewClient(new ViewClient());

sitio.getSettings().setJavaScriptEnabled(true);

sitio.getSettings().setLoadWithOverviewMode(true);

sitio.getSettings().setUseWideViewPort(true);

1.4. Thread

En sistemas operativos thread (hilo), llamado hebra o subproceso, es la unidad

de procesamiento más pequeña que puede ser planificada por un sistema

operativo. La creación de un hilo es una característica que permite a una

aplicación realizar varias tareas a la vez.

La diferencia básica entre un proceso de sistema operativo y un thread Java es

que los hilos corren dentro de la JVM, que es un proceso del sistema operativo y,

por tanto, comparten todos los recursos, incluida la memoria y las variables y

objetos allí definidos. A este tipo de procesos donde se comparte los recursos se

les llama a veces procesos ligeros (lightweight process).

Según el Departamento de Informática de la Universidad de Valladolid, en la

construcción de aplicaciones para Android, los hilos son de gran utilidad para

generar presentación y, en ocasiones, para simular los procesos de carga de la

aplicación. Desde el punto de vista de las aplicaciones, los hilos son útiles porque

permiten que el flujo del programa sea divido en dos o más partes, cada una

ocupándose de alguna tarea de forma independiente. Por ejemplo, un hilo puede

encargarse de la comunicación con el usuario, mientras que otros actúan en

segundo plano, realizando la transmisión de un fichero, accediendo a recursos del

Page 34: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

34

sistema (cargar sonidos, leer ficheros), etc. De hecho, todos los programas con

interface gráfico (AWT o swing, activity) son multihilo porque los eventos y las

rutinas de dibujado de las ventanas corren en un hilo distinto al principal.

1.4.1. Construcción de hilos

La forma más directa para hacer un programa multihilo es extender la clase

thread y redefinir el método run(). Este método, de acuerdo al Departamento de

Informática de la Universidad de Valladolid, es invocado cuando se inicia el hilo

(mediante una llamada al método start() de la clase thread). El hilo se inicia con la

llamada al método run() y termina cuando termina este.

Ejemplo:

Fuente: http://www.infor.uva.es/~fdiaz/sd/doc/hilos

public class ThreadEjemplo extends Thread { public ThreadEjemplo(String str) { super(str); } public void run() { for (int i = 0; i < 10 ; i++) System.out.println(i + " " + getName()); System.out.println("Termina thread " + getName()); } public static void main (String [] args) { new ThreadEjemplo("Pepe").start(); new ThreadEjemplo("Juan").start(); System.out.println("Termina thread main"); } }

Page 35: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

35

Figura 7- Imagen que muestra el proceso de carga mediante un hilo. Fuente: http://www.hermosaprogramacion.com/wp-content/uploads/2014/12/android-progressbar-landscape.png

1.4.1. Componentes de un hilo

Cuando se instancia la clase thread (o una subclase) se crea un nuevo thread

que está en su estado inicial ('New Thread' en el gráfico). En este estado es

simplemente un objeto más. No existe todavía el thread en ejecución. El único

método que puede invocarse sobre él es el método start().

Según el Departamento de Informática de la Universidad de Valladolid, cuando

se invoca el método start() sobre el hilo el sistema crea los recursos necesarios, lo

planifica (le asigna prioridad) y llama al método run(). En este momento el hilo está

corriendo, se encuentra en el estado ‘runable’. Si el método run() invoca

internamente el método sleep() o wait() o el hilo tiene que esperar por una

operación de entrada/salida, entonces el hilo pasa al estado 'no runnable' (no

ejecutable) hasta que la condición de espera finalice. Durante este tiempo el

sistema puede ceder control a otros hilos activos. Por último, cuando el método

run finaliza el hilo termina y pasa a la situación dead (Muerto).

Page 36: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

36

Este código visualiza en un tiempo determinado una imagen.

Fuente: Código - Elaboración propia

1.5. Toast

El toast es una clase que tiene como función visualizar mensajes sobrepuestos

a la ventana en un determinado período de tiempo, pero sin detener la aplicación.

Se debe tener en cuenta que este mensaje no permite interactuar con el usuario,

es decir, no se pueden ingresar datos, seleccionar botones ni obligar a que se

cierre.

public class AppWebSocialActivity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); Thread logo = new Thread(){ public void run(){ try{ int tiempo=0; while(tiempo<5000){ sleep(100); tiempo=tiempo+100; } Intent i=new Intent("com.appwebsocial.es.Menu"); startActivity(i); } catch(InterruptedException e){ e.printStackTrace(); }finally{ finish(); } } }; logo.start(); } }

Page 37: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

37

Un toast también es un mensaje en un pequeño pop-up, cuyo tamaño no

excede el contenido del mensaje. Este tipo de mensajes son muy útiles cuando se

quiere mostrar cualquier mensaje informativo, donde no se necesita la interacción

del usuario. Por ejemplo, si se guardan los datos de un usuario en la base de

datos de una aplicación, se podría mostrar el mensaje “Usuario guardado

correctamente” en un toast.

Figura 9 - Representación de un mensaje. Fuente: http://www.anpstudio.com/wp-content/uploads/2013/10/toast.png

1.5.1. Componentes de un toast

- makeText(). Este método toma tres parámetros: el contexto de la

aplicación, el mensaje de texto que queremos mostrar y la duración del

toast.

- show(). Permite visualizar el mensaje.

1.5.2. Estructura de un toast

Toast.makeText(context, text, duration).show();

Context context = getApplicationContext(); CharSequence text = "Hello toast!"; int duration = Toast.LENGTH_SHORT; Toast toast = Toast.makeText(context, text, duration); toast.show();

Page 38: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

38

1.5.3. Constantes de la clase toast

- LENGTH_SHORT. Duración corta.

- LENGTH_LONG. Duración larga.

Ejemplo:

Código completo que implementa u mensaje a través de un toast.

//actividad_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/toast_layout_root"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#C8C8C8"

android:gravity="center"

android:orientation="horizontal"

android:padding="10dp" >

<ImageView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginRight="8dp"

android:src="@android:drawable/ic_dialog_info" />

<TextView

android:id="@+id/text_toast"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#FFF" />

Page 39: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

39

</LinearLayout>

Fuente: https://developer.android.com/guide/topics/ui/notifiers/toasts.html

//MainActividad.java

Context context = getApplicationContext();

CharSequence text = "Hello toast!";

int duration = Toast.LENGTH_SHORT;

LayoutInflater inflater = getLayoutInflater();

View layout = inflater.inflate(R.layout.custom_toast,

(ViewGroup) findViewById(R.id.toast_layout_root));

TextView textToast = (TextView) layout.findViewById(R.id.text_toast);

textToast.setText(text);

Toast toast = new Toast(context);

toast.setDuration(duration);

toast.setView(layout);

toast.show();

Fuente: https://developer.android.com/guide/topics/ui/notifiers/toasts.html

1.6. Manifest

Como lo explica el portal Tuprogramación.com, se encuentra situado en la raíz

de las aplicaciones de Android con el nombre AndroidManifest.xml y es el archivo

de configuración donde se pueden aplicar las configuraciones básicas de una app

móvil. La configuración puede ser realizada por medio de interfaz gráfica o por

código. Sin embargo, es recomendable realizarla por medio de la sintaxis debido a

que es más sencillo y rápido hacerlo desde el propio xml. El Android manifest está

situado en la raíz de cada aplicación.

Page 40: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

40

1.7. Composición de una aplicación Android

Toda las aplicaciones que se construyan para para Android poseen una misma

estructura básica, que se compone del código fuente, archivos de recursos y

vistas, librerías de código y el Android manifest. Las siguientes definiciones han

sido tomadas del portal Tuprogramación.com:

- Directorio SRC: se encuentra toda la lógica de aplicación, es decir,

todas las clases programadas en Java. Ahí se puede definir distintos

paquetes, donde se puede dividir en capas las reglas de negocio.

- Android Library: aquí se encuentran alojadas todas las librerías

propias del SDK de Android, dependiendo la versión elegida al crear el

proyecto se tendrá una versión u otra.

- Directorios RES: en este paquete se encuentran todos los archivos

con los recursos que usan la aplicación: las imágenes, archivos de idiomas,

estilos, etc.

1.8. Estructura de una aplicación Android

- Drawable. Carpeta donde se alojan todas las imágenes de la app. Se

subdivide en múltiples carpetas desde la versión 1.6, que contienen las imágenes

en distintas resoluciones y tamaños que se usarán dependiendo el dispositivo

usado.

- Directorio layout. Aquí se encuentran las distintas “interfaces” de la

aplicación, es decir, los archivos xml asociadas a las activities.

Page 41: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

41

- Values. Carpeta con los xml de contenido de la app. En ella se puede

definir las constantes de la aplicación, dando la posibilidad del multiidioma, estilos

para los componentes y demás configuraciones.

- Directorio bin. Aquí se encuentran todos los archivos generados por la

propia app. Como se sabe, Android usa la máquina virtual dalvik, primero se

traduce a los típicos archivos .class de java y posteriormente es traducido a los

archivo .dex propios de Android. También se encuentra el ejecutable de la

aplicación "apk", que equivale a los ".exe" de Windows. Este es el archivo que se

debe instalar en teléfono Android para probar la aplicación.

- Directorio gen. En esta carpeta está el archivo R.class, que contiene los

identificadores y los recursos usados por un proyecto: imágenes, layout, etc.

Si se abre el archivo R.java, se visualizarán los valores internos que se asignan

a cada uno de los identificadores de la aplicación.

Page 42: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

42

- Directorio assests: carpeta donde se encuentran los archivos auxiliares de

una aplicación: imágenes, audios, vídeos. La diferencia con los que se encuentran

en la carpeta "RES" es que los archivos incluidos aquí no generarán un

identificador dentro del archivo R.class anteriormente descrito. Para usar estos

archivos, en vez de referenciarlos por un ID, habría que usar la ruta física como

cualquier otro archivo Directorio lib. Aquí irán las librerías externas importados que

se necesiten.

- Android Manifest: se considera el archivo básico de configuración de toda

aplicación Android. En él se definen todas las activities de la app y sus permisos.

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="nombre.paquete" android:versionCode="1" android:versionName="1.0">

Page 43: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

43

Todas las activities de la app deben ser declaradas en esta sección, sino no se

declaran entonces la aplicación no funcionará. La actividad inicial de la aplicación

debe ser declarada de tipo "LAUNCHER":

//Estructura Código Manifest

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

package="com.appwebsocial.es"

android:versionCode="1"

android:versionName="1.0" >

<uses-sdk android:minSdkVersion="16" android:targetSdkVersion="16"/>

<uses-permission android:name="android.permission.INTERNET"/>

<uses-permission

android:name="android.permission.ACCESS_WIFI_STATE"/>

<application

android:icon="@drawable/logows"

android:label="@string/app_name"

android:debuggable="true" >

<activity

android:name=".AppWebSocialActivity"

android:label="@string/app_name" >

<intent-filter>

<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />

</intent-filter>

</activity>

Page 44: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

44

<activity

android:name=".Menu"

android:label="@string/app_name" >

<intent-filter>

<action android:name="com.appwebsocial.es.Menues" />

<category android:name="android.intent.category.DEFAULT" />

</intent-filter>

</activity>

<activity android:name="google"></activity>

<activity android:name="faceboock"></activity>

<activity android:name="twiter"></activity>

<activity android:name="skype"></activity>

<activity android:name="youtube"></activity>

</application>

</manifest>

//Vista de Diseño Manifest

Fuente: Elaboración propia

Page 45: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

45

CAPÍTULO II

Conectividad

Page 46: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

46

Page 47: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

47

2. CONECTIVIDAD

La conectividad es la disposición que posee un dispositivo para establecer

conexión de forma independiente, es decir, que los dispositivos no deben estar

interconectados para obtener una reciprocidad en el manejo de la información.

En este apartado se definirán los elementos necesarios para el diseño de

aplicaciones para Android, que permitan establecer conexiones con bases de

datos externas e integrar dispositivos móviles con sistemas de información.

Figura 1- Pantalla que representa conectividad. Fuente: http://fqtecnologia.com/servicio/conectividad

2.1. HTTP1

Es un protocolo de transferencia de hipertexto que se usa en la web. Su sigla

significa HyperText Transfer Protocol o Protocolo de Transferencia de Hipertexto.

Este protocolo fue desarrollado por las instituciones internacionales W3C y IETF y

se usa en todo tipo de transacciones a través de Internet. Por otro lado, este

protocolo opera por petición y respuesta entre el cliente y el servidor. A menudo

las peticiones tienen que ver con archivos, ejecución de un programa, consulta a

una base de datos, traducción y otras funcionalidades. Toda la información que

1 Definición ABC (2007), disponible en: http://www.definicionabc.com/tecnologia/http.php

Page 48: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

48

opera en la web mediante este protocolo es identificada mediante el URL o

dirección.

2.1.1. HTTP Client

Con la clase HttpClient se pueden realizar solicitudes HTTP usando los

métodos GET y POST. La principal diferencia entre ambos es que GET envía las

variables dentro de la propia URL de la página, concatenadas por ampersands (&),

mientras que POST las envía de forma “invisible” al usuario. De esta última forma

se pueden enviar más datos (no hay limitación en la barra de direcciones) y es

más seguro (por lo menos los valores de los parámetros son menos visibles). Con

esta clase se pueden hacer conexiones con Web Services SOAP y RESTFul.

2.1.2. Acceso Vía GET

Para probar el acceso vía GET se realizará un proyecto en el que el usuario

introduzca la URL de una web y se le devuelva el código HTML de la misma. Para

ello se construirá una Vista en la que se tenga una caja de texto para recoger la

URL (deberá comenzar por http://www), un botón para el envío y otra caja de texto

con scroll para mostrar el HTML.

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/intro" /> <EditText

Page 49: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

49

android:id="@+id/url" android:layout_width="match_parent" android:layout_height="wrap_content" android:inputType="textUri" android:text="http://" > <requestFocus /> </EditText> <Button android:id="@+id/enviar" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/enviar" /> <ScrollView android:id="@+id/scrollView1" android:layout_width="match_parent" android:layout_height="wrap_content" > <LinearLayout android:id="@+id/linearLayout1" android:layout_width="match_parent" android:layout_height="match_parent" > <EditText android:id="@+id/salida" android:layout_width="wrap_content" android:layout_height="365dp" android:layout_weight="1" android:enabled="false" android:inputType="textMultiLine" /> </LinearLayout>

Page 50: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

50

</ScrollView> </LinearLayout>

En la actividad, en primer lugar se añadirá el listener al botón para que pueda

recibir eventos de clic.

Button enviar = (Button) this.findViewById(R.id.enviar);

enviar.setOnClicListener(this);

Posteriormente, el método onClic (View) se conectará a dicha URL y se

obtendrá el código HTML. Se recogerá la URL del usuario y se dejará preparada la

salida para escribir en ella (la salida es otra caja de texto, pero en este caso dentro

de un panel con scroll).

EditText url = (EditText) this.findViewById(R.id.url);

EditText salida = (EditText) this.findViewById(R.id.salida);

El código que permite la conexión es el siguiente:

try {

HttpClient client = new DefaultHttpClient();

HttpGet request = new HttpGet();

request.setURI(new URI(url.getText().toString()));

HttpResponse response = client.execute(request);

BufferedReader in = new BufferedReader (new

InputStreamReader(response.getEntity().getContent()));

StringBuffer sb = new StringBuffer("");

String lineaLeida = "";

while ((lineaLeida = in.readLine()) != null) {

sb.append(lineaLeida + "\n");

Page 51: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

51

}

in.close();

salida.setText(sb);

}

catch (Exception e) {

salida.setText("Error: "+e);

}

Se creará una instancia al objeto HTTPClient y a través del método HTTPGet

se le escribirá la URL del usuario. Después solo quedará recorrer los bytes que

compone el resultado e irlos almacenando en un String. Por último, se mostrará el

String resultante al usuario. No hay que olvidar que se le tiene que dar acceso de

Internet a la aplicación en el Manifest. El resultado de la aplicación sería el

siguiente:

Figura 2 - Pantalla acceso GET, que visualiza contenido HTML. Fuente: elaboración propia.

Android está preparado para mostrar contenido web directamente (no el

contenido HTML, sino su traducción, al igual como lo hace un navegador). Para

Page 52: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

52

ello habrá que introducir la URL en un componente tipo WebView (en lugar de la

caja de texto actual) y se verá el resultado de la web. En este caso, la aplicación

no descargará vía HTTP el contenido HTML, sino que será el propio componente

WebView el que lo hará. Así pues, las modificaciones a nivel de código serán las

siguientes, que tienen el componente salida de tipo WebView.

public void onClic(View arg0) {

// TODO Auto-generated method stub

EditText url = (EditText) this.findViewById(R.id.url);

WebView salida = (WebView) this.findViewById(R.id.salida);

salida.loadUrl(url.getText().toString());

}

La aplicación se vería de esta forma:

Figura 3 - Pantalla acceso POST, que visualiza contenido HTML. Fuente: elaboración propia.

Page 53: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

53

2.1.3. Acceso Vía POST

El acceso vía POST se haría de la siguiente forma: en primer lugar, deberá

conectarse a la URL en cuestión:

HttpClient client = new DefaultHttpClient();

HttpPost request = new HttpPost("http://unapagina.com");

Por otro lado, también se puede cargar una página de forma directa, ingresando

su URL. A continuación, un ejemplo:

public class MainActivity extends Activity implements OnClicListener{

EditText navegador;

Button enviar;

WebView sitio;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

sitio=(WebView) findViewById(R.id.wvNavegador);

navegador=(EditText) findViewById(R.id.edNavegador);

enviar = (Button) findViewById(R.id.Enviar);

enviar.setOnClicListener((OnClicListener) this);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is

present.

getMenuInflater().inflate(R.menu.main, menu);

return true;

}

public void onClic(View v) {

Page 54: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

54

switch(v.getId()){

case R.id.Enviar:

String web=navegador.getText().toString();

sitio.loadUrl(web);

break;

}

}

}

2.1.4. Servlets

Son clases especiales escritos en Java para establecer comunicación con un

servidor. Además, pueden ser utilizadas como controladores en las aplicaciones

web.

Estructura de un Servlets:

package Servlets; @WebServlet(name = "NombreServlet", urlPatterns = {"/ NombreServlet "}) public class NombreClase extends HttpServlet { public void init(ServletConfig config) throws ServletException { super.init(config); } protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException, InstantiationException, SQLException {

//Aquí se escribe el Código de programa. } }

Page 55: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

55

Ahora, se indicará cómo crear y utilizar un Servlets:

1. En Netbeans, crear un proyecto (File/new/Proyecto).

2. Crear un paquete y en el hacer clic con el botón derecho del mouse y

escoger la opción New/Servlet.

3. Ingresar el nombre a la clase

Page 56: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

56

4. Hacer clic en Next, ingresar el nombre del Servlets y hacer clic en Finish.

5. Ya está creado el Servlets para ser utilizado:

Page 57: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

57

Miremos un ejemplo donde se creará un servicio pasando parámetros y

utilizando el método POST: se proporcionará a ese servicio (un Servlet, por

ejemplo) los parámetros necesarios para realizar la operación.

List params = new ArrayList();

params.add(new BasicNameValuePair("nombreparametro1", "valor1"));

params.add(new BasicNameValuePair("nombreparametro2", "valor2"));

Una vez insertados los parámetros, se procederá a realizar el envío.

Finalmente, lo único que se tendrá que hacer es analizar la respuesta dada.

HttpResponse response = client.execute(request);

HttpEntity resEntity = response.getEntity();

String cadenaRespuesta = EntityUtils.toString(resEntity);

Una vez vista la forma de trabajar, se realizará un ejemplo que interconecte una

aplicación Android con un servicio en la red (un Servlet). La petición se hará vía

POST. Para ello se debe realizar el Servlet, el cual recibirá una cantidad de dinero

y la moneda en la que se encuentra dicha cantidad; el servicio se encargará de

convertirla a otra moneda. Por ejemplo, se va a crear un conversor de euros a

dólares.

El código del Servlet quedaría como se muestra a continuación:

public class ConversorServlet extends HttpServlet {

public static final float CAMBIO = 1.298F;

@Override

protected void service(HttpServletRequest req, HttpServletResponse

resp) throws ServletException,

IOException {

PrintWriter out = resp.getWriter();

String cantidad = req.getParameter("cantidad");

Page 58: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

58

String moneda = req.getParameter("moneda");

//Analizamos los posible errores

if ((cantidad == null) || (moneda == null)) out.println("Error, faltan

parámetros");

else {

float c = Float.parseFloat(cantidad);

//Analizamos a qué moneda queremos convertir la cantidad

if (moneda.equals("EUR")) {

//La convertiremos a Euros

c/=CAMBIO;

}

else {

//La convertiremos a Dólares

c*=CAMBIO;

}

cantidad = String.valueOf(c);

out.println(cantidad+" "+moneda);

}

}

}

Como se muestra en el código, se reciben dos parámetros: la cantidad de

dinero a convertir y la moneda a la que se quiere convertir. Tras haber hecho lo

anterior, tan solo habrá que realizar una multiplicación o una división con base al

tipo de cambio que representa la constante CAMBIO.

Después de realizar el Servlet, es el turno del desarrollo de la aplicación

Android. Se comenzará con la interfaz visual, la cual estará formada por una caja

de texto en la que el usuario introducirá la IP del servidor de aplicaciones, otra caja

de texto donde introducirá la cantidad a convertir, dos botones -uno para cada tipo

Page 59: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

59

de conversión- y por último la caja de texto deshabilitada en la que se mostrará el

resultado de la conversión. El resultado es el siguiente:

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="vertical" >

<TextView

android:id="@+id/textView1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/titulo"

android:textAppearance="?android:attr/textAppearanceLarge" />

<TextView

android:id="@+id/textView2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/ip"

android:textAppearance="?android:attr/textAppearanceSmall" />

<EditText

android:id="@+id/ip"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="top"

android:inputType="textUri"

android:text="@string/valorIp" >

<requestFocus />

</EditText>

<TextView

android:id="@+id/textView3"

android:layout_width="wrap_content"

Page 60: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

60

android:layout_height="wrap_content"

android:text="@string/cantidad"

android:textAppearance="?android:attr/textAppearanceSmall" />

<EditText

android:id="@+id/cantidad"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:inputType="number"

android:text="@string/cien" />

<LinearLayout

android:id="@+id/linearLayout1"

android:layout_width="match_parent"

android:layout_height="wrap_content" >

<Button

android:id="@+id/euros"

android:layout_width="150dp"

android:layout_height="wrap_content"

android:text="@string/euros" />

<Button

android:id="@+id/dolares"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="@string/dolares" />

</LinearLayout>

<EditText

android:id="@+id/resultado"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:editable="false"

android:enabled="false"

Page 61: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

61

android:inputType="number" />

</LinearLayout>

A continuación se desarrollará la actividad. En el método onClic () se gestionará

cuál de los dos botones ha pulsado el usuario y, en función de ese botón, se le

mandará un valor u otro al Servlet en el parámetro moneda.

@Override

public void onClic(View v) {

// TODO Auto-generated method stub

TextView ip = (TextView) this.findViewById(R.id.ip);

TextView cantidad = (TextView) this.findViewById(R.id.cantidad);

TextView resultado = (TextView) this.findViewById(R.id.resultado);

String moneda = "EUR";

if (v.getId() == R.id.dolares) moneda = "USD";

try {

HttpClient client = new DefaultHttpClient();

HttpPost request = new

HttpPost("http://"+ip.getText()+":8080/Conversor/ConversorServlet");

ArrayList<BasicNameValuePair> params = new

ArrayList<BasicNameValuePair>();

params.add(new BasicNameValuePair("cantidad",

cantidad.getText().toString()));

params.add(new BasicNameValuePair("moneda", moneda));

UrlEncodedFormEntity ent = new UrlEncodedFormEntity(params,

HTTP.UTF_8);

request.setEntity(ent);

HttpResponse response = client.execute(request);

Page 62: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

62

HttpEntity resEntity = response.getEntity();

String cadenaRespuesta = EntityUtils.toString(resEntity);

resultado.setText(cadenaRespuesta);

}

catch (Exception e) {

Toast.makeText(this, "Error: "+e.getMessage(),

Toast.LENGTH_SHORT).show();

}

}

Se contactará con el Servlet en la dirección IP especificada por el usuario, se le

proporcionará la cantidad a convertir y el tipo de conversión y este devolverá el

resultado en formato cadena de caracteres. Ese resultado será el que se imprimirá

en la caja de texto resultado. La aplicación quedaría como se muestra a

continuación:

Figura 4 - Pantalla envío de parámetros vía POST. Fuente: elaboración propia.

Page 63: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

63

Es importante especificar que aunque el Servidor de Aplicaciones se tenga en

la misma máquina, hay que especificar su dirección IP, pues no conectará con

la dirección de bucle interno tipo 127.0.0.1 o localhost.

2.1.5. Middleware

Los Middleware son servicios que tienen como función intercambiar mensajes o

información entre los elementos que participan. Este tipo de sistema orientado a

servicios realiza sus tareas de forma oculta, es decir, se encarga de integrar o

conectar aplicaciones, sistemas, entre otros.

Figura 5 - Pantalla que muestra función del Middleware. Fuente: Álvarez, P. & Bañares, J. (2006).

2.1.6. Modelo Vista Controlador (MVC)

El MVC se define como un patrón de arquitectura para el desarrollo de

aplicaciones software, cuya función es separar la lógica de negocio (Controlador)

de la interfaz de usuario (Vista) y del Modelo (atributos y métodos) de la

Page 64: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

64

aplicación, con el objetivo de facilitar el proceso por separado de los tres,

incrementando la reutilización y flexibilidad de las aplicaciones software.

MVC en aplicaciones web

• Vista: la página HTML.

• Controlador: código que obtiene datos dinámicamente y genera el

contenido HTML.

• Modelo: la información almacenada en una base de datos o en XML.

Figura 6 - Pantalla que representa el patrón MVC. Fuente: elaboración propia.

2.1.7. Bases de Datos

Los dispositivos móviles poseen sus propias bases de datos, denominadas

SQLite, para almacenar y gestionar su propia actividades, claro que la capacidad

que en ella se encuentra no es suficiente en el momento de construir aplicaciones

nativas donde se quiere almacenar gran cantidad de información que no son

propias del dispositivo, es decir, gestión de datos externos. Por lo tanto, es

necesario utilizar otras bases de datos que, estando conectadas con otros

sistemas, proveerán esa potencialidad y permitirán aprovechar los recursos que ya

poseen. La importancia de utilización de bases de datos externas (bien sea

Page 65: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

65

Oracle, MySQL, SQL, entre otras) permitirán la conexión con los dispositivos

móviles.

Figura 7 - Pantalla que representa una base de datos externa. Fuente: Appleon (s.f.).

2.1.8. Web Services

Hoy en día existen tecnologías que son tecnológicamente más avanzadas,

como los Web Services, que permiten invocar un método remoto en otra

plataforma, obteniendo un resultado en la invocación. REST y SOAP son dos de

los servicios web más conocidos. SOAP es más restrictivo en cuanto a tipos de

datos y mecanismos de trasporte. Aunque SOAP podría usarse en un dispositivo

móvil, no es recomendable debido a la sobrecarga que incluyen por sus

características y, por tanto, sería más adecuado utilizar REST para obtener un

mejor rendimiento y un diseño más sencillo. REST, por su parte, es una

arquitectura conocida por su sencillo diseño y sus prestaciones. Describe una

interfaz web simple utilizando peticiones HTTP y datos XML. Los datos devueltos

estarán en formato JSON o XML. Para invocar webservice a un REST desde una

aplicación Android se puede usar también la clase “HttpClient”.

Page 66: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

66

Figura 8 – Estructura de un webservice Rest. Fuente: http://blog.manishchhabra.com/2013/04/rest-and-soap-web-services-analogy/

Figura 9 – Estructura de un webservice Soap. Recuperado de : http://www.rightsoftcorp.com/?name=news&file=readnews&id=31

Page 67: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

67

Figura 10 – Estructura de un Web Service Soap vs. Rest. Fuente: http://www.rightsoftcorp.com/?name=news&file=readnews&id=31

A continuación se va a desarrollar un webservice RESTFul que nos devuelva la

hora del sistema en el que se encuentra desplegado. Para su desarrollo se

comenzará con el webservice:

@Path("saluda")

public class SaludaSW {

@Context

private UriInfo context;

/**

* Creates a new instance of SaludaSW

*/

public SaludaSW() {

}

/**

* Retrieves representation of an instance of aplicacion.SaludaSW

* @return an instance of java.lang.String

*/

Page 68: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

68

@GET

@Produces("text/plain")

public String getText() {

//TODO return proper representation object

Calendar c = Calendar.getInstance();

return "Hola, son las

"+c.get(Calendar.HOUR_OF_DAY)+":"+c.get(Calendar.MINUTE)+":"+

c.get(Calendar.SECOND);

}

/**

* PUT method for updating or creating an instance of SaludaSW

* @param content representation for the resource

* @return an HTTP response with content of the updated or created

resource.

*/

@PUT

@Consumes("text/plain")

public void putText(String nombre) {

}

}

Como se puede ver, se trata de un webservice RESTFul muy sencillo, en el que

a través del método GET devolverá en formato String la hora del sistema.

Ahora bien, se desarrollará la aplicación Android. Se comenzará por la parte

visual. En este caso, la aplicación es muy sencilla: habrá un botón para lanzar la

petición sobre el SW y una caja de texto deshabilitada en la que se mostrará el

resultado.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

Page 69: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

69

android:layout_height="fill_parent"

android:orientation="vertical" >

<TextView

android:id="@+id/textView1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/saludo"

android:textAppearance="?android:attr/textAppearanceLarge" />

<Button

android:id="@+id/enviar"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="@string/enviar" />

<EditText

android:id="@+id/salida"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:enabled="false"

android:inputType="text" >

<requestFocus />

</EditText>

</LinearLayout>

Una vez terminada la parte visual, se desarrollará la Actividad. Cuando el

usuario haga clic en el botón se lanzará la petición sobre el SW y se mostrará el

resultado en la caja de texto:

@Override

public void onClic(View arg0) {

// TODO Auto-generated method stub

TextView salida = (TextView) this.findViewById(R.id.salida);

Page 70: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

70

HttpClient httpclient = new DefaultHttpClient();

HttpGet request = new

HttpGet("http://192.168.30.12:8080/SaludaSW/resources/saluda");

ResponseHandler<String> handler = new BasicResponseHandler();

try {

String resultado = httpclient.execute(request, handler);

salida.setText(resultado);

}

catch (Exception e) {

Toast.makeText(this, "Error: "+e.getMessage(),

Toast.LENGTH_LONG).show();

}

httpclient.getConnectionManager().shutdown();

}

La aplicación quedaría como se muestra a continuación:

Figura 11 – Estructura de un webservice Rest. Fuente: elaboración propia.

Page 71: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

71

Ahora se expondrá otro ejemplo de Web Service, pero esta vez conectando con

una base de datos externa MySQL, la cual permitirá insertar y consultar datos

desde una aplicación móvil construida en Android:

Crear un webservice REST con Netbeans y consumiendo los recursos en

Android. Para crear un webservice REST, siga los siguientes pasos:

1. Una vez creado el proyecto, seleccione el módulo war y haga clic derecho

sobre él, luego siga la siguiente ruta: new/other/Web Services.

Page 72: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

72

2. Elija la opción RESTFUL Web Services from Patterns.

3. Pulse 2 veces Next. Luego visualizará la siguiente ventana:

Page 73: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

73

4. Configure los campos la ventana anterior así: en Resource Package

escriba el nombre Web Service y en el Class Name escriba el nombre de la

clase. Lo demás como está. Finalmente, haga clic en la opción Finish.

Cuando esté ubicado en la aplicación web, debe seguir los siguientes pasos

para configurar el Web Service, de tal forma que se pueda acceder desde el

dispositivo móvil:

1) Seleccionar el módulo war/Source Packages y hacer clic derecho sobre el

crear dos paquetes (package). Posteriormente, dar le el nombre a uno de Web

Services y al otro de Clases.

Page 74: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

74

2) Dentro del paquete Clases, debe crear dos clases: ReporteDatos y

LogicaWebService.

Ejemplo:

//Clase que permite seleccionar los datos de la base de datos, para luego ser visualizados en el dispositivo móvil. //Clase ReporteDatos import java.sql.*; public class ReporteDatos { Connection conn=null; PreparedStatement stmt; ResultSet rs; String salida=""; // private reporte_boletines public ReporteCursos() { } public String ConsultaCursos() { try { conn=Conexion.crearConexion(); stmt = (PreparedStatement)conn.prepareStatement("SELECT * FROM datos"); rs = stmt.executeQuery(); while (rs.next()) { String iddocumento=rs.getString(1); String nombre=rs.getString(2); salida=salida+"CEDULA No. :"+ iddocumento.toString()+"\n"+"NOMBRES:"+ nombre.toString()+"; } rs.close(); stmt.close(); conn.close();

Page 75: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

75

} catch (SQLException e) {} return salida; } } //Clase que permite consultar los datos de la base de datos //Clase LogigaWeb Services public class LogicaWebService { public String ConsultaDatos() { ReporteCursos RC = new ReporteDatos(); String RCD=RD.ConsultaDatos(); return RCD; } /* public String ConsultaCargaAcademica(int cidemple) { ReporteCargaAcademica RC = new ReporteCargaAcademica(); String Ret=RC.ConsultaCargaAcademica(cidemple); return Ret; } */ }

3) Configurar el Web Service así:

import Clases.LogicaWS; import javax.ws.rs.core.Context; import javax.ws.rs.core.UriInfo; import javax.ws.rs.PathParam; import javax.ws.rs.Consumes; import javax.ws.rs.PUT; import javax.ws.rs.Path; import javax.ws.rs.GET; import javax.ws.rs.Produces; @Path("ConexionDatos") public class ConexionDatos { @Context private UriInfo context; /** Creates a new instance of ConexionCursos */

Page 76: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

76

public ConexionDatos() { } @GET @Produces("application/xml") public String getXml() { String salida; LogicaWS LG=new LogicaWS(); salida=LG.ConsultaDatos(); return salida; } @PUT @Consumes("application/xml") public void putXml(String content) { } }

4) Vaya a la aplicación Android, cree una actividad y transcriba el siguiente código:

//Clase que permite controlar los datos de la base de datos public class conexion extends Activity { public static final String IP = "192.168.1.6"; public static final int puerto = 8089; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.conexion); } }

5) En un Layout construya la interfaz para el dispositivo móvil. A través de la misma se podrá insertar y consultar la información hacia y desde la base de datos (activity_main).

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity" >

Page 77: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

77

<TextView android:id="@+id/vista" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <EditText android:id="@+id/cidcurso" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignTop="@+id/textView1" android:ems="10" android:hint="Ingrese Id Curso" > <requestFocus /> </EditText> <EditText android:id="@+id/ccurso" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/vista" android:layout_marginTop="26dp" android:layout_toRightOf="@+id/vista" android:ems="10" android:hint="Ingrese el Curso" /> <Button android:id="@+id/BGuardar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/vista" android:layout_below="@+id/ccurso" android:text="Guardar" /> <Button android:id="@+id/BListar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBaseline="@+id/BGuardar" android:layout_alignBottom="@+id/BGuardar" android:layout_alignRight="@+id/cidcurso" android:layout_marginRight="19dp" android:text="Listar" /> <EditText android:id="@+id/editText1"

Page 78: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

78

android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/ccurso" android:layout_alignParentBottom="true" android:layout_marginBottom="109dp" android:layout_marginLeft="22dp" android:ems="10" /> </RelativeLayout>

Así se visualizará la interfaz:

Figura 12 - Interfaz de la aplicación. Fuente: elaboración propia.

6) Diseñar la Activity (actividad). Esta es la clase que permite programar los

eventos de la interfaz y almacenar los datos en la base de datos desde el

dispositivo móvil.

public class MainActivity extends Activity { Button bton1,btn2,btonVercurso; TextView salida; EditText cidcurso, ccurso; Intent i; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout. activity_main); cidcurso = (EditText)findViewById(R.id.cidcurso);

Page 79: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

79

ccurso = (EditText)findViewById(R.id.ccurso); bton1=(Button)findViewById(R.id.bton1); bton1.setOnClicListener(new OnClicListener(){ public void onClic(View arg0) { // TODO Auto-generated method stub GuradarCursos(); }}); btonVerAsignat=(Button)findViewById(R.id.btonVercurso); btonVerAsignat.setOnClicListener(new OnClicListener(){ public void onClic(View arg0) { // TODO Auto-generated method stub VerCursos(); }}); } //Activity que permite guardar los datos en la base de Datos desde Android public void GuardarCursos() { try { HttpClient client = new DefaultHttpClient(); HttpPost request = new HttpPost("http://"+conexion.IP+":"+conexion.puerto+"NombreServlet"); ArrayList<BasicNameValuePair> params = new ArrayList<BasicNameValuePair>(); params.add(new BasicNameValuePair("cidcurso", cidcurso.getText().toString())); params.add(new BasicNameValuePair("ccurso", ccurso.getText().toString())); UrlEncodedFormEntity ent = new UrlEncodedFormEntity(params, HTTP.UTF_8); request.setEntity(ent); HttpResponse response = client.execute(request); HttpEntity resEntity = response.getEntity(); String cadenaRespuesta = EntityUtils.toString(resEntity); Toast.makeText(this, "La información se guardó corectamente", Toast.LENGTH_SHORT).show(); } catch (Exception e) { Toast.makeText(this, "Error: "+e.getMessage(), Toast.LENGTH_SHORT).show(); }

Page 80: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

80

} public void VerCursos() { i=new Intent(creartablero.this, vercursos.class); startActivity(i); } }

7) Diseñar la Activity (Actividad). Esta es la clase que permite consultar los datos

almacenados en la base de datos desde el dispositivo móvil.

public class vercursos extends Activity { /** Called when the activity is first created. */ TextView salida; String URL,resultado; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.vercursos); salida = (TextView)findViewById(R.id.salida); try { URL="http://"+conexion.IP+":"+conexion.puerto+"/Siges- war/resources/ConexionCursos"; HttpClient httpclient = new DefaultHttpClient(); HttpGet request = new HttpGet(URL); ResponseHandler<String> handler = new BasicResponseHandler(); resultado= httpclient.execute(request, handler); salida.setText(resultado); } catch (Exception e) { Toast.makeText(this, "Error: "+e.getMessage(), Toast.LENGTH_SHORT).show(); //Toast.makeText(this, "Error: "+resultado.toString(), Toast.LENGTH_LONG).show(); } } } //Interfaz vercurso.xlm, asociada a la clase vercurso <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent"

Page 81: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

81

android:layout_height="fill_parent" android:layout_gravity="top" android:gravity="right" android:orientation="vertical"> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:weightSum="10" android:orientation="horizontal"> </LinearLayout> <TextView android:id="@+id/nlista" android:layout_width="314dp" android:layout_height="wrap_content" android:text="Listado de Cursos" android:layout_gravity="center_horizontal"/> <TextView android:id="@+id/salida" android:layout_width="322dp" android:layout_height="wrap_content" android:layout_weight="1.20" android:text="" /> </LinearLayout>

Así quedará la pantalla:

Figura 13 - Pantalla de consulta. Fuente: elaboración propia.

Page 82: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

82

8) Por último, no olvidar agregar las actividades creadas al Manifest y los

permisos.

Para agregar los permisos al Manifest:

Para agregar las Activities creadas al Manifest:

Page 83: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

83

CAPÍTULO III

Desarrollo de Aplicaciones Avanzadas

Utilización de Sensores

Page 84: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

84

3.1. Desarrollo de Aplicaciones Avanzadas

3.1.1. Introducción

Bajo la denominación de sensores se engloba un conjunto de dispositivos con

los que se puede obtener información del mundo exterior2 (en este conjunto no se

incluye la cámara, el micrófono o el GPS). Como se verá en este capítulo, todos

los sensores se manipulan de forma homogénea. Por lo tanto, se identificarán y se

conocerán los dispositivos de entrada de mayor novedad que incorpora Android y

con ellos, posteriormente, se implementarán diseños atractivos e interactivos para

el usuario final. Además, se mostrará cómo se emulan estos procesos y las

herramientas existentes para tal fin.

3.1.2. Sistema de Sensores

Lo primero que se debe tener en cuenta es la clasificación de los sensores que

están previstos en las tecnologías móviles:

• Sensores hardware: son aquellos que están basados en componentes físicos,

como el acelerómetro, el sensor de cambio de ángulo, el sensor de campos

geomagnéticos, etc.

• Sensores software: son aquellos sensores que aportan valores gracias a la

unión de varios sensores hardware o a través de cálculos matemáticos. Algunos

ejemplos de estos sensores son el sensor de aceleración lineal o el sensor de

gravedad. También permiten conocer la información que aportarán los principales

sensores con los que cuentan nuestros terminales.

2 Tomado de: http://www.androidcurso.com/index.php/tutoriales-android/36-unidad-5-entradas-en-android-teclado-pantalla-tactil-y-sensores/154-los-sensores.

Page 85: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

85

Tabla 1 - Descripción de Sensores.

SENSOR TIPO DESCRIPCIÓN

TYPE_ACCELEROMETER HW

Mide la fuerza de aceleración en m/s². Nos aporta tres valores (x, y, z), incluyendo la fuerza de gravedad

TYPE_AMBIENT_TEMPERATURE

HW Mide la temperatura en Grados Celsius

TYPE_GRAVITY SW/HW Mide la fuerza de la gravedad en m/s ². También devuelve tres valores (x, y, z)

TYPE_LIGHT HW Mide el nivel de luz ambiental en luxómetros (lx)

TYPE_MAGNETIC_FIELD HW Mide los niveles de campos geomagnéticos a través de los tres ejes (x, y, z)

TYPE_PROXIMITY HW Mide la distancia en cm que hay entre la pantalla del terminal y los objetos cercanos a ella

Fuente: http://www.aprendeandroid.com/l9/sensores_android.htm

Desde Android el acceso a la información que aportan los sensores se realiza a

través de las siguientes clases del paquete android.hardware3:

• SensorManager: esta clase se utiliza para crear instancias a los servicios

de sensores. Permite acceder al listado de sensores presentes en el

terminal, registrar sensores, eliminarlos, etc.

• Sensor: esta clase representa una instancia de un sensor determinado.

Permitirá obtener información del mismo.

• SensorEvent: esta clase representa un evento registrado por un sensor,

como un cambio en la luz ambiental, movimientos realizados sobre el

terminal, etc.

• SensorEventListener: esta interfaz posee dos métodos para recibir

notificaciones: onAccuracyChanged, que permitirá determinar que los

3 Tomado de: http://www.aprendeandroid.com

Page 86: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

86

niveles de recepción de eventos han cambiado, y onSensorChanged, que

permitirá determinar que el sensor ha obtenido un nuevo valor.

3.1.3. Listar los Sensores Asociados a un Terminal

Lo primero que se deberá hacer es verificar los sensores con los que cuenta

nuestro terminal.

SensorManager sm= (SensorManager) this.getSystemService(Context.SENSOR_SERVICE);

Esta línea de código permitirá crear una instancia de SensorManager. Hay que

recordar que esta clase da acceso a la identificación y acceso a los sensores. A

través del método getSensorList(int) se puede tener acceder a un sensor

determinado. Así, por ejemplo, si se quiere acceder al acelerómetro se pondría:

Sensor s = sm.getDefaultSensor(Sensor.TYPE_ACCELEROMETER); Iterator<Sensor> i = sm.getSensorList(Sensor.TYPE_ALL).iterator(); String resultado = new String(); while (i.hasNext()) { Sensor s = i.next(); resultado += "\nSensor: "+s.getName(); }

3.1.4. Ejemplos

En este caso, por ejemplo, se ha utilizado una variable de tipo String para

almacenar todos los sensores presentes en el terminal. Solo habrá que ver si esa

variable tiene contenido después del bucle para saber si se puede indicar el

conjunto de sensores que tiene el terminal al usuario o, por el contrario, indicarle

que su terminal no dispone de ningún sensor:

Sensor s = sm.getDefaultSensor(Sensor.TYPE_ACCELEROMETER); Iterator<Sensor> i = sm.getSensorList(Sensor.TYPE_ALL).iterator(); String resultado = new String(); while (i.hasNext()) { Sensor s = i.next();

Page 87: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

87

resultado += "\nSensor: "+s.getName(); } if (resultado.isEmpty()) salida.setText("No se ha encontrado ningún sensor"); else salida.setText(resultado);

Esta información se le ofrece en una Vista de tipo TextView. Si se prueba esta

pequeña fracción de código sobre el emulador, se observará que el emulador

indicará que no se encuentran sensores. Eso se debe a que el emulador por su

propia cuenta no es capaz de emular de listar los sensores. Para que la aplicación

funcione, se debe llevar a un dispositivo real.

Figura 2- Emulando sensores. Fuente: elaboración propia.

Para exportar una aplicación Android (apk) es necesario pulsar con el botón

derecho sobre el proyecto a exportar, luego hacer clic sobre la opción AndroidTols

y, posteriormente, exportar. Deberá aparecer un asistente sobre el que, en primer

lugar, se indicará el proyecto a exportar. Después se tendrá que crear las claves y

guardarlas (si previamente se tiene una, se podrá utilizar), como se evidencia en la

figura siguiente:

Page 88: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

88

Figura 3 – Llave de almacenamiento. Fuente: elaboración propia.

En la siguiente ventana, se llenan los datos de la aplicación. Seguidamente, se

indica el lugar donde se guardará el fichero apk y, por último, se tendrá el proyecto

listo para ser instalado en un dispositivo.

Figura 4 – Configuración de la llave de almacenamiento. Fuente: elaboración propia.

Page 89: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

89

Para que la instalación se pueda realizar es necesario que el dispositivo tenga

habilitada la restricción de instalar aplicaciones externas en el GooglePlay.

Solamente se tendrá que conectar la USB, transferir la aplicación a la memoria

interna del dispositivo o a la tarjeta de memoria externa y después, con una

aplicación de consulta de ficheros tipo “File Explorer”, se podrá instalar en nuestro

dispositivo.

Si lo que se desea subir al GooglePlay, se podrá imponer determinadas

restricciones para que solamente la puedan utilizar aquellos dispositivos que

cuenten, por ejemplo, con un acelerómetro. Este permiso se debe añadir al fichero

de Manifest de la aplicación:

<uses-feature android:name="android.hardware.sensor.accelerometer"

android:required="true" />

3.1.5. Ejercicios de Reflexión

Emulando los sensores

Si lo que se quiere es emular sensores en un AVD se necesitará tener una

aplicación como SensorSimulator, la cual se podrá descargar de la web en

OpenIntents:

http://code.google.com/p/openintents

Una vez descargado el SensorSimulator se procede a descomprimirlo. Dentro

de la carpeta que genera hay un directorio/bin en el que se encontrará un fichero

con extensión *.jar. Se trata de un programa realizado en Java que permitirá

mandarle diferentes valores de sensores emulados al AVD para ejecutarlo a través

de la línea de comandos: java –jar sensorsimulator-2.0-rc1.jar

Después se procede a instalar una aplicación de ejemplo sobre el AVD.

También se estará en el directorio/bin, entonces encontrará el

Page 90: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

90

SensorSimulatorSettings-2.0-rc1.apk. Para ser instalada en el AVD también se

puede recurrir al dispositivo. Se trata la carpeta donde se tiene descomprimido el

SDK del Android y dentro de esa carpeta se accederá a la carpeta platform-tools.

A través del programa adb y el modificador install se podrá instalar la aplicación en

el AVD: adb install [ruta al SensorSimulatorSettings-2.0-rc1.apk].

Cuando esté instalada se podrá ejecutar el AVD y acceder a la aplicación. Se

debe indicar una IP en la que está escuchando nuestro programa Java (ver figura

5).

Figura 5 – Entorno dispositivo virtual Android. Fuente: elaboración propia.

Page 91: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

91

Desde la aplicación del AVD se introducirá la IP:

Figura 6 – App que emula un sensor. Fuente: elaboración propia.

Una vez que introducida la IP, se podrá hacer clic en Testing y ver cómo

empieza a recibir datos de los sensores emulados. Al ir al dispositivo virtual del

programa Java, este enviará nuevos valores de los sensores emulados al AVD, tal

y como se ve en la siguiente imagen:

Figura 7 - App prueba de sensores. Fuente: elaboración propia.

Page 92: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

92

Para poder utilizar estos sensores emulados sobre nuestras aplicaciones

Android, se tendrá que hacer uso de una librería que se encuentra sobre el

directorio/lib del SensorSimulator. Esa librería trae nuevas implementaciones de

las principales Clases e Interfaces anteriormente vistas, como Sensor,

SensorEvent o SensorEventSimulator. El acceso a las principales clases se

realizará a través del paquete: org.openintents.sensorsimulator.hardware.

La forma de crear una instancia de tipo SensorManager se ve ligeramente

modificada, pasando a ser de la siguiente forma:

SensorManagerSimulator s = SensorManagerSimulator.getSystemService(this,

SENSOR_SERVICE);

Después de la creación del gestor de sensores (simulado en este caso), será

necesario conectarlo, para lo cual se utiliza s.connectSimulator(); Como lo que

se realiza en realidad es una conexión de red para emular los sensores, nos

pedirá que todas nuestras aplicaciones autoricen el uso de la red, por lo que será

necesario añadir al Manifest de las aplicaciones el siguiente permiso:

<uses-permission android:name="android.permission.INTERNET"/>

Una vez creada la instancia al gestor de sensores se puede proceder a registrar

aquellos que nos interesa utilizar. Generalmente, se registran en el método

onResume() y se eliminarán cuando se finalice la aplicación – método onStop().

3.1.6. Conclusiones

Es indispensable utilizar la herramienta SensorSimulator para poder probar e identificar

los sensores en un dispositivo móvil. Es de gran beneficio identificar los diferentes tipos

de sensores y sus propiedades para implementar y reconocer patrones que puedan

actuar en la construcción de apps móviles. Los sensores pueden ser utilizados para la

solución de problemas en diferentes áreas del conocimiento.

Page 93: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

93

3.2. Aplicación de Sensores

3.2.1. Introducción

Generalmente, los diferentes tipos de teléfonos, y refiriéndonos específicamente

a los teléfonos inteligentes, contienen una serie componentes software y hardware

como los sensores que de una u otra forma sirven para cumplir funciones

específicas en el aparato: por ejemplo, contestar y parar la llamada, acceder a otro

sistema, entre otros.

En la telefonía móvil, un acelerómetro es un sensor de movimiento, una función

que incorporan prácticamente todos los teléfonos de última generación por la cual

al mover el terminal la imagen de pantalla también se mueve. Así, si tenemos el

teléfono en posición vertical, la imagen se adapta a esta visión, y si la tenemos en

horizontal, se expande, lo cual resulta muy cómodo para ver imágenes y para

navegar por Internet.

Este tipo de sensores aplicados a los juegos permiten una interesante evolución, ya

que se puede conducir con el teléfono a modo de volante o guiar una bola por un laberinto

como si fuera una caja real.

Otras aplicaciones prácticas de los sensores son la de responder a determinadas

órdenes según lo que se haga. Así, si entra una llamada o llevamos activo el reproductor

y necesitamos silencio inmediato, basta con girar el dispositivo y se calla. También es

factible programar una alarma y cuando suena apagarla sencillamente pasando la mano

por encima (en este caso, el sensor va integrado en la cámara)4.

El siguiente capítulo tiene como objetivo la construcción de sensores de forma

específica, como de proximidad y lumínicos, y la comprensión de la estructura de los

acelerómetros como insumo para implementar en dispositivos móviles inteligentes.

4 Tomado de: https://tomatek.wordpress.com/2008/11/24/que-es-acelerometro-o-sensor-de-movimiento/

Page 94: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

94

3.2.2. Marco Conceptual

Teniendo en cuenta que los sensores están compuestos tanto de componentes

software como de hardware, los podemos clasificar en tres tipos5:

- Sensores de movimiento: estos sensores miden las fuerzas de

aceleración y fuerzas de rotación a lo largo de tres ejes. En esta categoría

incluimos los acelerómetros, sensores de gravedad, giroscopios y sensores de

rotación del vector.

- Sensores ambientales: estos sensores miden diversos parámetros

ambientales, como la temperatura del aire ambiente y la presión, la iluminación, y

la humedad. En Esta categoría se encuentran los barómetros, fotómetros y

termómetros.

- Sensores de posición: estos sensores miden la posición física de un

dispositivo. Esta categoría incluye los sensores de orientación y magnetómetros.

- Acelerómetro: se emplea para medir vibraciones y oscilaciones en muchas

máquinas e instalaciones, así como para el desarrollo de componentes

o herramientas. Los acelerómetros son portátiles y sus valores medidos se pueden

almacenar parcialmente.

3.2.3. Parámetros que Proporciona

La medición proporciona los siguientes parámetros: aceleración de la vibración,

velocidad de vibración y variación de vibración. De este modo se caracterizan las

vibraciones con precisión. Los acelerómetros son portátiles y sus valores medidos

se pueden almacenar parcialmente. Los acelerómetros son una ayuda in situ para

el profesional, pues pueden realizar las mediciones exigentes en cada campo de

la industria para resolver el problema técnico que exista6.

5 Tomado de: http://www.aprendeandroid.com/l9/sensores_android.htm. 6 Tomado de: http://www.ecured.cu/Aceler%C3%B3metro

Page 95: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

95

3.2.4. El Acelerómetro en los Móviles

Casi todos conocemos la Wii, la consola de Nintendo que utiliza un mando que

podemos mover en el aire para controlar al personaje en pantalla. Pues bien, en su

interior se encuentra un acelerómetro para detectar esos movimientos. También muchas

cámaras de fotos, al menos los modelos actuales, incluyen un acelerómetro con el que es

posible detectar si se hace la foto en horizontal y en vertical, grabando ese dato en la foto

y permitiendo verla con su orientación correcta. Incluso, cuando la estamos viendo en la

cámara trasera la foto puede girarse automáticamente dependiendo de la posición de

esta.

De hecho, el N95 dispone de un acelerómetro que le permite marcar la orientación de

las fotos, muchos usuarios han desarrollado sus propias aplicaciones que utilizan este

sensor para hacer cosas como RotateMe, que permite girar la pantalla de forma

automática, controlar un coche a radiocontrol o agitar el móvil para leer un SMS. Pero el

Nokia N95 no es el único dispositivo que dispone de acelerómetro. Otro de los famosos es

el iPhone, que permite rotar automáticamente la pantalla dependiendo de la aplicación en

la que estemos. Sin olvidar, además, de modelos como el Sony Ericsson W910, con la

funcionalidad Shake Control, con la cual es posible controlar la reproducción de la

música y saltar canciones agitando el teléfono. Apartándonos un poco de los móviles,

muchos portátiles también disponen de un acelerómetro para detectar caídas, con lo que

pueden aparcar los cabezales del disco duro para evitar daños mayores a los datos que

se tengan almacenados en este7.

3.2.5. Ejemplos

El acelerómetro, como se comentó en el apartado anterior, permite la medición de la

fuerza de aceleración en tres ejes (x, y, z). Se mostrará el ejemplo a través del AVD, para

luego ser emulados y gestionados los sensores, por lo cual se deberá tener en presente

todas las restricciones que se exponen en este capítulo.

Para poner en funcionamiento el acelerómetro, se creará una app donde se diseñará

una interfaz visual con tres cajas de texto. A cada caja de texto se le dará un identificador,

7 Tomado de: http://www.ecured.cu/Aceler%C3%B3metro

Page 96: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

96

por ejemplo X, Y y Z y se utilizarán para mostrar la aceleración que emitida por el sensor

del dispositivo en cada coordenada. El código XML deberá se escrito como sigue:

Código XML

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/saludo" android:textAppearance="?android:attr/textAppearanceLarge" /> <LinearLayout android:id="@+id/linearLayout1" android:layout_width="match_parent" android:layout_height="wrap_content" > <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="@string/x" android:textAppearance="?android:attr/textAppearanceSmall" /> <EditText android:id="@+id/x" android:layout_width="50dp" android:layout_height="wrap_content" android:layout_weight="1.73" android:editable="false" android:enabled="false" android:inputType="numberSigned" > </EditText>

Page 97: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

97

</LinearLayout> <LinearLayout android:id="@+id/linearLayout2" android:layout_width="match_parent" android:layout_height="wrap_content" > <TextView android:id="@+id/textView3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.35" android:text="@string/y" android:textAppearance="?android:attr/textAppearanceSmall" /> <EditText android:id="@+id/y" android:layout_width="50dp" android:layout_height="wrap_content" android:layout_weight="0.64" android:editable="false" android:enabled="false" android:inputType="numberSigned" /> </LinearLayout> <LinearLayout android:id="@+id/linearLayout3" android:layout_width="match_parent" android:layout_height="wrap_content" > <TextView android:id="@+id/textView4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.54" android:text="@string/z" android:textAppearance="?android:attr/textAppearanceSmall" />

<EditText android:id="@+id/z" android:layout_width="50dp" android:layout_height="wrap_content" android:layout_weight="1" android:editable="false" android:enabled="false" android:inputType="numberSigned" /> </LinearLayout> </LinearLayout>

Page 98: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

98

En esta Actividad se creará una instancia al gestor de sensores y luego se conectará:

SensorManagerSimulator sms = SensorManagerSimulator.getSystemService(this,

SENSOR_SERVICE);

sms.connectSimulator();

Por último, registrará el acelerómetro:

sms.registerListener(this, sms.getDefaultSensor(Sensor.TYPE_ACCELEROMETER),

SensorManager.SENSOR_DELAY_FASTEST);

Para que todo funcione sin inconvenientes, se debe tener en cuenta los siguientes

elementos:

• Habrá que añadir la librería del SensorSimulator para poder utilizar los

sensores simulados.

• Habrá que permitir las conexiones de red en la aplicación.

• Habrá que hacer que la Actividad implemente la Interfaz

SensorEventListener para que se pueda implementar los métodos de

gestión de eventos.

Después se debe rellenar el método que permite detectar cuándo se ha

producido un cambio en el acelerómetro y se imprimirán los valores x, y, z en cada

caja de texto.

Para ejecutar la aplicación correctamente será necesario ejecutar primero la

aplicación Java que será la que le proporcione los datos al AVD. Al final quedaría

tal y como se ve en la siguiente imagen:

public void onSensorChanged(SensorEvent event) { // TODO Auto-generated method stub float[] valores = event.values; TextView x = (TextView) this.findViewById(R.id.x); TextView y = (TextView) this.findViewById(R.id.y); TextView z = (TextView) this.findViewById(R.id.z); x.setText(String.valueOf(valores[0])); y.setText(String.valueOf(valores[1])); z.setText(String.valueOf(valores[2])); }

Page 99: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

99

Figura 8 – Sensor emulado. Fuente: elaboración propia.

3.2.6. Ejercicios de reflexión

Implementación de un Sensor de Proximidad

Es un sensor, generalmente hardware, que permite conocer la distancia (en cm)

a la que se encuentra un objeto. Normalmente todos los dispositivos actuales

presentan este tipo de sensor y lo utilizan, entre otras cosas, para conocer cuándo

un usuario está hablando con su terminal (en este caso, tendrá la oreja cerca del

sensor, en la pantalla normalmente) y podrá desactivar la pantalla para ahorrar

batería. Cuando retire la oreja, volveremos a encender la pantalla para que pueda

ver su contenido.

Page 100: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

100

En lo que a la programación se refiere, se va a construir un programa que

permita, a través del emulador, mostrar los valores recogidos por este sensor. Hay

sensores que solamente detectan dos tipos de estados: cerca y lejos, mientras

que otros detectan, como se comentaba, la distancia al objeto.

Para probar lo anterior, se creará un app móvil en la que en la parte visual

(Vista) se tendrá una caja de texto que mostrará la distancia.

Posteriormente, en la actividad, al igual que se hizo con el ejercicio anterior,

habrá que obtener acceso al gestor de sensores del simulador y conectarlo.

SensorManagerSimulator sms =

SensorManagerSimulator.getSystemService(this,

SENSOR_SERVICE);

sms.connectSimulator();

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/saludo" android:textAppearance="?android:attr/textAppearanceMedium" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/intro" android:textAppearance="?android:attr/textAppearanceSmall" /> <EditText android:id="@+id/salida" android:layout_width="match_parent" android:layout_height="wrap_content" android:enabled="false" android:inputType="number" > <requestFocus /> </EditText> </LinearLayout>

Page 101: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

101

Hay que registrar el sensor; en este caso, se registrará el sensor de proximidad.

sms.registerListener(this, sms.getDefaultSensor(Sensor.TYPE_PROXIMITY),

SensorManager.SENSOR_DELAY_FASTEST);

De igual forma, la Actividad tendrá que implementar la Interface

SensorEventListener para que pueda registrar los eventos generados por el

sensor de proximidad. En este caso es de interés gestionar los datos ofrecidos por

el método onSensorChange(SensorEvent) que será al que se acceda cada vez

que se registre un nuevo valor para dicho sensor.

@Override

public void onSensorChanged(SensorEvent event) {

// TODO Auto-generated method stub

float valor[] = event.values;

TextView salida = (TextView) this.findViewById(R.id.salida);

salida.setText(String.valueOf(valor[0]));

}

Así pues, el sensor de proximidad solamente devolverá un valor, que será la

distancia en cm al objeto más cercano. Este será el valor que se dejará en la caja

de texto. Para poder ejecutarlo correctamente hay que recordar las restricciones

que tiene el emulador de sensores, por lo que será necesario nuevamente:

• Añadir la librería proporcionada por el emulador de sensores.

• Indicar que la aplicación se puede conectar a Internet, debido a que la

emulación de los sensores se realiza a través de una conexión en red con

el programa Java, que se describió anteriormente.

Page 102: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

102

Por otro lado, al arrancar el SensorSimulator se tendrá que habilitar el sensor

de proximidad, de acuerdo a la siguiente imagen:

Figura 9 – Configuración sensor de proximidad. Fuente: elaboración propia.

Sobre este SensorSimulator se accede a la pestaña de parámetros de

sensores, en la que se podrá darvalor al sensor de proximidad. En este caso se

puede establecer el valor máximo detectado (por defecto 10cm.), si el sensor

recoge solamente los valores cerca/lejos, y cuando se ponga un valor en el valor

random comenzará a generar valores aleatorios que el app detectará.

Page 103: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

103

Figura 10 – Configuración sensor de proximidad. Fuente: elaboración propia.

Por último, se ejecutará el programa:

Figura 11 – Ejecución de la aplicación. Fuente: elaboración propia.

Page 104: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

104

Page 105: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

105

GLOSARIO

Directorio bin: ahí se encuentran todos los archivos generados por la propia

app.

Directorio layout: ahí se encuentran las distintas interfaces de la aplicación, es

decir, los archivos xml asociados a las activities.

Drawable: carpeta donde se alojan todas las imágenes de la app.

Layout: directorio donde se encuentran las distintas interfaces.

Manifest: archivo de configuración de Android.

Toast: objeto que tiene con función mostrar un mensaje.

SRC: directorio donde se alojan los archivos Android.

URL: Localizador de Recurso Universal.

Values: carpeta con los xml de contenido de la app.

Http: protocolo de hipertexto.

Web Services: servicio que permite la comunicación y conectividad entre

aplicaciones.

Rest: tipo de Web Service que realiza su conexión a través de http.

Activity: aquí se encuentran todos los archivos generados por la propia app.

Page 106: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

106

Manifest: archivo de configuración de Android.

Servlets: es un tipo de clase java que se utiliza para atender servidores web.

XML: Lenguaje de Marca Extensible. Se utiliza en la configuración de

servidores web.

Intent: parámetro que se utiliza para navegar entre actividades de Android.

MVC: Modelo Vista Controlador. Es un patrón para la implementación de

aplicaciones software.

Middleware: aplicación software para conectar dos sistemas o aplicaciones. Se

le denomina software de la mitad.

Acelerómetro: permite medir la fuerza de aceleración en tres ejes (x, y, z).

Como generalmente se trabajará con el AVD, el proceso de gestión de los

sensores será emulado.

Apk: extensión de las aplicaciones de Android.

AVD: Dispositivo Virtual de Android.

Luxómetro: calcula la cantidad de luz que emite un dispositivo móvil.

Market de Google: (google play) rspacio dispuesto por Google para subir las

aplicaciones móviles.

OpenIntents: aplicación software para emular los sensores.

Page 107: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

107

Sensor: esta clase representa una instancia de un sensor determinado.

Permitirá obtener información del mismo.

Sensor de luz: se utiliza principalmente para ajustar automáticamente el brillo

de la pantalla a las condiciones ambientales de cada momento y así ahorrar

batería.

Sensor de proximidad: este sensor, generalmente hardware, permite conocer

la distancia (en cm) a la que se encuentra un objeto.

SensorManager: esta clase se utiliza para crear instancias a los servicios de

sensores. Permite acceder al listado de sensores presentes en el terminal,

registrar sensores o eliminarlos.

Page 108: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

108

Page 109: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

109

Bibliografía

Ableson, F., & Sen, R. (2010). Android Guía para desarrolladores. Madrid:

Anaya Multimedia.

Danieleme. (2012). Android WebView: incrustar un navegador en nuestras

apps. Disponible en: https://danielme.com/2012/05/19/android-webview-incrustar-

un-navegador-en-nuestras-apps/

El Android libre. (2015). Qué es WebView y por qué tengo que actualizarlo.

Disponible en: http://www.elandroidelibre.com/2015/06/que-es-webview-y-por-que-

tengo-que-actualizarlo.html

Gramlich, N. (2010). Android programming. Disponible en:

http://andbook.anddev.org/files/andbook.pdf

Haseman, C. (2008). Android Essentials. Estados Unidos: Apress.

Hermosa Programación. (2014). Comunicar actividades a través de intents en

Android, Disponible en: http://www.hermosaprogramacion.com/2014/09/desarrollo-

android-intents/

Tutorial de listas y adaptadores en Android. Disponible en:

http://www.hermosaprogramacion.com/2014/10/android-listas-adaptadores/

Murphy, M.L. (2010). Android Programming Tutorials. Estados Unidos:

CommonsWare.

Revelo, J. (2014). Tutorial de listas y adaptadores en Android. Disponible en:

http://www.hermosaprogramacion.com/2014/10/android-listas-adaptadores/

Page 110: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

110

Tu programación. (s.f.). Estructura de una aplicación Android. Disponible en:

https://developer.android.com/guide/topics/ui/notifiers/toasts.html

______. (s.f.). ¿Qué es el Android manifest? Disponible en:

http://www.tuprogramacion.com/glosario/que-es-el-android-manifest/

______. (s.f.). Estructura de una aplicación Android. Disponible en:

http://www.tuprogramacion.com/programacion/estructura-de-una-aplicacion-

android/

Universidad de Valladolid. (s.f.). Sistemas distribuidos: hilos en Java. Disponible

en: http://www.infor.uva.es/~fdiaz/sd/doc/hilos

Ableson, F., & Sen, R. (2010). Android: Guía para desarrolladores. España: Anaya

Multimedia.

Álvarez, P. & Bañares, J. (2006). Conceptos y estándares de arquitecturas

orientadas a servicios web [figura]. Recuperado de

http://iaaa.cps.unizar.es/docencia/SWD/2.Middleware.pdf

Appleon. (s.f.). Pantalla que representa una base de datos externa [figura].

Disponible en: http://www.appleon.com/index.php?modulo=BBDD

Gramlich, N. (2010), Andbook, And-dev.org.

Haseman, C. (2008). Android Essentials. Estados Unidos: Apress.

Murphy, M.L. (2010). Android Programming Tutorials. Estados Unidos:

CommonsWare.

Pavón, P. (2008).El patrón Modelo-Vista-Controlador (MVC). Disponible en:

https://www.fdi.ucm.es/profesor/jpavon/poo/2.14.MVC.pdf

Page 111: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

111

Cuello, J., & Vittone, J. (2013). Diseño de Apps para Móviles. Disponible en: http://appdesignbook.com/es/contenidos/las-aplicaciones/

Tomás, J. (201). Los sensores-Diploma de Especialización en desarrollo de

aplicaciones para Android. Disponible en: http://www.androidcurso.com/index.php/tutoriales-android/36-unidad-5-

entradas-en-android-teclado-pantalla-tactil-y-sensores/154-los-sensores Tomatek. (2008). Qué es: acelerómetro o sensor de movimiento. Disponible en: https://tomatek.wordpress.com/2008/11/24/que-es-acelerometro-o-sensor-de-

movimiento/ Aprende Android. (2014). Los sensores en nuestros teléfono Android.

Disponible en: http://www.aprendeandroid.com/l9/sensores_android.htm EcuRed. (s.f.). Acelerómetro. Disponible en:

http://www.ecured.cu/Aceler%C3%B3metro

Page 112: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

112

Page 113: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

113

Page 114: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

114

Page 115: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

115

Page 116: Editorial Universidad Manuela Beltrán · desarrollo y buen diseño de una aplicación para dispositivos móviles. También se analizarán y desarrollarán temáticas como los intent,

116

978-958-5467-12-5