martes, 13 de febrero de 2018

Navegando entre apps

Presentación


Hola a todos, mi nombre es Carlos Blanco. Lo primero que me gustaría hacer es agradecer a Jorge la posibilidad de colaborar en este blog, en mi opinión de lo mejorcito que hay sobre SAPUX en castellano. 

Voy a tratar de aportar mi granito de arena explicando cómo implementar determinadas casuísticas que se me han ido presentando en mis ya más de 3 años de experiencia peleándome con todo lo relacionado con SAPUX.

En este mi primer post, os voy a hablar acerca de la navegación entre aplicaciones SAPUI5. Vamos a utilizar como ejemplo una aplicación de cliente que muestra un listado de pedidos realizados y sobre el que podemos realizar una serie de filtrados sobre determinadas características de la entidad relacionada. Al presionar sobre cualquiera de los pedidos vamos a navegar a otra aplicación de cliente donde se ve el pedido más en detalle e incluso podemos realizar acciones de modificación o copia del pedido. 



Navegación


Para poder usar la navegación entre aplicaciones (navegación semántica), todas las aplicaciones deben tener asignado un objeto semántico y una acción en este objeto. El objeto semántico se declara en el manifest.json desde la aplicación SAPUI5.



Una vez que se llega a la aplicación destino, utiliza la navegación interna de la aplicación para encontrar la ruta correcta a una vista. En este caso estamos accediendo a un master&detail, y por tanto habrá que indicarle unos parámetros para la selección de los pedidos en el máster y qué pedido muestra en el Detail con la ruta SalesOrders/{objectId}. El enrutado entre vistas también está definido en el manifest.json.



Por tanto la aplicación hacia la que vamos a navegar necesita una serie de parámetros para que, además de ser lanzada, sea capaz de inicializarse con una serie de características determinadas. En nuestro ejemplo necesitamos unos parámetros que marcan el filtrado a la hora de reiniciarse la aplicación destino, que son las fechas, el vendedor, el cliente y el pedido seleccionado para mostrarlo en el detalle. Lo primero que hacemos en el método onInit de la aplicación de origen es instanciar un controlador de navegación:



Cuando se ejecuta el evento que debe lanzar la navegación, almacenamos los datos necesarios que hay que enviar a la aplicación destino y ejecutamos el método para navegar del controlador de navegación indicando el objeto semántico, la acción y los parámetros:



En el método onInit de la aplicación destino, en nuestro caso en el máster, adjuntamos el evento _onMasterMatched:



En este método _onMasterMatched leemos los parámetros en el caso de venir de una navegación o si no hay parámetros arrancamos la aplicación con los datos por defecto:



Y con estos parámetros podemos arrancar la aplicación destino con la configuración deseada. 


Vuelta de Navegación


Al realizar la navegación entre aplicaciones también debemos tener en cuenta el caso de querer volver a la aplicación origen navegando hacia atrás. Al regresar, en lugar de continuar en el estado en el que la aplicación origen se quedó, se crea una nueva instancia de la aplicación, lo que significa que la aplicación está en un estado inicial.

Para resolver esto necesitamos almacenar el estado entre llamadas, para eso creamos una variable en el método onInit que antes de navegar a la aplicación destino rellenaremos con los datos de los filtros, las opciones de búsqueda y las interacciones que el usuario haya aplicado, para luego volverlas a aplicar a la vuelta. Como ya tenemos instanciado el controlador de navegación, ahora proporcionamos un método de ejecución para después de la vuelta de la navegación (onNavigationDone):



En el momento de la navegación, tenemos los datos de filtros y búsquedas aplicados en nuestra aplicación origen en ese momento en la variable antes definida (this._oAppState) y los mandamos al ejecutar la navegación en los customData:



Al volver a esta aplicación origen desde la aplicación destino con la navegación hacia atrás, se ejecuta el método antes definido (onNavigationDone) donde podemos recuperar el estado de la aplicación anteriormente y restaurarlo en la nueva instancia de la aplicación origen:



Espero que os haya parecido interesante mi primer post y si tenéis cualquier comentario o duda, ya sabéis.

3 comentarios: