Patrones y componentes

En Android 8.0, el menú Configuración obtiene varios componentes y widgets que cubren usos comunes. Se recomienda a los fabricantes y desarrolladores de dispositivos que utilicen componentes comunes al ampliar la aplicación de Configuración para que las nuevas interfaces de usuario sean consistentes con la UI de Configuración existente.

Aquí hay un resumen de las mejoras:

  • Cambio de comportamiento del divisor en el marco de preferencias de la biblioteca de soporte. El divisor ahora se dibuja entre categorías.
  • Cambio de tema de ActionBar. La ActionBar ahora usa un tema de color claro, con texto de color acentuado.
  • Nuevo diseño de preferencias. El espacio para los íconos permanece incluso cuando una preferencia no tiene ícono.

Nuevos widgets:

  • Un widget de encabezado para detalles de la aplicación. Muestra el ícono de la aplicación, la etiqueta de la aplicación y otra información.
  • Un botón de expansión en algunas páginas. La página puede comenzar contraída y ocultar elementos menos importantes hasta que el usuario haga clic en el botón expandir.
  • Interfaz de usuario del selector de aplicaciones predeterminada:
    • La interfaz de usuario para elegir el navegador predeterminado, la aplicación de teléfono predeterminada, etc.
    • Anteriormente era un cuadro de diálogo, ahora es una interfaz de usuario basada en botones de opción de pantalla completa.
  • Una preferencia de estilo "MasterSwitch". Esta es una preferencia con objetivos de dos clics. El objetivo izquierdo conduce a un fragmento o intención de subconjunto. El objetivo derecho es un interruptor que controla el encendido/apagado de toda la página.

Ejemplos y fuente

  • Comportamiento del divisor
    • Todas las páginas en Configuración se modifican para utilizar el nuevo comportamiento del divisor.
    • El comportamiento del divisor se define como ThemeOverlay en:
      packages/apps/Settings/res/values/styles_preference.xml
  • Cambio de tema de ActionBar
    • Todas las páginas en Configuración se modifican para usar el nuevo tema ActionBar.
    • El tema está definido en Theme.DeviceDefault.Settings
  • Nuevo diseño de preferencias
    • Muchas páginas en Configuración ahora usan el nuevo diseño de preferencias.
    • Puedes encontrar el código en:
      packages/apps/Settings/res/values/styles_preference.xml
  • Widget de encabezado de aplicación
    • La mayoría de las páginas de información de la aplicación en Configuración ya están implementando el nuevo encabezado de la aplicación.
    • Se pueden encontrar ejemplos y códigos en:
      packages/apps/Settings/src/com/android/settings/applications/AppHeaderController.java
  • Botón expandir
    • Se pueden encontrar ejemplos y códigos en:
      packages/apps/Settings/src/com/android/settings/dashboard/ProgressiveDisclosureMixin.java

      Nota: Este componente debe usarse junto con DashboardFragment. (Consulte más detalles sobre DashboardFragment en Arquitectura de información actualizada ).

  • Selector de aplicaciones predeterminado
    • Puede encontrar el código para la clase base en:
      packages/apps/Settings/src/com/android/settings/applications/defaultapps/DefaultAppPickerFragment.java
    • Hay varias subclases de DefaultAppPickerFragment, cada una de las cuales implementa un selector para diferentes propósitos.
  • Preferencia de estilo de MasterSwitch
    • El código está en: https://cs.android.com/android/platform/superproject/+/main:packages/apps/Settings/src/com/android/settings/wifi/WifiPrimarySwitchPreferenceController.java
    • Un caso de uso de ejemplo es el conmutador principal de Wi-Fi. Puede encontrar un ejemplo en: packages/apps/Settings/src/com/android/settings/wifi/WifiMasterSwitchPreferenceController.java

Implementación

Los fabricantes de dispositivos pueden comenzar a utilizar todos los componentes nuevos listos para usar. Si los OEM deciden implementar una nueva preferencia de estilo "MasterSwitch" o un selector de aplicaciones predeterminado, deben seguir los ejemplos de este documento y los archivos de referencia (Javadoc) escritos con cada componente para obtener más detalles.

Personalización

  • Comportamiento divisorio. Para cambiar cómo se dibuja el divisor, actualice el estilo de los divisores de Configuración y cambie el valor de lo siguiente:
    • permitirDivisorArriba
    • permitirDivisorAbajo
    • permitirDividerAfterLastItem
  • Color del tema ActionBar. Las actividades deben usar Theme.DeviceDefault.Settings como tema o crear un tema personalizado usando Theme.DeviceDefault.Settings como padre.
  • Widget de encabezado de aplicación. Utilice configuradores en AppHeaderController para personalizar cada campo y llame a build() una vez que todos los campos estén configurados.
  • Botón expandir:
    • Para deshabilitar completamente la funcionalidad, anule el constructor de ProgressiveDisclosureMixin y establezca keepExpanded en verdadero.
    • Para personalizar cuántos elementos mostrar inicialmente, llame al método ProgressiveDisclosureMixin.setTileLimit() durante el método onAttach(Context) del fragmento.