A finales de 2020, se dará carpetazo a uno de los componentes web que tantas animaciones y jueguecitos (entre otras cosas, claro ;)) nos ha proporcionado: el Adobe Flash Player.
No sólo Chrome ya lo anunciaba como eliminado para su navegador para finales de 2020 (no como hasta ahora, que aparece deshabilitado por defecto pero lo podemos habilitar), sino que también la propia Adobe dejará de dar soporte (según un comunicado dado ya hace dos años). ¡Cuánto tiempo ha pasado desde que Apple dijese que sus móviles no usarían Flash, para indignación de muchos! ¿Cómo verían ahora sus capítulos de Cálico Electrónico y de los Happy Tree Friends?
Una cucharadita de SAP UI5, unas gotitas de Fiori, un toque de Web Dynpro ABAP y de aderezo un poquito de perejil y SAP HCM bien picadito, para darle sabor.
jueves, 26 de septiembre de 2019
miércoles, 26 de junio de 2019
SAP Fiori 3: Asignar el tema en SAP Web IDE
En el artículo anterior, estuvimos viendo las cosas que ya habían ido saliendo de Fiori 3, incluyendo la nueva versión de SAPUI5, que justo en ese momento era la 1.66. Y creamos una aplicación sencilla para ver el nuevo Shellbar que nos venía con Fiori 3. Encima, nos enteramos de que comenzaba un curso de Fiori 3 en openSAP, ¡que comienza hoy mismo! Venga, dejamos un momento el blog y nos inscribimos en el curso... ya, si eso, ahora seguimos trasteando.
...
Ya nos hemos inscrito todos, ¿no? Bien, pues seguimos por donde íbamos. Que hoy vamos a hablar de como trastear con el nuevo tema de SAP Fiori 3, SAP Quartz Light, en nuestro SAP Web IDE, en lugar de usar el SAP Belize.
...
Ya nos hemos inscrito todos, ¿no? Bien, pues seguimos por donde íbamos. Que hoy vamos a hablar de como trastear con el nuevo tema de SAP Fiori 3, SAP Quartz Light, en nuestro SAP Web IDE, en lugar de usar el SAP Belize.
jueves, 23 de mayo de 2019
SAP Fiori 3 ya está aquí... al menos un poquito
Sí, sí, lo sé, llego tarde para contar cualquier novedad sobre Fiori 3 de SAP, ya que fue anunciado en las pasadas TechEd del 2018.
En cualquier caso, tenía pendiente un artículo al respecto desde hace ya tiempo, sobre todo para ir aclarándome yo mismo un poco las ideas porque no he podido estar muy al tanto del tema en estos últimos meses. Y es que, sin haber tenido oportunidad de trastear demasiado con Fiori 2.0, nos llega el 3 y nos vamos quedando ya obsoletos en nada y menos de tiempo. Porque sí, ya tenemos componentes de Fiori 3 con los que comenzar a invetigar más allá de las transparencias que SAP nos proporciona.
Así que vamos a aprovechar que Fiori 3 está ya apareciendo poquito a poco, en lugar de hacerlo de golpe, para aprender a nuestro ritmo, y que ya tenemos elementos con los que trabajar para practicar con lo que se nos viene encima.
En este artículo vamos a ver:
En cualquier caso, tenía pendiente un artículo al respecto desde hace ya tiempo, sobre todo para ir aclarándome yo mismo un poco las ideas porque no he podido estar muy al tanto del tema en estos últimos meses. Y es que, sin haber tenido oportunidad de trastear demasiado con Fiori 2.0, nos llega el 3 y nos vamos quedando ya obsoletos en nada y menos de tiempo. Porque sí, ya tenemos componentes de Fiori 3 con los que comenzar a invetigar más allá de las transparencias que SAP nos proporciona.
Así que vamos a aprovechar que Fiori 3 está ya apareciendo poquito a poco, en lugar de hacerlo de golpe, para aprender a nuestro ritmo, y que ya tenemos elementos con los que trabajar para practicar con lo que se nos viene encima.
En este artículo vamos a ver:
- Vamos a contar... ¿novedades?
- Ya podemos trastear con la 1.65... ¿y con la 1.66?
- Habemus curso en openSAP.
martes, 21 de mayo de 2019
Utilizar librerías externas en nuestros proyectos SAPUI5
Hoy os voy a hablar de cómo poder utilizar librerías externas en nuestros proyectos SAPUI5, ya que en JavaScript existen muchas bibliotecas con funcionalidades complejas listas para poder ser usadas en nuestros desarrollos y así facilitarnos mucho la vida.
Dos bibliotecas que utilizo a menudo:
• Lodash: Contiene funciones que facilitan el trabajo con arrays. ( https://lodash.com/ )
• MomentJS: Una biblioteca con funcionalidades adicionales de fecha y hora. ( https://momentjs.com )
Se pueden agregar de varias maneras, en este post os voy a indicar la forma más sencilla que va consistir en crear desde SAP WebIDE una carpeta (la llamaremos “libs”), donde vamos a disponer de todas las librerías externas que vamos a utilizar.
miércoles, 3 de abril de 2019
Error al usar servicio Northwind con SAPUI5 - Aprendiendo a buscar errores
La semana pasada, dos lectores comentaron que el ejemplo para crear una aplicación usando el servicio oData de Northwind no funcionaba. La verdad es que el error no era nada intuitivo, "HTTP request failed", así que probé a volver a crear la aplicación a ver qué fallaba. Y, efectivamente, ahí estaba el error.
¿Qué es lo que podía pasar? ¿Por qué había comenzado a fallar? Había que investigar para descubrirlo.
Por todos los draconianos de Krynn, yo juraría que esto antes funcionaba |
¿Qué es lo que podía pasar? ¿Por qué había comenzado a fallar? Había que investigar para descubrirlo.
miércoles, 27 de marzo de 2019
Crear un gráfico en SAPUI5 (IV) - Usar eventos de interacción
Ya hemos aprendido unas cuantas cosas relacionadas con los gráficos en SAPUI5, como han sido:
Aunque esta propiedad nos la proponen para crear nuestros propios tooltips, ya que con las funciones callback podemos recuperar el elemento seleccionado y la posición (x e y), vamos a utilizarla para otro propósito: Para mostrar un panel informativo con los puntos seleccionados y la probabilidad. No lo haremos en un tooltip, sino en un panel desplegable, y obtendremos algo como lo siguiente:
Y los pasos que seguiremos serán:
Al final del artículo, tenemos el enlace para descargar el ejemplo en GitHub.
- Crear un gráfico.
- Añadir un tooltip que se muestra al pulsar un elemento.
- Crear un tooltip personalizado para mostrarnos los totales seleccionados.
Ahora vamos a ver una opción adicional con los elementos del gráfico, y es que podemos realizar acciones cuando se seleccione uno de ellos, sin necesidad de mostrar un tooltip.
Para ello usaremos una propiedad de los Vizframe, la propiedad interaction.decorations, que nos permite ejecutar una función callback cuando se muestra el tooltip (al seleccionar) y cuando se oculta (al deseleccionar).
Podemos encontrar la ayuda en la documentación específica de Vizframes, buscando en el apartado de Propiedades.
Aunque esta propiedad nos la proponen para crear nuestros propios tooltips, ya que con las funciones callback podemos recuperar el elemento seleccionado y la posición (x e y), vamos a utilizarla para otro propósito: Para mostrar un panel informativo con los puntos seleccionados y la probabilidad. No lo haremos en un tooltip, sino en un panel desplegable, y obtendremos algo como lo siguiente:
Y los pasos que seguiremos serán:
- Crear un modelo de datos para guardar los elementos seleccionados (un string concatenado) y el total de probabilidad.
- Añadir una propiedad al gráfico (interaction.decorations), a la que podemos asignar dos valores: showDetail, para indicar una función callback que se ejecutará al seleccionar un elemento; y hideDetail, que se ejecutará cuando se deseleccione un elemento.
- Definir las dos funciones que se llaman desde showDetail y hideDetail, para modificar el contenido del modelo de datos.
- Añadir a la vista XML un panel expansible para mostrar los datos que hemos seleccionado, enlazándolo con el modelo de datos.
Al final del artículo, tenemos el enlace para descargar el ejemplo en GitHub.
viernes, 22 de marzo de 2019
Crear un gráfico en SAPUI5 (III) - Tooltip a medida
En artículos anteriores, habíamos creado un gráfico en SAPUI5 para mostrar la probabilidad de éxito al tirar dos dados (2d6) y habíamos añadido un tooltip que aparecía al seleccionar uno o varios elementos del gráfico (uno de los "puntitos") y que nos mostraba la información de la última selección hecha.
Y oye, el resultado era aparente... bueno, más o menos, tampoco era para tirar cohetes en una fiesta hobbit. ¿Pero qué pasa si queremos que el tooltip muestre una información más personalizada? Por ejemplo, que nos liste todos los elementos que están seleccionados y muestre la probabilidad total de que, al lanzar los dados, el resultado sea alguno de dicho conjunto.
De eso nos vamos a encargar en este artículo, y los pasos que seguiremos serán:
Y el resultado que obtendremos será algo como lo siguiente:
Y oye, el resultado era aparente... bueno, más o menos, tampoco era para tirar cohetes en una fiesta hobbit. ¿Pero qué pasa si queremos que el tooltip muestre una información más personalizada? Por ejemplo, que nos liste todos los elementos que están seleccionados y muestre la probabilidad total de que, al lanzar los dados, el resultado sea alguno de dicho conjunto.
De eso nos vamos a encargar en este artículo, y los pasos que seguiremos serán:
- Crear en la vista el control que vamos a utilizar: sap.viz.ui5.controls.Popover.
- En el controlador, conectar el Popover con el gráfico (el control VizFrame): Método connect.
- Crear en contenido personalizado del Popover. Aquí añadiremos un layout vertical con dos textos, uno para mostrar los elementos seleccionados y otro para mostrar la probabilidad total.
- Calcular y modificar los datos a visualizar en el método que se llamará al seleccionar un elemento del gráfico: Método setCustomDataControl.
- Crear un array de botones, que se mostrarán en el Popover para realizar acciones personalizadas adicionales: Método setActionItems.
Y el resultado que obtendremos será algo como lo siguiente:
Sí, se me ha olvidado añadir la tilde a selección, pero luego lo he hecho :P. |
jueves, 21 de marzo de 2019
Cuando uno se pone a probar alternativas
Tengo que admitir que el próximo artículo que voy a publicar, relacionado con gráficos y tooltips (Vizframe y Popover), me ha costado hacerlo. Y no por la complicación ni por el tiempo dedicado a investigar (no soy para nada un experto, simplemente voy trasteando con las cosas para aprender), sino más bien por la dudas y alternativas que me iban surgiendo a la hora de desarrollarlo. ¿Y si en lugar de hacer un setText utilizo un modelo de datos, qué será más eficiente pero qué será más claro para el lector? ¿Y si uso ya de una vez bind(this) y no var that = this? ¿Cómo puedo conseguir saber qué gráfico estoy seleccionando? Tonterías así.
Al final, entre hacer, rehacer, revisar, requetehacer, volver a revisar, me ha llevado un tiempo mucho más largo de lo esperado... para lo poco que realmente aporta el artículo :(.
Eso sí, he conseguido dos cosas: Aprender mucho más, y tener una posible lista de miniartículos adicionales para añadir. No está mal la tontería, ¿no?
En cualquier caso, esto me ha dado como objetivo una posible aplicación (friki, por supuesto), para hacer más compleja aún la aplicación de gráficos: Un simulador de tiradas de dados de rol (dados de 4 caras, 6 caras, 8, 10, 12, 20, 100... y cualquier alternativa que queramos) con gráfica incorporada. Vale, aplicaciones para tirar dados hay muchas, pero yo lo que quiero es aprender.
Así que, ¿seré capaz de hacerlo y no morir en el intento? Bueno, el tiempo lo dirá.
Al final, entre hacer, rehacer, revisar, requetehacer, volver a revisar, me ha llevado un tiempo mucho más largo de lo esperado... para lo poco que realmente aporta el artículo :(.
Eso sí, he conseguido dos cosas: Aprender mucho más, y tener una posible lista de miniartículos adicionales para añadir. No está mal la tontería, ¿no?
En cualquier caso, esto me ha dado como objetivo una posible aplicación (friki, por supuesto), para hacer más compleja aún la aplicación de gráficos: Un simulador de tiradas de dados de rol (dados de 4 caras, 6 caras, 8, 10, 12, 20, 100... y cualquier alternativa que queramos) con gráfica incorporada. Vale, aplicaciones para tirar dados hay muchas, pero yo lo que quiero es aprender.
Así que, ¿seré capaz de hacerlo y no morir en el intento? Bueno, el tiempo lo dirá.
lunes, 18 de marzo de 2019
Cursos del 2º trimestre de 2019: SAPUI5, SAP CP, HTML5, Node.js...
Porque no podemos dejar de aprender, volvemos a la carga con un buen puñado de cursos que nos pueden resultar interesantes para el desarrollo web, ya sea con SAPUI5 o con otras herramientas "más mundanas". Como siempre, centro mis selecciones en dos portales de cursos masivos online (ambos gratuitos), el específico para SAP, openSAP, con cursos en inglés, y Miriadax, con cursos más genéricos (no de SAP y no sólo de programación, sino prácticamente de cualquier cosa) y en español.
Sólo menciono los que más me interesan, que son aquellos centrados en desarrollo (generalmente web o ABAP), pero ambas webs merecen una buena visita por si hay algún otro curso que nos pueda resultar interesante. En resumen, en este post veremos:
Y, como siempre, hay que ver cada curso como un principio. Posiblemente no acabaremos siendo expertos en nada por haberlos hecho, pero tendremos el punto de partida para luego ya buscarnos la vida por nuestra cuenta y mejorar. No nos quedemos ahí parados.
Sólo menciono los que más me interesan, que son aquellos centrados en desarrollo (generalmente web o ABAP), pero ambas webs merecen una buena visita por si hay algún otro curso que nos pueda resultar interesante. En resumen, en este post veremos:
- Cursos de OpenSAP relacionados con SAP UX (SAP CP y SAP UI5) que se inician en breve.
- Repaso de cursos de OpenSAP de SAP UX (Fiori, Portal, SAP UI5, SAP Screen Personas, incluso Java), que ya han acabado pero que siempre podemos volver a hacer.
- Cursos de MiriadaX de desarrollo web (HTML5, Javacript, Node.JS), programación (introducción, aplicaciones móviles, videojuegos) y metodologías ágiles.
- Cursos de MiriadaX que ya no tienen nada que ver con programación, (o quizá sí :P) pero que a mí me apetece hacer :D: Teoría, gamificación y escritura.
Y, como siempre, hay que ver cada curso como un principio. Posiblemente no acabaremos siendo expertos en nada por haberlos hecho, pero tendremos el punto de partida para luego ya buscarnos la vida por nuestra cuenta y mejorar. No nos quedemos ahí parados.
Imagen de Pexels en Pixabay |
miércoles, 6 de febrero de 2019
Crear un gráfico en SAPUI5 (II) - Tooltip y selección
En un artículo anterior habíamos aprendido cómo crear gráficos sencillos con SAPUI5. Era algo muy básico, pero habíamos visto dónde está la documentación para poder hacerlos todo lo complicado que queramos.
En este artículo, lo que vamos a hacer es mostrar un tooltip cuando pasemos o seleccionemos uno de los valores del gráfico. Como habíamos hecho un gráfico con líneas, este tooltip se mostrará cuando pulsemos sobre uno de los puntos. Si fuese un gráfico de barras, se mostraría al pulsar la barra.
Podríamos crearnos un elemento personalizado para mostrarlo al pulsar sobre el gráfico, pero de momento sólo vamos a mostrar el tooltip por defecto y ver un par de opciones para configurarlo.
Nos centraremos en la documentación de los VizFrames de tipo línea, y en particular en dos propiedades, tooltip e interactions.
Lo que haremos será:
En este artículo, lo que vamos a hacer es mostrar un tooltip cuando pasemos o seleccionemos uno de los valores del gráfico. Como habíamos hecho un gráfico con líneas, este tooltip se mostrará cuando pulsemos sobre uno de los puntos. Si fuese un gráfico de barras, se mostraría al pulsar la barra.
Esto es ya nivel profesional, como poco. |
Podríamos crearnos un elemento personalizado para mostrarlo al pulsar sobre el gráfico, pero de momento sólo vamos a mostrar el tooltip por defecto y ver un par de opciones para configurarlo.
Nos centraremos en la documentación de los VizFrames de tipo línea, y en particular en dos propiedades, tooltip e interactions.
Lo que haremos será:
- Hacer el tooltip visible para que aparezca cuando pasamos sobre un valor o lo seleccionamos.
- Cambiar el color de fondo del tooltip.
- Que se puedan seleccionar varios valores o sólo uno.
miércoles, 23 de enero de 2019
RPTARQPOST - Cuando tropezamos varias veces con la misma piedra
Hoy vengo dispuesto a contar una anécdota, de cuando tropezamos varias veces con la misma piedra. Un poco por llorar las penas y por ver si, al escribirlo, no me vuelve a pasar ya por tercera vez. Y es que parece ser que nunca aprendo.
Os voy a hablar del report RPTARQPOST, y de cuando decide no postear los absentismos recién aprobados.
¿Y eso qué es lo que es? Es un report de SAP HCM, relacionado con la aplicación de My Leave Requests (las de Web Dynpro y las de Fiori). Su tarea es actualizar los infotipos correspondientes (2001 y 2002) una vez un absentismo es aprobado por el manager. Vamos, que en el portal, yo pido vacaciones, mi manager me las aprueba, pero hasta que no se ejecuta este report (generalmente programado cada pocos minutos), no se guardan en mis infotipos. Hasta entonces, el portal simula que se ha actualizado en el sistema, pero aún siguen en su capa (las tablas PTREQ*), pendientes de actualizarse en SAP HCM.
Os voy a hablar del report RPTARQPOST, y de cuando decide no postear los absentismos recién aprobados.
¿Y eso qué es lo que es? Es un report de SAP HCM, relacionado con la aplicación de My Leave Requests (las de Web Dynpro y las de Fiori). Su tarea es actualizar los infotipos correspondientes (2001 y 2002) una vez un absentismo es aprobado por el manager. Vamos, que en el portal, yo pido vacaciones, mi manager me las aprueba, pero hasta que no se ejecuta este report (generalmente programado cada pocos minutos), no se guardan en mis infotipos. Hasta entonces, el portal simula que se ha actualizado en el sistema, pero aún siguen en su capa (las tablas PTREQ*), pendientes de actualizarse en SAP HCM.
Tanto Fiori y tanta leche, y al final, por detrás, tenemos nuestra bonita pantalla SAPera |
miércoles, 16 de enero de 2019
Instalar y configurar Eclipse para Fiori y SAPUI5
Hace unos días me decidí, por fin, a actualizar el Eclipse que tenía instalado en el equipo para trabajar con SAPUI5. Hasta ahora trabajaba con la versión Eclipse Mars, pero iba siendo hora de actualizarlo. Así que, aprovechando que lo hacía, pensé "pues ya puedo contar cómo hacerlo, porque lo mismo a alguien le interesa". Así que veamos cómo hacerlo.
Está claro que SAP ha apostado bien fuerte por usar su Web IDE como aplicación para desarrollar aplicaciones SAPUI5 y, aunque se siga manteniendo el desarrollo de SAP UI5 en Eclipse, hay una cosa con la que aún no podemos contar en esta herramienta: Con las plantillas predefinidas.
En su momento, en la antigua version Eclipse Juno, existía un add-on que podíamos añadir, el Fiori Toolkit, para hacer una aplicación de tipo Master-Detail. Pero se le dejó de dar soporte hace años. Hoy por hoy, no contamos con algo específico y con soporte que cuente con plantillas predefinidas.
Pero eso no quiere decir que no podamos usar Eclipse para SAPUI5. Podemos hacer desarrollos e incluso ampliaciones y probarlod en un sandbox local que cuenta con un Fiori Launchpad.
Así que, aunque siempre hemos hablado del Web IDE, en este artículo vamos a ver cómo instalar Eclipse y el software necesario para trabajar con SAPUI5 y Fiori. Vamos a ver los siguientes puntos:
Está claro que SAP ha apostado bien fuerte por usar su Web IDE como aplicación para desarrollar aplicaciones SAPUI5 y, aunque se siga manteniendo el desarrollo de SAP UI5 en Eclipse, hay una cosa con la que aún no podemos contar en esta herramienta: Con las plantillas predefinidas.
En su momento, en la antigua version Eclipse Juno, existía un add-on que podíamos añadir, el Fiori Toolkit, para hacer una aplicación de tipo Master-Detail. Pero se le dejó de dar soporte hace años. Hoy por hoy, no contamos con algo específico y con soporte que cuente con plantillas predefinidas.
Pero eso no quiere decir que no podamos usar Eclipse para SAPUI5. Podemos hacer desarrollos e incluso ampliaciones y probarlod en un sandbox local que cuenta con un Fiori Launchpad.
Así que, aunque siempre hemos hablado del Web IDE, en este artículo vamos a ver cómo instalar Eclipse y el software necesario para trabajar con SAPUI5 y Fiori. Vamos a ver los siguientes puntos:
- Cómo instalar Eclipse en nuestro ordenador.
- Añadir en Eclipse las ABAP Development Tools y la librería de SAPUI5.
- Instalar localmente un servidor web para poder probar nuestros desarrollos.
- Crear una aplicación SAPUI5 sencilla para probar (un Hola Mundo).
- Configurar el Fiori Launchpad en nuestro sandbox (localmente).
Suscribirse a:
Entradas (Atom)