La interfaz de usuario (UI) de Confirmación protegida consta de seis elementos obligatorios. Algunos elementos se pueden personalizar, pero hay requisitos que se deben seguir. Utilice las siguientes pautas al personalizar la interfaz de usuario y asegúrese de que se cumplan los requisitos. Si un elemento está marcado con Requisito: ese elemento debe usar la propiedad enumerada.
Las siguientes pautas utilizan la familia de fuentes Roboto, que puede descargar desde fonts.google.com .
UI con botones de hardware
La confirmación protegida de Android puede usar botones de hardware en el dispositivo para confirmar y cancelar la entrada.
Iconos
Icono de escudo
| Icono |  |
|---|---|
| Descargar | Escudo de seguridad |
| Tamaño de ícono | 32dp |
icono de flecha
| Icono |  |
|---|---|
| Descargar | Flecha del teclado hacia la derecha |
| Tamaño de ícono | 24dp |
| Radio de esquina del contenedor | 4dp |
Mensajes de entrada
Hay dos tipos de entrada utilizados en la confirmación protegida: confirmar y cancelar.
Cadena de confirmación
Este mensaje debe indicar qué botón se utiliza como confirmación.
| Mensaje | Presione dos veces (botón) para confirmar |
|---|---|
| Longitud máxima | Requisito: El mensaje de confirmación no puede tener más de dos líneas. |
| Color | #000000 87% |
| Perfil delantero | Roboto-Medio |
| Tamaño de fuente | Requisito: 14 velocidades |
| Altura de la línea | Requisito: 20dp |
Cancelar cadena
El mensaje de cancelación debe ser claramente visible y distinguirse fácilmente del botón de confirmación. Utilice las siguientes propiedades junto con la palabra única Cancelar .
| Mensaje | Cancelar |
|---|---|
| Color | #000000 87% |
| Perfil delantero | Roboto-Medio |
| Tamaño de fuente | Requisito: 14 velocidades |
| Altura de la línea | Requisito: 20dp |
Texto de cabecera
Incluya el texto del encabezado Confirmación protegida de Android en la interfaz de usuario confiable para identificar la función. Utilice las siguientes propiedades para el texto del encabezado.
| Mensaje | Requisito: Confirmación protegida de Android |
|---|---|
| Color | #000000 87% |
| Perfil delantero | Roboto-Regular |
| Tamaño de fuente | Requisito: 22sp |
| Altura de la línea | Requisito: 28dp |
Cuerpo de texto
Utilice las siguientes propiedades al implementar el elemento de texto del cuerpo. El mensaje real lo escribe el desarrollador de API (desarrollador de aplicaciones).
| Mensaje | El texto del cuerpo lo proporciona el desarrollador de la aplicación llamando a Confirmación protegida. |
|---|---|
| Color | #000000 87% |
| Perfil delantero | Roboto-Regular |
| Tamaño de fuente | Requisito: 16 velocidades |
| Altura de la línea | Requisito: 24dp |
Texto del subtítulo
Utilice el texto del subtítulo para explicar por qué el usuario ve la pantalla de Confirmación protegida. Coloque este texto en la parte inferior de la pantalla y utilice las siguientes propiedades.
| Mensaje | Requisito: esta confirmación proporciona una capa adicional de seguridad para la acción que está a punto de realizar. |
|---|---|
| Longitud máxima | Requisito: El mensaje de confirmación no puede tener más de cuatro líneas. |
| Color | #000000 87% |
| Perfil delantero | Roboto-Regular |
| Tamaño de fuente | Requisito: 14 velocidades |
| Altura de la línea | Requisito: 20dp |
UI con botones de software
La confirmación protegida de Android puede utilizar botones de software para confirmar y cancelar la entrada. Las siguientes pautas describen la interfaz de usuario mediante botones de software.
Icono de escudo
Descargue el recurso del icono en Icono del escudo de confirmación protegido de Android . Coloque el icono en la parte superior de la pantalla.
El icono del escudo de Confirmación protegida es un elemento obligatorio. El color del escudo se puede personalizar pero debe ser claramente visible.
Aporte
Utilice la forma de un botón primario y secundario para confirmar y cancelar entradas.
| Etiqueta del botón | Utilice mayúsculas y minúsculas para las etiquetas de los botones. |
|---|---|
| Radio del botón | 4dp |
| Acentuar el color | #1a73e8 |
| Perfil delantero | Roboto-Medio |
| Tamaño de fuente | Requisito: 14 velocidades |
Texto de cabecera
Incluya el texto del encabezado Confirmación protegida de Android en la interfaz de usuario confiable para identificar la función. Utilice las siguientes propiedades para el texto del encabezado.
| Mensaje | Requisito: Confirmación protegida de Android |
|---|---|
| Color | #000000 87% |
| Perfil delantero | Roboto-Medio |
| Tamaño de fuente | Requisito: 24 velocidades |
| Altura de la línea | Requisito: 20dp |
Cuerpo de texto
Utilice las siguientes propiedades al implementar el elemento de texto del cuerpo. El mensaje real lo escribe el desarrollador de la aplicación.
| Mensaje | El texto del cuerpo lo proporciona el desarrollador de la aplicación llamando a Confirmación protegida |
|---|---|
| Color | #000000 87% |
| Perfil delantero | Roboto-Medio |
| Tamaño de fuente | Requisito: 16 velocidades |
| Altura de la línea | Requisito: 24dp |
Texto del subtítulo
Utilice el texto del subtítulo para explicar por qué el usuario ve la pantalla de Confirmación protegida. Coloque este texto en la parte inferior de la pantalla y utilice las siguientes propiedades.
| Mensaje | Requisito: esta confirmación proporciona una capa adicional de seguridad para la acción que está a punto de realizar. |
|---|---|
| Longitud máxima | Requisito: El mensaje de confirmación no puede tener más de cuatro líneas. |
| Color | #000000 54% |
| Perfil delantero | Roboto-Medio |
| Tamaño de fuente | Requisito: 14 velocidades |
| Altura de la línea | Requisito: 20dp |
Localización
Puede encontrar localizaciones para los componentes descritos en una implementación C independiente de una tabla de búsqueda como parte de AOSP .