Cómo utilizar el marco de Autocompletar de Android O

El relleno automático de formularios, que a menudo se reduce a solo un autocompletado, es una característica que los navegadores han admitido desde hace años. La mayoría de nosotros lo usamos todo el tiempo. Por mi parte, lo encuentro indispensable durante tareas como completar un formulario de registro o completar un proceso de pago..

La última versión de Android, Android O, trae una funcionalidad similar a las aplicaciones de Android. En otras palabras, Android ahora puede ayudar a los usuarios a completar formularios que pertenecen a todas las aplicaciones que tienen instaladas en sus dispositivos. Esta fue una característica muy esperada porque escribir con un teclado virtual en una pantalla pequeña tiende a ser una molestia.

Como desarrollador de aplicaciones, puede usar el nuevo Autofill Framework para crear su propio servicio personalizado de autocompletar, un servicio que decide cómo rellenar los campos de entrada de una aplicación. En este tutorial, te mostraré cómo.

Prerrequisitos

Para poder seguir este tutorial, necesitarás:

  • Vista previa de Android Studio 2.4 7 o altaer
  • Un emulador o dispositivo con Android O o superior

1. Crear un nuevo proyecto

Inicie Android Studio y cree un nuevo proyecto con una actividad vacía. Usted debe, por supuesto, recordar elegir Android 7+ en el Dispositivos Android objetivo diálogo.

Este proyecto necesitará algunos widgets que pertenezcan a la Biblioteca de soporte de diseño, por lo tanto, abra el aplicación módulo de construir.gradle archiva y agrega lo siguiente compilar dependencia a ello

compilar 'com.android.support:design:26.+'

Por último, pulse el Sincronizar ahora botón para actualizar el proyecto.

2. Crear una actividad de configuración

En este tutorial, crearemos una aplicación que contenga un servicio de llenado automático muy simple que se dirija solo a aquellos campos de entrada donde se espera que el usuario escriba una dirección de correo electrónico. Debido a que casi todas las demás aplicaciones de Google Play de hoy solicitan una dirección de correo electrónico, este servicio será bastante útil..

Nuestro servicio obviamente necesita saber cuáles son las direcciones de correo electrónico del usuario. Por lo tanto, ahora construyamos una actividad donde el usuario pueda escribir y guardar dos direcciones de correo electrónico.

Paso 1: Definir el diseño

Como es de esperar, el diseño de la actividad contendrá dos Editar texto widgets donde el usuario puede escribir sus direcciones de correo electrónico. Si desea que se adhiera a las directrices de Material Design, coloque el Editar texto widgets dentro TextInputLayout contenedores es una buena idea.

Además, el diseño debe tener un Botón Widget que el usuario puede pulsar para guardar las direcciones de correo electrónico..

Eres libre de colocar los widgets donde quieras. Sin embargo, por ahora, te sugiero que las coloques todas dentro de un LinearLayout cuya orientación es vertical.

        

En el código anterior, se puede ver que el Botón widget tiene un al hacer clic atributo que apunta a un método. Haga clic en la bombilla de luz amarilla junto a este atributo en Android Studio para generar un trozo para él en el asociado Actividad clase.

public void saveEmailAddresses (vista de vista) // Se agregará más código aquí

Paso 2: guardar las direcciones de correo electrónico

Estaremos usando un archivo de preferencias compartido llamado EMAIL_STORAGE para guardar nuestros datos. Puedes usar el getSharedPreferences () método de tu Actividad Clase para acceder al archivo. Además, para poder escribir en el archivo, debe llamar a su editar() método, que genera un SharedPreferences.Editor objeto.

En consecuencia, agregue el siguiente código dentro de la saveEmailAddresses () método:

SharedPreferences.Editor editor = getSharedPreferences ("EMAIL_STORAGE", MODE_PRIVATE) .edit ();

Para obtener las direcciones de correo electrónico que el usuario ha escrito en el Editar texto widgets, primero tendrá que obtener referencias a ellos usando el findViewById () método, y luego llamar a su getText () metodos.

String primaryEmailAddress = ((EditText) findViewById (R.id.primary)) .getText (). ToString (); String secondaryEmailAddress = ((EditText) findViewById (R.id.secondary)) .getText (). ToString ();

En este punto, puede llamar al putString () Método del editor para agregar las direcciones de correo electrónico al archivo de preferencias como dos pares de valores clave. Después de hacerlo, no olvides llamar al cometer() Método para hacer que tus cambios sean permanentes..

editor.putString ("PRIMARY_EMAIL", primaryEmailAddress); editor.putString ("SECONDARY_EMAIL", secondaryEmailAddress); editor.commit ();

Paso 3: Crear un archivo de metadatos

La actividad de configuración que creamos en el paso anterior es actualmente una actividad normal. Para que la plataforma de Android sepa que es una actividad de configuración para un servicio de autocompletar, debemos crear un archivo XML de metadatos que así lo indique..

Crear un nuevo archivo XML llamado email_address_filler.xml en el proyecto res / xml carpeta. Dentro de ella, agregue un  etiqueta y establece el valor de su ajustesActividad atribuye al nombre de tu Actividad clase.

 

Ahora puede ejecutar la aplicación, escribir dos direcciones de correo electrónico y presionar la tecla Salvar botón para guardarlos.

3. Crear un servicio de autocompletar

Cualquier clase que extienda lo abstracto. AutoFillService La clase puede servir como un servicio de autocompletar. Así que empieza creando una nueva clase de Java con Archivo> Nuevo> Clase Java. En el diálogo que aparece, nombra la clase EmailAddressFiller y asegúrese de que establece el valor de la Superclase campo a AutoFillService.

Android Studio ahora le pedirá que genere apéndices para dos métodos abstractos: onSaveRequest () y onFillRequest (). En este tutorial, nos centraremos solo en el onFillRequest () Método, que se llama automáticamente cada vez que el usuario abre una actividad de cualquier campo de entrada que contenga la aplicación.

@Override public void onFillRequest (AssistStructure assistStructure, Bundle bundle, CancelSignal cancelSignal, FillCallback fillCallback) // Más código va aquí

Paso 1: Analizar jerarquías de vista

Un servicio de autocompletar necesita analizar la interfaz de usuario de una aplicación e identificar los campos de entrada que puede llenar. Por eso el onFillRequest () método recibe un Estructura de asistencia Objeto, que contiene detalles sobre todos los widgets que se ven actualmente en la pantalla. Más precisamente, contiene un árbol de ViewNode objetos. 

Si nunca has visto un árbol así, te sugiero que uses el uiautomatorviewer Herramienta, que forma parte del SDK de Android, para analizar las jerarquías de diseño de algunas aplicaciones. Por ejemplo, aquí está el aspecto de la jerarquía de diseño de la aplicación de correo predeterminada de Android:

Naturalmente, para analizar todos los nodos de un árbol, necesita un método recursivo. Vamos a crear uno ahora:

void identificaEmailFields (AssistStructure.ViewNode node, List Campo de correo electrónico) // Más código va aquí

Como puedes ver, este método tiene una ViewNode y un Lista como sus parametros Estaremos usando el Lista para almacenar todos los campos de entrada que esperan direcciones de correo electrónico.

Quizás ahora se esté preguntando cómo puede saber mediante programación si un campo de entrada espera una dirección de correo electrónico. Bueno, realmente no hay un enfoque infalible que puedas seguir. Por ahora, vamos a suponer que todos los desarrolladores de aplicaciones siempre otorgan identificadores de recursos significativos a sus campos de entrada. Sobre la base de esa suposición, podemos simplemente seleccionar todos los campos de entrada cuyos ID de recursos contengan cadenas como "correo electrónico" y "nombre de usuario".

En consecuencia, agregue el siguiente código al método:

if (node.getClassName (). contiene ("EditText")) String viewId = node.getIdEntry (); if (viewId! = nulo && (viewId.contains ("email") || viewId.contains ("username"))) emailFields.add (node); regreso; 

A continuación, cada vez que nos encontramos con un ViewNode objeto que contiene más ViewNode objetos, debemos llamar recursivamente al identificarEmailFields () Método para analizar a todos sus hijos. El siguiente código le muestra cómo:

para (int i = 0; i

En este punto, podemos llamar al identificarEmailFields () metodo dentro del onFillRequest () Método y pasar el nodo raíz de la jerarquía de vistas a él.

// Crear una lista vacía Lista emailFields = new ArrayList <> (); // Rellene la lista identifiqueEmailFields (assistStructure .getWindowNodeAt (0) .getRootViewNode (), emailFields);

Si nuestro servicio no puede identificar ningún campo de entrada para correos electrónicos, no debería hacer nada. Por lo tanto, agregue el siguiente código a él:

if (emailFields.size () == 0) return;

Paso 2: crear y rellenar vistas remotas

Si nuestro servicio identifica un campo de entrada que puede llenar, debe llenar una lista desplegable que se mostrará debajo del campo de entrada. Sin embargo, hacerlo no es sencillo porque ni el campo de entrada ni la lista desplegable pertenecen a nuestra aplicación.

Para rellenar la lista desplegable, debemos utilizar Vistas remotas objetos. Como su nombre lo indica, un Vistas remotas objeto es una colección de vistas que se pueden mostrar en otra aplicación.

Para inicializar un Vistas remotas Objeto, necesitarás un archivo XML de diseño. Vamos a crear uno ahora llamado email_suggestion.xml. Por ahora, puede contener una sola Vista de texto Widget para mostrar una dirección de correo electrónico.

En consecuencia, agregue el siguiente código a email_suggestion.xml:

  

Ahora puedes volver a la onFillRequest () método y crear dos Vistas remotas objetos: uno para el correo electrónico principal y otro para el correo electrónico principal.

RemoteViews rvPrimaryEmail = new RemoteViews (getPackageName (), R.layout.email_suggestion); RemoteViews rvSecondaryEmail = new RemoteViews (getPackageName (), R.layout.email_suggestion);

los Vista de texto widgets dentro de la Vistas remotas los objetos deben mostrar las dos direcciones de correo electrónico que almacenamos anteriormente en un archivo de preferencias compartido. Para abrir el archivo, use el getSharedPreferences () Método de nuevo. Una vez abierto, puedes usar su getString () Método para obtener ambas direcciones de correo electrónico.

Finalmente, para configurar los contenidos del mando a distancia. Vista de texto widgets, debes usar el setTextViewText () método.

// Cargar las direcciones de correo electrónico de las preferencias SharedPreferences sharedPreferences = getSharedPreferences ("EMAIL_STORAGE", MODE_PRIVATE); String primaryEmail = sharedPreferences.getString ("PRIMARY_EMAIL", ""); String secondaryEmail = sharedPreferences.getString ("SECONDARY_EMAIL", ""); // Actualizar las vistas de texto remotas rvPrimaryEmail.setTextViewText (R.id.email_suggestion_item, primaryEmail); rvSecondaryEmail.setTextViewText (R.id.email_suggestion_item, secondaryEmail);

Paso 3: Crear conjuntos de datos

Ahora podemos usar las vistas remotas para crear conjuntos de datos de relleno automático que se pueden enviar a cualquier aplicación. Para evitar que este tutorial sea demasiado largo, crearemos conjuntos de datos solo para el primer campo de entrada de correo electrónico que encontremos. El siguiente código muestra cómo seleccionar solo el primer campo de entrada de correo electrónico:

AssistStructure.ViewNode emailField = emailFields.get (0);

Un conjunto de datos de relleno automático no es más que una instancia de Conjunto de datos clase, y se puede construir utilizando el Dataset.Builder clase.

Cuando el usuario selecciona una de las direcciones de correo electrónico que nuestro servicio muestra en la lista desplegable, debe configurar el contenido del campo de entrada asociado usando la valor ajustado() método de la Dataset.Builder clase. Sin embargo, no puedes pasar un ViewNode objetar al valor ajustado() método. En realidad espera un identificador de autocompletado, que debe obtenerse llamando al getAutoFillId () método de la ViewNode objeto.

Además, para especificar el texto que debe escribirse en el campo de entrada, debe usar el AutoFillValue.forText () método. El siguiente código le muestra cómo:

Dataset primaryEmailDataSet = new Dataset.Builder (rvPrimaryEmail) .setValue (emailField.getAutoFillId (), AutoFillValue.forText (primaryEmail)) .build (); Dataset secondaryEmailDataSet = new Dataset.Builder (rvSecondaryEmail) .setValue (emailField.getAutoFillId (), AutoFillValue.forText (secondaryEmail)) .build ();

Antes de enviar los conjuntos de datos a una aplicación, debe agregarlos a un FillResponse objeto, que puede ser construido utilizando el FillResponse.Builder clase. Llama a su addDataset () Método dos veces para agregar tanto los conjuntos de datos.

Una vez el FillResponse El objeto está listo, pásalo como argumento a la onSuccess () método de la FillCallback objeto, que es uno de los parámetros de la onFillRequest () método.

Respuesta de FillResponse = new FillResponse.Builder () .addDataset (primaryEmailDataSet) .addDataset (secondaryEmailDataSet) .build (); fillCallback.onSuccess (respuesta);

Paso 4: Actualizar el Manifiesto

Como todos los servicios, el servicio de autocompletar también debe declararse en el proyecto. AndroidManifest.xml expediente. Mientras lo hace, debe asegurarse de que está protegido por la android.permission.BIND_AUTO_FILL permiso.

Este servicio también necesita un  etiqueta que le permite responder a la android.service.autofill.AutoFillService acción, y un etiqueta que apunta al archivo XML de metadatos que creamos en un paso anterior.

En consecuencia, agregue las siguientes líneas a su archivo de manifiesto:

     

Nuestro servicio y aplicación de autocompletado ya están listos. Crea el proyecto e instala la aplicación en tu dispositivo.

4. Activar y utilizar el servicio Autocompletar.

Para activar el servicio de autocompletar, abra el dispositivo Ajustes aplicación y navegar a Aplicaciones y notificaciones> Avanzadas> Aplicaciones predeterminadas> Aplicación Autocompletar. En la siguiente pantalla, seleccione su aplicación de la lista de aplicaciones de autocompletar disponibles.

Ahora puede abrir cualquier aplicación que solicite una dirección de correo electrónico para ver su servicio de autocompletar en acción. Por ejemplo, esto es lo que verías en las pantallas de inicio de sesión de Instagram y Pinterest:

Conclusión

Ahora sabe cómo crear y utilizar un servicio de autocompletar personalizado para Android. Siéntase libre de extenderlo para admitir otros campos comunes, como el nombre o el número de teléfono. También puede intentar identificar campos de entrada utilizando otros atributos, como etiquetas y sugerencias..

Para obtener más información sobre Autofill Framework, consulte su documentación oficial. Y mientras tanto, echa un vistazo a algunas de nuestras otras publicaciones sobre el desarrollo de aplicaciones Android O y Android!