Entorno de desarrollo gráfico para IBM i

Tutorial SilverDev ¿Cómo insertar una imagen en una aplicación?

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 2/ 20

¿De qué trata este tutorial?

1. Crear un nuevo programa ................................................................................. 3

2. Insertar una imagen almacenada en la computadora ...................................... 6

3. Compilación ....................................................................................................... 8

4. Primera puesta a disposición ............................................................................ 9

5. Insertar imágenes dinámicas ........................................................................... 11

6. Cargar desdel el IFS: La función sdSetImg ...................................................... 13

7. Cargar desde la computadora: función sdLoadFromFile ................................ 15

8. Las diferentes funciones de transferencia de imágenes y ficheros: ............... 19

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 3/ 20

1. Crear un nuevo programa

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

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 4/ 20

Crear un nuevo programa con el icono « + » en la pestaña Context. Este programa de ejemplo se llamará DEMO_IMG.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 5/ 20

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

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 6/ 20

2. Insertar una imagen almacenada en la computadora

En la pestaña Components, hacer clic en el icono del componente CImage

Y hacer clic en el lugar donde se desea insertar la imagen en la pantalla :

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 7/ 20

En la pestaña Inspector, la propiedad TPicture permite seleccionar una imagen. Hacer clic en el botón « … » para abrir el cuadro de diálogo

correspondiente

En el cuadro de diálogo, hacer clic en Load para seleccionar la imagen desde la computadora.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 8/ 20

3. Compilación

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

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 9/ 20

4. Primera puesta a disposición

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 fichero y el comando call. En la pantalla siguiente, seleccionar las autorizaciones de la aplicación.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 10/ 20

La aplicación está lista, la imagen está almacenada en la pantalla compilada en el IBM i.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 11/ 20

5. Insertar imágenes dinámicas

Crear un nuevo programa Colocar un componente CImage, Y un componente CButton que le permitirá al usuario cargar la imagen.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 12/ 20

Renombrarlo en la pestaña Properties, cambiando el valor de Caption

Luego, en la pestaña Events, seleccionar y hacer doble clic en el

evento OnClick

El código aparece automáticamente :

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 13/ 20

6. Cargar desdel el IFS: La función sdSetImg

Utilizamos la función sdSetImg para cargar la imagen desde el IFS : Puede servirse del auto-completar (ctrl + espacio) para terminar automáticamente la sintaxis de una función

Declarar la imagen

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 14/ 20

Compilar y poner a la disposición de los usuarios

Sugerencias: Las propiedades Stretch y Proportional permiten ajustar el tamaño de la imagen a la zona del componente CImage. Para adaptar el componente a la pantalla, dar el valor alClient a la propiedad Align.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 15/ 20

7. Cargar desde la computadora: función sdLoadFromFile

Como lo hicimos desde el IFS, vamos a cargar una imagen almacenada en la computadora. Crear otro botón, “Load from PC or NetWork”.

Este secundo botón también se asocia al evento OnClick.

Fuente Pantalla

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 16/ 20

Para cargar la imagen, esta vez utilizamos la función sdLoadFromFile

Aquí está completada con nuestra imagen :

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 17/ 20

El código fuente final :

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 18/ 20

Guardar y compilar la pantalla, generar el programa y abrirlo en MyDesk. La aplicación se actualizó automáticamente con la nueva imagen.

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 19/ 20

8. Las diferentes funciones de transferencia de imágenes y ficheros:

Tutorial: Insertar una imagen en una pantalla

SilverDev by Experia – Todos derechos reservados -- 20/ 20

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