2.2. Aspecto visual

2.2.1. Anatomía de una ventana gvHidra

Antes de empezar a programar vamos a entender la anatomía de una ventana gvHidra.

Una ventana de gvHidra está dividida en 4 secciones:

  • Barra superior (1)

    En esta barra aparece alineado a la izquierda el título de la ventana, y, alineado a la derecha aparecerán, si los hay, botones tooltip. Botones tooltip son botones que efectúan acciones relacionadas con la interfaz.

  • Contenedor (2)

    Donde se ubicará el formulario con los datos y campos con los que trabajaremos.

  • Barra inferior (3)

    En ella, alineado a la izquierda, se ubicará el paginador y, alineados a la derecha aparecerán los botones.

  • Contenedor de pestañas (4)

    En esta zona irán apareciendo pestañas con las que podremos cambiar el modo de trabajo (búsqueda, listado, registro...)

2.2.2. Modos de trabajo y ventanas gvHidra

La forma de trabajar con las ventanas gvHidra se ha clasificado por modos de trabajo. Definiendo modo de trabajo como la forma de representación de la información con la que vamos a trabajar. Estos modos de trabajo se verán reflejados tanto en la zona Contenedor (2) del panel como en la de Contenedor de pestañas (4), la pestaña nos indicará el modo activo.

Los modos que tenemos son tres que se corresponden con las pestañas:

  1. Búsqueda o filtro:

  2. Tabular o listado:

  3. Registro o edición:

Partiendo de todo lo comentado, tenemos dos formas de trabajar en gvHidra:

  1. Dos modos de trabajo

    Con esto nos referimos a la forma de trabajar, en este caso partimos de una búsqueda y el resultado se muestra en una tabla o ficha, donde los datos ya son accesibles en cada uno de estos modos.

    Ej. Modo búsqueda/tabla

    Ej. Modo búsqueda/ficha

  2. Tres modos de trabajo

    En este caso es una combinación de los dos anteriores. Se parte de un panel de búsqueda, el resultado de dicha búsqueda se mostrará en un panel tabular. En este panel tabular los datos no son accesibles, solamente se podrá efectuar el borrado de las tuplas que se seleccionen, para inserción o modificación se pasa a un panel modo ficha.

    Ej. Modo búsqueda/tabla/ficha

2.2.3. Patrones de interfaz

Una vez visto la estructura de la ventana y los modos de trabajo disponibles podemos pasar a explicar los diferentes patrones de interfaz que se pueden implementar con gvHidra.

Todos los patrones tienen en común el modo búsqueda:

[NOTA: Una buena práctica es utilizar el prefijo "fil" para denominar algunos parámetros o nombres de variables que hagan referencia al panel de búsqueda.]

Patrones:

  1. Tabular

    Se corresponde con la forma de trabajo dos modos de trabajo, panel de búsqueda y panel tabular donde se trabajará con los datos.

    [NOTA: Una buena práctica es utilizar el prefijo "lis" para denominar algunos parámetros o nombres de variables que hagan referencia al panel tabular.]

  2. Registro

    Se corresponde con la forma de trabajo dos modos de trabajo, panel de búsqueda y panel registro donde se trabajará con los datos.

    [NOTA: Una buena práctica es utilizar el prefijo "edi" para denominar algunos parámetros o nombres de variables que hagan referencia al panel registro.]

  3. Tabular-Registro

    Este caso corresponde a la forma de trabajo de tres modos. Un panel de búsqueda, un panel tabular donde se tendrá el resultado de la búsqueda y un panel registro donde se podrán editar los campos de las tuplas seleccionadas en el panel tabular o insertar nuevas tuplas.

    Modo tabular:

    Modo registro:

  4. Maestro-Detalle

    La parte del maestro será del tipo dos modos de trabajo, un panel búsqueda y un tabular o registro. En cambio en la parte correspondiente al detalle se puede plantear la forma de trabajar como dos modos (tener un sólo tabular o registro) o tres modos (tabular y registro), con la excepción de que en el detalle no tenemos búsqueda.

    De esto podemos obtener diferentes combinaciones para un maestro-detalle:

    • Maestro tabular - Detalle tabular

    • Maestro tabular - Detalle registro

    • Maestro registro - Detalle tabular

    • Maestro registro - Detalle registro

    • Maestro tabular - Detalle tabular-registro

    • Maestro registro - Detalle tabular-registro

    Ej. Maestro registro - Detalle tabular:

    Además de estos patrones para el maestro-detalle contamos con un patrón más complejo, el Maestro – N Detalles. Este patrón es una extensión de cualquiera de los indicados anteriormente, tendremos un maestro que tendrá varios detalles asociados. Estos detalles están accesibles mediante unas solapas que aparecerán en la cabecera de la zona del detalle.

    Ej. Maestro registro - N Detalles:

  5. Árbol

    El patrón árbol se compone de dos zonas. En la zona de la izquierda encontramos el árbol en sí, una jerarquía de menús, seleccionando cualquiera de ellos accedemos a su información que aparecerá representada en la zona de la derecha. Esta información podemos decidir representarla con un patrón Tabular, Registro o Tabular-Registro.

    Ej. Árbol: