Difference between revisions of "ZenGL Tutorial 2/fr"

From Free Pascal wiki
Jump to navigationJump to search
(Created page with "{{ZenGL Tutorial 2}} {{ZenGL Tutorial Index/fr}} Ce tutoriel vous montre comment créer une fonte ZenGL (.zfi) et comment dessiner du texte. == Créer une fonte ZenGL == T...")
 
Line 7: Line 7:
 
== Créer une fonte ZenGL ==
 
== Créer une fonte ZenGL ==
  
To create a ZenGL Font you need to download [http://zengl.org/download.html ZenFont] that is a Font generator.
+
Pour créer une fonte ZenGL, vous avez besoin télécharger [http://zengl.org/download.html ZenFont] qui est un générateur de fonte.
  
When you got ZenFont open it and you will see something like this:
+
Après l'avoir obtenu, ouvrez-le et vous verrez quelque chose comme ceci :
  
 
[[Image:zenfont.png]]
 
[[Image:zenfont.png]]
Line 15: Line 15:
 
''Agency FB-Regular-18pt.zfi''
 
''Agency FB-Regular-18pt.zfi''
  
Use the options to customize your font and then press "Save font" and chose the filename you want (some filename is generated automatically with
+
Utilisez les options pour personnaliser votre fonte puis pressez sur "Save font" et choisissez le nom de fichier que vous voulez (certain nom de fichier sont générés automatiquement avec le nom de la fonte et sa taille. Les fichiers générés sont le fichier .zfi et quelques images .tga.
  
the font name and size). The files generated are the .zfi file with some .tga images.
+
Une fois que vous avez créé une fonte, vous avez besoin de suivre ces étapes pour dessiner dans la fenêtre ZenGL.
 
 
Once we have a font created we need to follow those steps to draw in the ZenGL window.
 
  
 
== Create program ==
 
== Create program ==

Revision as of 08:53, 9 December 2016

English (en) español (es) français (fr) русский (ru)


ZenGL | Tutoriel 1 | Tutoriel 2 | Tutoriel 3 | Edit

Ce tutoriel vous montre comment créer une fonte ZenGL (.zfi) et comment dessiner du texte.

Créer une fonte ZenGL

Pour créer une fonte ZenGL, vous avez besoin télécharger ZenFont qui est un générateur de fonte.

Après l'avoir obtenu, ouvrez-le et vous verrez quelque chose comme ceci :

zenfont.png

Agency FB-Regular-18pt.zfi

Utilisez les options pour personnaliser votre fonte puis pressez sur "Save font" et choisissez le nom de fichier que vous voulez (certain nom de fichier sont générés automatiquement avec le nom de la fonte et sa taille. Les fichiers générés sont le fichier .zfi et quelques images .tga.

Une fois que vous avez créé une fonte, vous avez besoin de suivre ces étapes pour dessiner dans la fenêtre ZenGL.

Create program

  • Create a new pascal program and add reference to ZenGL like was explained in the first tutorial.
  • Create those directories:

projectname\bin

projectname\data

projectname\project

  • Save your project in "projectname\project".
  • Put the font you has created in "projectname\data"
  • Go to Project > Options > Paths in Target file name write "..\bin\project1".

Add code

Variables:

var
  dirRes     : String {$IFNDEF DARWIN} = '../data/' {$ENDIF}; // this is the directory where resources are placed
  fnt        : zglPFont; // this is the font we will use

Load the font in a variable:

procedure Init;
begin
  fnt := font_LoadFromFile( dirRes + 'Agency FB-Regular-18pt.zfi' );
end;

Draw procedure (here we will draw our text with the loaded font):

procedure Draw;
var
  rect: zglTRect;
begin
  text_Draw( fnt, 0, 0, 'Sample Text. Press ESC to EXIT.' );

  text_DrawEx( fnt, 32, 32, 1.5, 0, 'Sample Text with DrawEx - Scale 1.5 - Alpha 150', 150 );

  rect.H:=128;
  rect.W:=400;
  rect.X:=0;
  rect.Y:=96;

  pr2d_rect(rect.X,rect.Y,rect.W,rect.H,$FFFFFF,100);

  text_DrawInRect(fnt,rect,
  'Sample multiline text in rect.' + #10 +
  'Sample multiline text in rect.'+ #10 +
  'Sample multiline text in rect.');
end;

This is some code to exit our application pressing ESC:

procedure Timer;
begin
  if key_Press( K_ESCAPE ) Then zgl_Exit();
  key_ClearState();
end;

Result

You can see text with the font we created and other text scaled with alpha.

zengltext.png

The resulting code is something like this:

program project1;

{$IFDEF WINDOWS}
  {$R *.res}
{$ENDIF}
{$DEFINE STATIC}

uses
  {$IFNDEF STATIC}
  zglHeader
  {$ELSE}
  zgl_main,
  zgl_screen,
  zgl_window,
  zgl_timers,
  zgl_keyboard,
  zgl_font,
  zgl_text,
  zgl_textures,
  zgl_textures_tga,
  zgl_primitives_2d,
  zgl_utils,
  zgl_math_2d
  {$ENDIF}
  ;

var
  dirRes     : String {$IFNDEF DARWIN} = '../data/' {$ENDIF};
  fnt        : zglPFont;

procedure Init;
begin
  fnt := font_LoadFromFile( dirRes + 'Agency FB-Regular-18pt.zfi' );
end;

procedure Draw;
var
  rect: zglTRect;
begin
  text_Draw( fnt, 0, 0, 'Sample Text. Press ESC to EXIT.' );

  text_DrawEx( fnt, 32, 32, 1.5, 0, 'Sample Text with DrawEx - Scale 1.5 - Alpha 150', 150 );

  rect.H:=128;
  rect.W:=400;
  rect.X:=0;
  rect.Y:=96;

  pr2d_rect(rect.X,rect.Y,rect.W,rect.H,$FFFFFF,100);

  text_DrawInRect(fnt,rect,
  'Sample multiline text in rect.' + #10 +
  'Sample multiline text in rect.'+ #10 +
  'Sample multiline text in rect.');
end; 

procedure Timer;
begin
  if key_Press( K_ESCAPE ) Then zgl_Exit();
  key_ClearState();
end;

Begin
  {$IFNDEF STATIC}
  zglLoad( libZenGL );
  {$ENDIF}

  timer_Add( @Timer, 16 );

  zgl_Reg( SYS_LOAD, @Init );
  zgl_Reg( SYS_DRAW, @Draw );

  zgl_Enable( APP_USE_UTF8 );

  wnd_SetCaption( 'Sample Text' );

  wnd_ShowCursor( TRUE );

  scr_SetOptions( 800, 600, REFRESH_MAXIMUM, FALSE, FALSE );

  zgl_Init();
End.