Entorno de desarrollo gráfico para IBM i

Tutorial SilverDev ¿Cómo crear un gráfico?

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 2/ 19

¿De qué trata este tutorial?

1. Creación de un nuevo programa .................................................................... 3

2. Preparación de la pantalla .............................................................................. 6

3. Elección del tipo de gráfico ............................................................................ 9

4. Inserción de los datos ................................................................................... 11

5. Compilación .................................................................................................. 14

6. Creación de un CLP ....................................................................................... 15

7. Puesta a disposición en MyDesk .................................................................. 17

8. Resultado ...................................................................................................... 18

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 3/ 19

1. Creación de un nuevo programa

Poner en marcha SilverDev Designer y seleccionar una biblioteca en el menú Tools > Context. Aquí seleccionamos la biblioteca SILVERDEMO

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 4/ 19

Crear un nuevo programa con el icono « + » en la pestaña Context.

Este programa contendrá SQL : Seleccionar el tipo SVDSQLRPG

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 5/ 19

El nombre del programa aparece en el listado del contexto. Hacer doble clic para abrirlo

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 6/ 19

2. Preparación de la pantalla Creamos primero una zona de separación arriba de la pantalla con el componente CPanel, en la pestaña Components. Hacer clic en el icono y otro clic en la pantalla para colocarlo. Para que el componente se adapte al tamaño de la pantalla, utilizar, en la pestaña Inspector, la valor alTop de la propiedad Align.

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 7/ 19

Creamos el botón que servirá a cargar los datos.

Utilizar el componente CButton, y nombrarlo "Load" con su propiedad Caption en la pestaña Inspector

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 8/ 19

Preparamos la zona de visualización del gráfico: Utilizar el componente CChart.

Con valor alClient de la propiedad Align, el componente llena todo el resto de la pantalla.

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 9/ 19

3. Elección del tipo de gráfico

Hacer doble clic en la zona del gráfico.

Aparece esta pop-up. Hacer clic sobre el icono "nuevo" arriba a la

izquierda para insertar una nueva serie.

En este cuadro de diálogo se elige el tipo de gráfico. Aquí seleccionamos el gráfico circular.

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 10/ 19

La pantalla está lista para recibir los datos. Cuidado, en esta pantalla sólo se previsualiza el fúturo gráfico. No contiene datos reales.

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 11/ 19

4. Inserción de los datos

Volver al botón Load para cargar los datos. Seleccionarlo en la pantalla

En la pestaña Events, seleccionar OnClick y crear el evento con una doble clic

El código correspondiente se añade automáticamente en la fuente:

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 12/ 19

Recuperamos datos de dos tablas incluidas en la biblioteca de demostración de SilverDev: Una tabla que contiene un listado de libros (sddmbks) y otra que contiene los temas de estos libros (sddmthm). En el gráfico, visualizaremos el número de libros en cada uno de los temas.

Declaramos las variables :

Y preparamos la consulta SQL :

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 13/ 19

Antes de insertar el resultado de la consulta en la pantalla, hace falta limpiar los datos previos para que no se superpongan.

Para ésto, utilizar la función SilverDev sdSeriesClear:

Ahora se puede añadir los datos en la serie contenida en el gráfico, con la función SilverDev sdAddPie :

Consejo : La tecla F1 permite acceder a la ventana de ayuda de las funciones SilverDev

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 14/ 19

5. Compilación

Guardar y compilar la pantalla desde el menú Forms En el menú Compiling, generar el programa.

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 15/ 19

6. Creación de un CLP

Para poner la aplicación a disposición de los usuarios, se necesita un CLP:

Crear en un nuevo miembro En el que añadir la biblioteca y llamar el programa

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 16/ 19

Guardarlo

Y compilarlo :

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 17/ 19

7. Puesta a disposición en MyDesk Poner en marcha MyDesk y, en el lugar donde se quiere poner la nueva aplicación, hacer un clic derecho y “New Application”. Llenar el cuadro de diálogo con el nombre de la nueva aplicación, el nombre del programa y el comando call para llamar el CLP En la pantalla siguiente, seleccionar las autorizaciones de la aplicación.

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 18/ 19

8. Resultado

Se puede poner en marcha la aplicación, y cargar los datos haciendo clic en el botón Load :

SilverDev – Tutorial – Crear un gráfico

Experia Europe -- Derechos reservados -- 19/ 19

Más información en www.silverdev.com