Call Directory Ionic – ¡Qué es y cómo se usa!

Call Directory Ionic – ¡Qué es y cómo se usa!
5 (100%) 2 vote[s]

En el tutorial de hoy hablaremos de cómo podemos acceder al registro de llamadas / agregar contactos (Call Directory) de nuestro dispositivo desde la plataforma ionic. Algo que, en determinadas aplicaciones, puede llegar a ser extremadamente útil. También comentar que la capa de abstracción que nos ofrece Ionic sobre el código nativa cumple con los standares de seguridad sobre este tipo de accesos. Así que cojonudo 🙂

Ionic, ¿Qué es un cómo se usa?

Yepaaa, muy buenas majo lector y guapa lectora. Aquí me pongo otra vez, a los mandos de este nuevo tuto en el que hablaremos de un componente, que no muy usado, pero si muy potente para realizar determinadas tareas.

La verdad es que ya tenía ganas de ponerme las pilas, llevo escribiendo ya unos cuantos días a piñón para preparar contenido para ComoProgramar.net y no dejaros a medias con nada. Así que estar atentos a nuevas actualizaciones, que ya verás que caña lo que estoy preparando.

Visto esto, vamos al lio, que es lo que te interesa.

¿Qué es el Call Directory o directorio de llamadas / contactos?

Bueno, pues si eres un poco espabilado, que, seguro que lo eres, ya sabrás de lo que estamos hablando. Pero para los que no… se trata de un acceso directo a un listado de llamadas y contactos que tenemos que realizar. Digamos que un toDoList de llamadas pendientes más o menos… y que también nos permite editar nuestro agenda de contactos. Te aconsejo que lo pruebes para dar una opinión tú mismo.

Nota: De momento esta componente solo es funcional con IOS. Para acceder al log de Android tendremos que esperar un poquito a ver si adaptan el componente. La verdad, desconozco si es posible hacerlo o no.

Instalación del componente Call Directory

En primer lugar (al final haré un copia pega 🙂 ) tenemos que importar las dependencias e instalar el plugin en nuestra aplicación. Para ello lo vamos hacer de la siguiente manera:

$ cordova plugin add cordova-plugin-call-directory --variable EXT_NAME="Cordova-Directory" --variable ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES="NO"
$ npm install --save @ionic-native/call-directory

 

Las variables EXT_NAME y EMBED_SWIFT_STANDARD_LIBRARIES de momento las vamos a dejar como están porque son configuración de sistema que no vamos a tocar ahora mismo. Solo te digo que EXT_NAME se trata del identificador que Swift va a usar como identificador para el acceso a esta información y el segundo para acceder a las librerías nativas de sistema.

Vale, y el último punto que tenemos que realizar antes de poder dar uso al directorio de llamadas es incluir las dependencias de este en nuestro proyecto. Para ello basta con hacerlo de la siguiente manera:

providers: [
    ...
    CallDirectory
    ...
]

 

¿Ves qué sencillo es? Basta con que llamemos al componente en el apartado providers de nuestro appmodule.ts y ya está listo para usar.

Bien, pues ya estamos en condiciones de ponernos manos a la obra.

 

Configuración del componente Call Directory en Ionic

Como todos los tutoriales tienen “la misma” estructura no me podía dejar aislado la configuración. ¿Pero sabes una cosa? Este módulo no la necesita. ¿Cómo? No, no, no necesita configuración basta con hacer lo que hemos hecho 🙂

 

¿Cómo usar el directorio de llamadas?

Vale, ahora sí que tenemos algo de chicha aquí. Como podrás comprobar, no se trata de un componente complejo ni extenso. Vale para lo que vale y para nada más

Aquí un ejemplo de uso:

import { CallDirectory } from '@ionic-native/call-directory';


constructor(private callDirectory: CallDirectory) { }


let items = [{label: "Hello", number: "123"}];
this.callDirectory.addIdentification(items)
  .then((res: any) => console.log(res))
  .catch((error: any) => console.error(error));

this.callDirectory.reloadExtension()
  .then(res: string) => console.log(res))
  .catch((error: any) => console.error(error));

 

 

Como vemos en el código, hemos inyectado la dependencia en el constructor para poder usarlo en nuestra clase.

A continuación, hemos creado un array en el que los objetos que contiene tienen dos campos. Por un lado, el label que es el campo que aparecerá en el contacto y por otro lado el número. ¿Sencillo no? Ah! Y también decir, que al ser un array podemos meter todos los que queramos… Y ahora llamamos al método “addIdentification” de nuestra clase “callDirectory” para agregar todo a la lista.

Después de haber agregado todo, basta con que llamemos a la función “reloadExtension” para que procese toda la información que hemos mandado. Y listo, ya estaría todo este contenido dentro de nuestro directorio de llamadas / contactos.

Nota: Si te has fijado en el código, estas funciones devuelven promesas así que tendremos que controlarlas con un “then” y un “catch”.

Vale, ahora pasemos a explicar un poco más en profundidad los entresijos de nuestro componente Call Directory.

Funciones de nuestra clase Call Directory

  • isAvailable -> Comprueba si los datos son accesibles y así poder leer y escribir en nuestra lista de llamadas / contactos. Retorna una promesa que en el then trae un boleano para identificar si todo está correcto.
  • addIdentification -> Agrega nuevos registros a nuestro directorio de llamadas / contactos. Devuelve una promesa que trae los datos de las entradas agregadas.
  • removeIdentification -> Hace lo mismo que la función anterior, pero en lugar de agregar, elimina. Retorna una promesa con los datos eliminados.
  • getAllItems -> Devuelve todas las entradas que tenemos agregadas en nuestro sistema.
  • reloadExtension -> Es llamada después de efectuar algún cambio para que este sea aplicado.

Estoy terminando de preparar un vídeo donde explicaré en directo como podemos usar este sistema para los más vaguetes. En cuanto lo tenga lo subiré a este artículo, así que sí te interesa aprender un poco más aún revísa este entrada de vez en cuando.

En fin, ya hemos llegado al final. No te imaginas lo cuesta arriba que se me hace escribir estas últimas líneas. Nunca se lo que poner para despedirme de ti L Bueno, pues nada, recordarte que te pases por el círculo, en este enlace, que es una red que estoy montando alrededor de esta profesión de la que me encantaría que formaras parte, si no lo haces ya, en la que hablo con mi audiencia de manera directa. ¿Te apuntas? Na, seguro que sí.

Un saludo y nos vemos en el siguiente capítulo.

Comparte esto en: