Tutorial 1: Creating a simple Asphyre eXtreme application...

 

Step 1. Create a new Delphi application. Change ClientWidth of your form to 640 and ClientHeight to 480. 

 

Step 2. Nagivate to Asphyre tab in Delphi. It may look like this:

 

 

 

Step 3. Drop TAsphyreDevice, TAsphyreTimer and TAsphyreCanvas components on your form. These are basic three components that are used mostly in any Asphyre application. We will explain these components briefly below...

 

TAsphyreDevice is used to initialize Asphyre and switch video modes. It is also used to do few other things like communicating other Asphyre components and presenting all your renderings on the screen.

 

In events occuring within TAsphyreTimer we will be drawing our scene in Asphyre. Additionally, we can move objects at constant speed (like 60 times per second) independently from how fast we draw things on the screen. This can be helpful when the rendering is very slow (too much stuff on the screen or the user's machine is too slow), our movement will still remain constant. On the other side, when the rendering is very fast, we'll see smoother object movement which will *still be constant*. All that is thanks to TAsphyreTimer component.

 

TAsphyreCanvas component is used for displaying any 2D graphics like lines, rectangles, primitives and images. This is practically the core of 2D in Asphyre.

 

Step 4. In order to use Asphyre, we need to initialize it first. In your form's OnCreate event, put the following code:

 

 if (not AsphyreDevice1.Initialize) then

  ShowMessage('Error initializing Asphyre!');

 

This will show an error message if our Asphyre initialization fails. In addition, we want to finalize Asphyre when our form is about to be closed. This is necessary, since if we use some different video mode we need to restore the original one and unload all Asphyre resources created at the time of initialization. In your OnDestroy form's event write the following:

 

 AsphyreDevice1.Finalize();

 

This will finalize Asphyre, if it has previously been initialized (this method is fool-proof and in case Asphyre is not initialized, it will do nothing).

 

Step 5. Select AsphyreTimer1 component you just dropped on the form and change Enabled to TRUE. After that, switch to Events tag and double-click on OnTimer event. This will create code for handling TAsphyreTimer.OnTimer event. In this code we will do two things: draw something on the screen and flip back buffers. Since Asphyre uses two buffers - one invisible where you draw everything and one that is visible on the screen, you have to flip these two to show what has just been rendered and continue drawing on the buffer that was previously visible. Put the following code in your OnTimer event:

 

 AsphyreDevice1.Render(clNavy, True);

 AsphyreDevice1.Flip();

 

The first line tells TAsphyreDevice to start rendering (a process where you draw stuff on the screen) and fill the screen with clNavy color (the second parameter means whether we want to fill the screen or not. In this case, it is True).

The second line tells TAsphyreDevice to flip its back buffers.

 

Step 6. Finally, select AsphyreDevice1 component and navigate to Events tab. Double-click on OnRender event. This is event where drawing can take place. We can draw circles, rectangles, lines and images here. In this case, let's draw a simple rectangle. Put the following code in OnRender event:

 

 AsphyreCanvas1.Rectangle(10, 20, 300, 200, clLime, clGreen, 1);

 

This tells TAsphyreCanvas to draw a rectangle on the screen at the position (10, 20) and size (300, 200). The background color is clGreen and the border color is clLime. Notice the last parameter here is 1 and is actually an effect that will be used to draw this image. In this case, we used "1" as parameter which is fxNone (you have to include AsphyreDef.pas in your USES declaration to use it) - meaning that we want no particular effect to be used. In reality, this value is generated by Blend2Fx function.

 

Step 7. Hit F9 to run the application, we are done! If you have installed Asphyre properly and the compilation is successfull, you'll see a blue background in your program with green rectangle in it.

 

You can see a complete source code of the program (just click on the link).