1. Code
  2. Mobile Development
  3. Android Development

SDK de Android: Crea una aplicación de escaneo de libros

Con la biblioteca ZXing, puedes crear aplicaciones Android con la funcionalidad de escanear códigos de barras. En SDK de Android: Crear un lector de códigos de barras, implementamos la lectura básica de códigos de barras con la biblioteca en una aplicación simple. En esta serie de tutoriales, nos basaremos en lo que aprendimos para crear una aplicación que escaneará libros y obtendrá información relacionada sobre ellos desde la API de Google Books.
Scroll to top

Spanish (Español) translation by Steven (you can also view the original English article)

Con la biblioteca ZXing, puedes crear aplicaciones Android con la funcionalidad de escanear códigos de barras. En SDK de Android: Crear un lector de códigos de barras, implementamos la lectura básica de códigos de barras con la biblioteca en una aplicación simple. En esta serie de tutoriales, nos basaremos en lo que aprendimos para crear una aplicación que escaneará libros y obtendrá información relacionada sobre ellos desde la API de Google Books.

Aquí hay una vista previa de la aplicación en la que estaremos trabajando:

Book Scanner AppBook Scanner AppBook Scanner App

Esta serie sobre la creación de una aplicación para escanear libros consta de tres partes:

En esta primera parte de la serie, configuraremos la aplicación para escanear; podrás utilizar la mayor parte del código del tutorial anterior, con los cambios necesarios que se describen a continuación. También obtendremos la configuración para acceder a la API de Google Books. En la segunda parte crearemos el resto de la interfaz de usuario y realizaremos una búsqueda de libros a través de la API de Google Books. En la parte final, obtendremos los resultados de la búsqueda de libros y los presentaremos dentro de la interfaz.

Cuando se ejecuta la aplicación, el usuario podrá escanear libros haciendo clic en un botón. Cuando la aplicación recibe el resultado del escaneo, verificará que el formato sea EAN. Si es así, la aplicación creará una consulta de búsqueda para Google Books que intentará ejecutar. Cuando la aplicación recibe los resultados de búsqueda de libros en formato JSON, seleccionará detalles particulares y los mostrará dentro de la interfaz. Usaremos dos clases internas de AsyncTask, una para obtener los resultados de la búsqueda del libro y otra para obtener una imagen en miniatura del libro, en caso de que esté disponible. También crearemos una segunda clase con una vista web en ella, en la que usaremos la API del visor integrado para mostrar una vista previa del libro escaneado, nuevamente si hay uno disponible. Utilizaremos un archivo de recursos para la vista web y proporcionaremos un enlace a la página web del libro en el sitio de Google Books. La aplicación final también incluirá pasos para preservar los datos que se muestran en los cambios de estado.


1. Crear el proyecto del escáner

Paso 1

Si aún no has completado el tutorial anterior SDK de Android: Crear un lector de código de barras, es posible que desees hacerlo primero. Si completaste ese tutorial, puedes crear una nueva aplicación para este tutorial o modificar el código en la aplicación de escáner que ya creaste. No volveremos a explicar la funcionalidad descrita en ese primer tutorial, pero ejecutaremos el código necesario para la aplicación de escaneo de libros.

Si estás trabajando con la aplicación que creaste durante el tutorial anterior, es posible que puedas omitir algunos de los pasos a continuación; solo léelos y asegúrate de tener el código descrito. Usaremos el botón de escaneo como antes, pero no necesitamos los dos "Text Views" que creamos para esa aplicación, ya que usaremos diferentes vistas para mostrar la información del libro; puedes dejar la mayor parte de la clase Activity como está, pero debes reemplazar el contenido del archivo XML con el código que se indica a continuación.

Si estás creando un nuevo proyecto de Android, deja que Eclipse cree el archivo Activity en blanco para ti. Crea un segundo paquete en tu proyecto para las clases de ZXing como hicimos en el tutorial anterior, dándole al paquete el nombre "com.google.zxing.integration.android" y copiando los dos escaneos a través de las clases Intent en él. En tu clase principal Activity, agrega las siguientes declaraciones de importación (omitiendo cualquiera que Eclipse ya haya agregado):

1
import android.os.Bundle;
2
import android.app.Activity;
3
import android.content.Intent;
4
import android.util.Log;
5
import android.view.View;
6
import android.view.View.OnClickListener;
7
import android.widget.Button;
8
import android.widget.Toast;
9
10
import com.google.zxing.integration.android.IntentIntegrator;
11
import com.google.zxing.integration.android.IntentResult;

Agregaremos código a la clase principal Activity más adelante en este tutorial y a lo largo de la serie, además de crear una segunda clase y agregar algunos archivos de recursos, incluido el diseño. Por el momento, una nueva clase Activity en blanco debe contener el contenido predeterminado, configurando el archivo de diseño creado cuando Eclipse creó el proyecto:

1
protected void onCreate(Bundle savedInstanceState) {
2
	super.onCreate(savedInstanceState);
3
	setContentView(R.layout.activity_main);
4
}

Paso 2

Comencemos a configurar nuestra interfaz de usuario. Abre tu archivo de diseño y reemplaza el contenido con el siguiente diseño relativo incluido en una vista de desplazamiento:

1
<ScrollView xmlns:android="https://schemas.android.com/apk/res/android"
2
	android:layout_width="fill_parent"
3
	android:layout_height="fill_parent"
4
	android:background="#ffffffff" >
5
6
	<RelativeLayout
7
		android:layout_width="match_parent"
8
		android:layout_height="wrap_content"
9
		android:padding="10dp" >
10
	</RelativeLayout>
11
12
</ScrollView>

Dentro del diseño relativo, agrega un botón para escanear como hicimos en el tutorial anterior:

1
<Button android:id="@+id/scan_button"
2
	android:layout_width="wrap_content"
3
	android:layout_height="wrap_content"
4
	android:layout_centerHorizontal="true"
5
	android:padding="10dp"
6
	android:background="#ff333333"
7
	android:textColor="#ffcccccc"
8
	android:text="@string/scan"
9
	/>

Agrega la cadena especificada a tu archivo XML "res/values/strings":

1
<string name="scan">Scan a Book</string>

Paso 3

Pasemos a la clase Activity. Si estás trabajando con el código que creaste para el tutorial de escaneo anterior, puedes eliminar todas las líneas que hacen referencia a las dos Text Views que usamos en Activity (formatTxt y contentTxt). De lo contrario, puedes dejar la clase Activity como estaba cuando completaste ese tutorial.

Si estás creando la aplicación desde cero, extiende la línea de declaración de apertura de la clase Activity para implementar la interfaz de escucha de clics:

1
public class MainActivity extends Activity implements OnClickListener

Agrega el esquema del método onClick a tu clase:

1
public void onClick(View v){
2
//handle clicks	

3
}

En la parte superior de la declaración de clase, antes de onCreate, agrega una variable de instancia para el botón de escaneo:

1
private Button scanBtn;

Dentro de onCreate, obtén una referencia al botón después del código existente:

1
scanBtn = (Button)findViewById(R.id.scan_button);
2
scanBtn.setOnClickListener(this);

Paso 4

Iniciemos el escaneo cuando el usuario presione el botón, como hicimos la última vez. En el método onClick, verifica los clics en el botón de escaneo:

1
if(v.getId()==R.id.scan_button){
2
	IntentIntegrator scanIntegrator = new IntentIntegrator(this);
3
	scanIntegrator.initiateScan();
4
}

Como antes, estamos escaneando a través de Intent, que le pedirá al usuario que descargue el escáner de código de barras ZXing si aún no lo tiene instalado. El resultado del escaneo se devolverá a onActivityResult, así que agrégalo a tu clase:

1
public void onActivityResult(int requestCode, int resultCode, Intent intent) {
2
	//retrieve result of scanning - instantiate ZXing object

3
	IntentResult scanningResult = IntentIntegrator.parseActivityResult(requestCode, resultCode, intent);
4
	//check we have a valid result

5
	if (scanningResult != null) {
6
		//get content from Intent Result

7
		String scanContent = scanningResult.getContents();
8
		//get format name of data scanned

9
		String scanFormat = scanningResult.getFormatName();
10
	}
11
	else{
12
		//invalid scan data or scan canceled

13
		Toast toast = Toast.makeText(getApplicationContext(), 
14
				"No book scan data received!", Toast.LENGTH_SHORT);
15
		toast.show();
16
	}
17
}

Esto es prácticamente idéntico al código que usamos en el último tutorial, excepto por la referencia a los dos Text Views que hemos eliminado. Generaremos información sobre libros escaneados en elementos de la interfaz de usuario que crearemos más adelante en la serie. Por el momento, puedes agregar la siguiente línea a tu método onActivityResult, dentro del bloque if, generando el contenido y el formato del escaneo en el registro si deseas ejecutar la aplicación mientras tanto:

1
Log.v("SCAN", "content: "+scanContent+" - format: "+scanFormat);

2. Configurar el acceso a la API de Google Books

Paso 1

Vamos a utilizar la API de Google Books para obtener información sobre los libros escaneados por el usuario. Inicia sesión en tu cuenta de Google y navega hasta la Consola de API. Selecciona "Servicios" y desplázate dentro de la lista hasta encontrar "Books API" o "API de Libros". Haz clic para activar la API en tu cuenta, aceptando los términos si se te solicita.

Books APIBooks APIBooks API

Necesitarás tu clave de API para acceder a la API de los libros en la aplicación. En tu consola de la API de Google, selecciona "Acceso a API". Si ya tienes una clave, debería aparecer en "Clave para aplicaciones de navegador". De lo contrario, puedes crear una seleccionando "Crear nueva clave de navegador" y siguiendo las instrucciones. Copia tu clave para una referencia posterior; la usaremos en el próximo tutorial.

Paso 2

Para utilizar el servicio de la API de Google Books, necesitaremos acceso a Internet, así que finalmente agrega el permiso al manifiesto de tu aplicación:

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

Conclusión

En esta primera parte de la serie, hemos configurado la aplicación para usar la funcionalidad de escaneo a través de ZXing. También hemos obtenido una clave API para acceder a los datos de Google Books. En la siguiente parte, crearemos una consulta de búsqueda de libros y la ejecutaremos. Durante la segunda y tercera parte de la serie, buscaremos y obtendremos información sobre los libros escaneados. Verifica la descarga del código fuente para asegurarte de tener todo en el lugar correcto antes de completar la siguiente parte.