Introducción

Hasta el momento, desde que APEX cuenta con el Acumulador de Temas (Themes Roller), podemos crear nuevos temas y guardarlos.

Cuando guardamos estos nuevos temas, estos se mantienen dentro de APEX, como parte integra de la aplicación en la que creamos estos temas.

Una de las nuevas características de la versión 23.1 de APEX, nos permitirá dar un paso más en este sentido, lo que permitirá facilitar más aún el trabajo del desarrollador.

Exportar/Importar Temas

A partir de la versión 23.1 de APEX, que pronto estará disponible, vamos a tener la oportunidad de exportar e importar temas al acumulador de temas.

¿Pero, qué significa esto?

Esto significa que tenemos la oportunidad de crear un nuevo tema en una aplicación y una vez completado, además de cuardarlo, podemos exportarlo y de esta manera importarlo a otras aplicaciones de manera transparente y sin ningún problema, sin necesidad de volver a realizar todo el trabajo de definición en esta nueva aplicación.

El proceso de exportación, crea un archivo JSON con los datos de nuestro nuevo tema, específicamente los cambios realizados sobre el tema original.

Si exportamos uno de los temas que por defecto proporciona APEX, vamos a obtener un archivo JSON con un ceontenido como el siguiente:

Este archivo está compuesto por una matriz de “classes”, un objeto “vars”, un elemento “CustomCSS” y otro elemento “useCustomLess”, que en este caso podemos ver que para los tres primeros, no existen valores definidos.

Pero veamos como llegar hasta este punto.

Para poder realizar cambios a un tema, es necesario ejecutar nuestra aplicación como desarrolladores, o sea, con el ambiente de desarrollo abierto, de manera que tengamos la barra del desarrollador abierta a la hora de ejecutar la aplicación.

Para crear un nuevo tema y poder exportarlo, al ejecutar la aplicación como desarrolladores debemos:

1. Hacer clic en la opción Personalizar
2. Seleccionar Acumulador de Temas

De esta manera podemos abrir la ventana del acumulador de temas, que se muestra a continuación.

Una vez abierta la ventana del Acumulador de Temas:

1. Seleccionamos el tema sobre el que queremos trabajar, en esta caso Vita
2. Realizamos todas las modificaciones que queremos para nuestro tema, en cada una de las secciones disponibles: Colores Globales, Contenedores, Navegación, Regiones, Estados, Paleta, Botones, Pantallas, Informes Interactivos, Diseño y CSS Personalizado
3. Si queremos, podemos guardar los cambios en un nuevo tema, con ayuda de los botones Guardar o Guardar como.

Hasta este momento no hemos hecho nada diferente a lo que acostumbramos hacer cuando personalizamos temas de APEX. La parte nueva e interesante viene a continuación.

Como pueden observar en la imagen de arriba, en la esquina inferior derecha, a la derecha del botón Guardar como, existe un nuevo botón que lo que muestra es un icono con tres puntos verticales, al hacer clic sobre este botón, se va a desplegar un nuevo menú, tal y como lo muestra la imagen siguiente.

El menú desplegable muestra 3 opciones:

• Importar
• Exportar
• Restablecer

Para exportar el nuevo tema que hemos creado, vamos a hacer clic en la opción Exportar, lo que abrirá una ventana del navegador de archivos de nuestra computadora y nos va a permitir guardar en nuestro disco, un archivo JSON que contiene los elementos modificados, así como el valor definido para estos.

El código anterior muestra nuestro archivo exportado luego de haber realizado algunos cambios en diferentes secciones del tema.

Específicamente, podemos ver que ahora el objeto “vars”, está compuesto por nueve elementos con sus respectivos valores, los cuales corresponden a los elementos cambiados en el tema original.

Como ya tenemos los cambios en un archivo en nuestra computadora, ahora podemos aplicar estos cambios a cualquier aplicación existente o cualquier nueva aplicación.

Para realizar esta operación de aplicar a otras aplicaciones, ejecutamos un proceso de Importar de la siguiente manera, siempre conectados como desarrolladores.

1. Ejecute la aplicación a la que desea aplicar el nuevo tema
2. En la barra del desarrollador, haga clic en Personalizar
3. Seleccione Acumulador de Temas
4. Haga clic en el botón del menú desplegable de la ventana del Acumulador de Temas (el botón con los tres puntos verticales)
5. Seleccione Importar
6. Busque en la ventana del explorador de archivos el archivo JSON correspondiente al tema que desea importar y seleccioneló
7. Haga clic en el botón Guardar

Como puede observar en la imagen anterior, al aplicarse el nuevo tema, se mostrará en la parte superior un mensaje indicando que el proceso se realizó exitosamente.

Así de fácil vamos a Exportar e Importar nuevos temas en nuestras aplicaciones APEX.

Ahora todo lo que necesitamos es un excelente diseñador gráfico que con la ayuda del acumulador de temas, cree para nosotros un nuevo tema, consistente en todo sentodo y que cumpla con los criterios técnicos de accesibilidad y comodidad para los usuarios.

Si es importante hacer notar lo siguiente:

Oracle APEX pode defecto proporciona 4 versiones diferentes del tema Vita, más el tema Redwood Light y debemos diferenciar entre los cuatro primeros y el último, ya que Redwood Ligth utiliza variables diferentes a las utilizadas por los otro cuatro temas, de manera que las modificaciones que hagamos sobre el tema Redwood Ligth no las vamos a poder aplicar sobre los otros temas y viceversa.

¿Quieres saber más?

Si deseas conocer más sobre este tema y las nuevas características de APEX 23.1, puedes consultar el documento en los enlaces a continuación:

Oracle APEX 23.1 Nuevas Características