Chapter 3a: Displaying different picture formats (JEDI-SDL)

This is an SDL 1.2 chapter. SDL 1.2 is obsolete since it has been replaced by SDL 2.0. Unless you have good reasons to stay here you may prefer to go for the modern SDL 2.0 :-).

In the previous chapter it was shown how to load bitmap images in the bitmap format. You may have wondered if there is a possibility to load other formats than bitmap images. The JEDI-SDL package provides a unit called SDL_IMAGE which exactly is created for this purpose. The following formats you can load according to the unit’s C/C++ documentation: TGA, BMP, PNM, XPM, XCF, PCX, GIF, JPG, TIF, LBM, PNG. I had troubles loading XCF images which is probably due to the fact this format is not standardized.

You need this .dll file to work successfully with the new unit:

Software Version Source Description
SDL_image-1.2.7-win32.zip 1.2.7 http://www.libsdl.org/projects/SDL_image/ This is the corresponding dynamic link library file for unit and image formats.

You should extract the zip-file and get six files. A text file, the important SDL_image.dll and several image format DLLs. Analogous to SDL.dll in chapter 1 you have to copy them to the system32-folder. If you forget this and run the examples below you will get an error with exitcode = 309.

After installation of the unit we now can proceed to the source code.

PROGRAM chap3;
USES SDL, SDL_IMAGE, STRINGS;

CONST
//add the path to your files here
picturepath:PCHAR = 'C:\FPC\2.2.4\my_images\fpsdl.';

VAR
screen:pSDL_SURFACE;
picture: ARRAY[0..2] OF pSDL_SURFACE;
fileextension: ARRAY[0..2] OF PCHAR;
filepath: ARRAY[0..2] OF PCHAR;
i:BYTE;

BEGIN
SDL_INIT(SDL_INIT_VIDEO);
screen:=SDL_SETVIDEOMODE(200,200,32,SDL_SWSURFACE);
IF screen=NIL THEN HALT;


fileextension[0]:='png';
fileextension[1]:='jpg';
fileextension[2]:='tif';

FOR i:=0 TO 2 DO
BEGIN
  filepath[i]:=STRNEW(picturepath);
  filepath[i]:=STRCAT(filepath[i],fileextension[i]);

  picture[i] := IMG_LOAD(filepath[i]);
  IF picture[i]=NIL THEN HALT;

  SDL_BLITSURFACE(picture[i],NIL,screen,NIL);
  SDL_FLIP(screen);
  READLN;
END;

FOR i:=0 TO 2 DO
BEGIN
  SDL_FREESURFACE(picture[i]);
  STRDISPOSE(filepath[i]);
END;
SDL_FREESURFACE(screen);
SDL_QUIT;
END.

The code shows the same picture known from chapter 3 in three different formats: PNG, JPG and TIF. You should download them (right-click onto each image and save) and put them at a desired location of your hard drive. Don’t worry if the tif image isn’t shown properly in your web browser. Since it isn’t a native web image format most web browsers don’t support it. However you can still download it.

tif image - usually not shown
TIF image – usually not supported natively by browsers to be displayed
Free Pascal example image in different formats
JPEG images
fpsdl
PNG image
PROGRAM chap3;
USES SDL, SDL_IMAGE, STRINGS;

First we need to include the SDL unit, of course we need also the SDL_IMAGE unit. The STRINGS unit is needed to handle file pathes a simple and short way. The latter unit is not related to the SDL library.

CONST
//add the path to your files here
picturepath:PCHAR = 'C:\FPC\2.2.4\my_images\fpsdl.';

VAR
screen:pSDL_SURFACE;
picture: ARRAY[0..2] OF pSDL_SURFACE;
fileextension: ARRAY[0..2] OF PCHAR;
filepath: ARRAY[0..2] OF PCHAR;
i:BYTE;

Now we define a constant, which contains the absolute path to the image files. The path is C:\FPC\2.2.4\my_images\. Of course you are free to choose any other location. Each file is named “fpsdl.” and the corresponding extension, like “bmp” for bitmap image, “png” for portable network graphics image, and so on. They all lie in the folder my_images.

In the variables part we define the screen surface again and an array of picture surfaces, all of kind pSDL_SURFACE. The screen surface decides what is shown at the display and the picture surfaces will store the images from image files of different formats. Next two arrays for the file extensions of the different image formats (bmp, png,…) and the image file paths are defined and of kind PCHAR. Finally we define the counter variable i.

BEGIN
SDL_INIT(SDL_INIT_VIDEO);
screen:=SDL_SETVIDEOMODE(200,200,32,SDL_SWSURFACE);
IF screen=NIL THEN HALT;


fileextension[0]:='png';
fileextension[1]:='jpg';
fileextension[2]:='tif';

As usual we start by initating the SDL library, defining a 200 x 200 pixels window and check if it was successful. The next part defines the different file extensions we want to use. In this example we will show the ability of SDL_IMAGE to load png, jpg and tif images. Feel free to try out all the other common formats by extending this demo program. Again I’d like to mention that I experienced troubles loading GIMP’s images in XCF format.

FOR i:=0 TO 2 DO
BEGIN
  filepath[i]:=STRNEW(picturepath);
  filepath[i]:=STRCAT(filepath[i],fileextension[i]);

  picture[i] := IMG_LOAD(filepath[i]);
  IF picture[i]=NIL THEN HALT;

  SDL_BLITSURFACE(picture[i],NIL,screen,NIL);
  SDL_FLIP(screen);
  READLN;
END;

The presented loop is the core of this demo program. It shows the preparation of the file locations and names, the creation of the image surfaces and the final blit to the screen surface to display them.

The loop will be cycled three times, once for each file. First we reseve some space on the heap and insert the constant file string by STRNEW. Next we concatenate the file path and the extension by STRCAT. For these operations we needed to include the STRINGS unit. Both commands aren’t related to the SDL library.

Then IMG_LOAD(absolute path/image file) function allows to load image data from image files with many different image formats to a surface. That is the key function of this demo program. However, be aware that the image data loaded to the surface is not compressed anymore and is stored in the usual RGBA format of SDL surfaces. The function returns NIL if it failed.

Since the example pictures have the same dimensions as the screen surface they can be blitted easily by SDL_BLITSURFACE as shown. The screen gets refreshed by SDL_FLIP. Both commands you know from the recent chapter. Finally we wait for the user to press enter after each cycle.

FOR i:=0 TO 2 DO
BEGIN
  SDL_FREESURFACE(picture[i]);
  STRDISPOSE(filepath[i]);
END;
SDL_FREESURFACE(screen);
SDL_QUIT;
END.

Now we have to clean up anything. The loop disposes the picture surfaces and the path strings. Finally the screen surface gets disposed and the SDL environment quit by SDL_QUIT. Except for STRDISPOSE you should remember any command from previous chapters. STRDISPOSE is a command from STRING unit, so again no SDL library related command.

This file contains the source code: chap3a.pas (right click and “save as”).
For this chapter no executable is provided.

Hope you are successful and have fun.

The final result should look and behave like this: First the “Free Pascal meets SDL” image appears in one of the the image formats (different of bitmap). Everytime you press return (or enter) in the console the same image with another format is displayed until the program quits.

Result of JEDI-SDL Chapter 3a

Leave a Reply

Your email address will not be published. Required fields are marked *