ZenGL Tutorial 2/es

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

ZenGL/es | Tutorial 1 | Tutorial 2 | Tutorial 3 | Edit

Este tutorial muestra como crear una Fuente ZenGL (.zfi) y como dibujar texto.

Crear Fuente ZenGL

Para crear una fuente ZenGL necesitas descargar ZenFont que es un generador de fuentes.

Cuando obtengas ZenFont abrelo y verás algo parecido a esto:

Agency FB-Regular-18pt.zfi

Usa las opciones para personalizar tu fuente y luego presiona "Save font" y elige el nombre de archivo que quieras (un nombre de archivo es generado automáticamente con el nombre de la fuente y el tamaño). Los archivos generados son los .zfi con algunas imágenes .tga.

Una vez que tenemos la fuente creada necesitamos seguir estos pasos para dibujar en la ventana de ZenGL.

Crear programa

• Crea un nuevo programa de pascal y añade referencia a ZenGL como fue explicado en el primer tutorial.

• Crea estos directorios:

projectname\bin

projectname\data

projectname\project

• Save your project in "projectname\project".

• Coloca la fuente que has creado en "projectname\data"

• Ve a Proyecto > Opciones > Rutas en Nombre del archivo final escribe "..bin\project1".

Agrega codigo

Variables: <delphi>var

 dirRes     : String {$IFNDEF DARWIN} = '../data/' {$ENDIF}; // este es el directorio donde se colocan los recursos
 fnt        : zglPFont; // esta es la fuente que usaremos </delphi>

Carga la fuente en una variable: <delphi>procedure Init; begin

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

end; </delphi>

Procedimiento de dibujo (aqui dibujaremos nuestro texto con la fuente cargada): <delphi>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; </delphi>

Este es un codigo para salir de nuestra aplicación presionando ESC: <delphi>procedure Timer; begin

 if key_Press( K_ESCAPE ) Then zgl_Exit();
 key_ClearState();

end; </delphi>

Resultado

Puedes ver el texto con la fuente que creamos y otro texto escalado con alpha.

El codigo resultante es algo parecido a esto:

<delphi>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. </delphi>