Controles personalizados

Con los controles personalizados, puedes agregar tus propios elementos de la IU sobre la vista de navegación. El SDK de Navigation reposiciona automáticamente tus controles personalizados a medida que cambia el diseño integrado.

Puedes configurar un control personalizado para cada posición. El control personalizado puede ser un elemento de la IU o, si tu diseño requiere más, puedes usar un ViewGroup con varios elementos de la IU.

El método setCustomControl proporciona posiciones como se define en la enumeración CustomControlPosition:

• SECONDARY_HEADER (solo aparece en modo vertical)
• BOTTOM_START_BELOW
• BOTTOM_END_BELOW

En la siguiente imagen, puedes ver ejemplos de cada posición en la posición de un control de IU que informa al conductor sobre la ubicación de un pasajero.

Agrega un control personalizado debajo del encabezado principal

De forma predeterminada, los diseños muestran una flecha hacia adelante o una guía de carril debajo del encabezado principal. Tu app puede reemplazar el diseño predeterminado con un control personalizado configurado en la posición del encabezado secundario. Este control reemplaza el contenido predeterminado en la parte superior de la vista de navegación. Si la vista tiene un fondo, este permanecerá en su lugar. Cuando tu app quita el contenido personalizado, el contenido predeterminado aparece en su lugar.

Esta posición se encuentra debajo del encabezado del mapa principal, con el borde superior alineado con el borde inferior del encabezado principal. El encabezado secundario predeterminado está oculto. Esta posición solo se admite en portrait mode. En landscape mode, el encabezado secundario no está disponible y el diseño no cambia.

1. Crea una vista de Android con el elemento de IU personalizado o ViewGroup.
2. Aumenta el XML o crea una instancia de la vista personalizada para obtener una instancia de la vista y agregarla como encabezado secundario.

3. Usa NavigationView.setCustomControl o NavigationFragment.setCustomControl con CustomControlPosition como SECONDARY_HEADER.

   Nota: Tu app debe llamar a este método en el subproceso de IU.

   En el siguiente ejemplo, se crea un fragmento y se agrega un control personalizado en la posición del encabezado secundario.

   Nota: El código del ejemplo tiene saltos de línea para obtener visibilidad en la documentación. Asegúrate de quitarlos según corresponda.

    mNavFragment.setCustomControl(getLayoutInflater().
      inflate(R.layout.your_custom_control, null),
         CustomControlPosition.SECONDARY_HEADER);
   

Quita un encabezado secundario

Cuando quieras quitar el encabezado secundario y volver al contenido predeterminado, usa el método setCustomControl.

• Establece la vista en un valor nulo para quitarla.

  mNavFragment.setCustomControl(null, CustomControlPosition.SECONDARY_HEADER);
  

Cómo agregar un control personalizado sobre la vista de navegación

Tu app puede especificar un control personalizado alineado con el borde inferior de la vista. Cuando la app agrega el control personalizado, el botón para volver a centrar y el logotipo de Google se mueven hacia arriba para incorporar el control personalizado.

1. Crea una Android View con el elemento de la IU o el grupo de vistas que desees agregar.
2. Crea la vista o el fragmento de navegación.
3. Llama al método setCustomControl en la vista o el fragmento de navegación, y especifica el control y la posición que se usarán.

Nota: Tu app debe llamar a este método en el subproceso de IU.

En el siguiente ejemplo, se muestra un View personalizado que se agregó a un NavigationFragment:

  private NavigationFragment mNavFragment;
    mNavFragment = (NavigationFragment)
      getFragmentManager().findFragmentById(R.id.navigation_fragment);

    // Create the custom control view.
    MyCustomView myCustomView = new MyCustomView();

    // Add the custom control to the bottom end corner of the layout.
    mNavFragment.setCustomControl(myCustomView, CustomControlPosition.
       BOTTOM_END_BELOW);

Cómo quitar un control personalizado

Cuando desees quitar el control personalizado, usa el método setCustomControl y especifica la posición del control que deseas quitar.

• Establece la vista en null para esa posición.

  mNavFragment.setCustomControl(null, CustomControlPosition.BOTTOM_END_BELOW);