[Tutorial] Insertar una imagen en una aplicación IBM i con SilverDev
1. Entorno de desarrollo gráfico para IBM i
Tutorial SilverDev
¿Cómo insertar una imagen en una aplicación?
2. 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
3. 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
4. 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.
5. 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.
6. 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 :
7. 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.
8. 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.
9. 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.
10. 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.
11. 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.
12. 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 :
13. 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
14. 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.
15. 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
16. 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 :
17. Tutorial: Insertar una imagen en una pantalla
SilverDev by Experia – Todos derechos reservados -- 17/ 20
El código fuente final :
18. 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.
19. 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:
20. Tutorial: Insertar una imagen en una pantalla
SilverDev by Experia – Todos derechos reservados -- 20/ 20
Más información en www.silverdev.com