Learn how to insert static or dynamic pictures in IBM i applications.

1. Graphical RPG Framework for IBM i
SilverDev Tutorial
How to Insert a Picture on IBM i Applications?

2. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 2/ 20
Steps:
1. Build a new program .................................................................................................................. 3
1. Insert a Static Picture ................................................................................................................. 6
2. Compilation ................................................................................................................................ 8
3. 1st deployment ........................................................................................................................... 9
4. Insert Pictures Dynamically ...................................................................................................... 11
5. Load from IFS: sdSetImg function ............................................................................................ 13
6. Load from a PC: sdLoadFromFile function ............................................................................... 15
7. Image or file transfer functions on SilverDev ........................................................................... 19

3. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 3/ 20
1. Build a new program
Launch SilverDev Designer and select a context from the menu Tools > Context.

4. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 4/ 20
Use the « + » icon to create your new program, in the Context tab

5. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 5/ 20
Your program appears on the Context tab list
Double-click it to open it

6. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 6/ 20
1. Insert a Static Picture
On the Components tab,
click the icon of the CImage component
Then, on your form (press F10 to open it), click where you want to place the picture

7. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 7/ 20
On the Inspector tab, use the TPicture property
to select your image:
Click on « … » to open the dialog box
And click on « Load » to select a picture stored on your PC

8. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 8/ 20
2. Compilation
Save and compile your form
Then, on the Compiling menu,
generate the program.

9. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 9/ 20
3. 1st deployment
Launch MyDesk and right click where you want to make your application available. Then, choose « New application »
Fill the dialog box with the application title, the file name and the call command.
On the next screen, select the app authorizations.

10. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 10/ 20
Your application is ready. The picture is stored on the compiled screen, on the IBM i.

11. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 11/ 20
4. Insert Pictures Dynamically
Build a new screen
And place on it a CImage compotent,
and a CButton component for the user to load the picture

12. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 12/ 20
Change its name with the
Property Caption.
Then, on the Events tab, select and double-click the OnClick event.
The source file is already filled in:

13. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 13/ 20
5. Load from IFS: sdSetImg function
Use the sdSetImg SilverDev function to load a picture from the IFS.
Tip: Use auto-completion (ctrl+space) to get the syntax.
Declare your picture:

14. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 14/ 20
Compile and make it available for the users.
Tips:
Resize the picture with Stretch and Proportional Properties,
Adapt it to the screen with the Align property

15. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 15/ 20
6. Load from a PC: sdLoadFromFile function
Add a new CButton, associated to an OnClick Event, to load another picture from a PC or a Network
Source
Result

16. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 16/ 20
To load the picture, use sdLoadFromFile SilverDev function
Here’s the completed code:

17. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 17/ 20
The complete source code:

18. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 18/ 20
Save and compile the form, generate your program and just launch it on MyDesk.
It updated automatically to display your new picture:

19. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 19/ 20
7. Image or file transfer functions on SilverDev

20. SilverDev – Tutorial – Insert a Picture
Experia Europe – All Rights Reserved -- 20/ 20
More information on www.silverdev.com
EXPERIA Europe
4, rue L.Beridot
Les jardins d'Epione
38500 VOIRON - FRANCE
www.experia.com
info@experia.com