Features
Resources
Community
Members
Upcoming Events
Unite 2010
11/10 - 11/12 @ Montréal, Canada

GDC China
12/5 - 12/7 @ Shanghai, China

Asia Game Show 2010
12/24 - 12/27

GDC 2011
2/28 - 3/4 @ San Francisco, CA

More events...
Quick Stats
99 people currently visiting GDNet.
2406 articles in the reference section.

Help us fight cancer!
Join SETI Team GDNet!

# Creating the code

We have our classes ready, time to start writing the actual code.

Point primitives are not much different from the other primitive types available (triangle strips, lists, etc.). We can still choose what vertex shader we use.

A vertex shader tells DirectX about what type of vertices it can expect - such as whether they are already transformed, if they have a diffuse color, and so on. Since I'm mainly aiming this tutorial at 2D gaming, I'm going to use slightly customized TL vertices. This stands for Transformed and Lit, which means the vertices already are transformed and that the lighting color has already been computed. So an X of 300 will be 300 on the screen, and the vertex color will be the final color.

```Public Const D3DFVF_TLVERTEX = (D3DFVF_XYZRHW Or
D3DFVF_DIFFUSE Or D3DFVF_TEX1)

Public Type typeTRANSLITVERTEX
X As Single
Y As Single
Z As Single
rhw As Single
color As Long
tu As Single
tv As Single
End Type
```

We will need an array to contain the point sprites

```Private vertsPoints() As typeTRANSLITVERTEX
```

Next up is the "Reset" method. Here we will reset the individual particles. Since this is just a collection using the Particle class, we can basically hard code numbers in here. Since this first example will be a fire effect, we will set the properties to look like a fire. Note I have named the "collection" "colFireFX" as well.

```With Particles(I)
Call .ResetIt(X, Y, -0.4 + (Rnd * 0.8), -0.5 - (Rnd * 0.4), 0, -(Rnd * 0.3), 2)
Call .ResetColor(1, 0.5, 0.2, 0.6 + (0.2 * Rnd), 0.01 + Rnd * 0.05)
End With
```

This might look a bit complex now, but it really is not. There are lots of Rnd's in there. This is because the "flame" of the fire should be different every time, a bit irregular. That is what this code does: it changes the X and Y speed a bit, and also the Alpha and decay value. Check out the picture to the right for the results. The nice thing is that you can do so much with a simple particle engine like this just by modifying a few lines of code.

The decay value is the amount of "Alpha" (visibility) that is subtracted from the Alpha value every frame (based on the time). When the Alpha drops below zero, the particle will be reset, using the Reset method.

We need to initialize the arrays as well, both for the point list and the particles themselves, which will be done using a simple loop. Pretty straightforward. We simply reset all the particles now. Because of this, it will look the fire is "turned on" for the first few seconds.

```For I = 0 To ParticleCounts
Set Particles(I) = New Particle
vertsPoints(I).rhw = 1
Call Reset(I)
Next I
```

The size of the particles is set with:

```lngFloatSize = FtoDW(25) '//Size of our flame particles..
```

Note that this code uses this special function:

```Public Function FtoDW(f As Single) As Long
Dim Buf As D3DXBuffer
Dim L As Long

With ObjD3DX
Set Buf = .CreateBuffer(4)
.BufferSetData Buf, 0, 4, 1, f
.BufferGetData Buf, 0, 4, 1, L
End With

FtoDW = L
End Function
```

This function will put a "single in a long" (float in a dword), which is required for the .SetRenderState D3DRS_POINTSIZE and some other PointSize render states.

We still have to make the particles move. This is nothing more than looping through all particles in the array, and call "UpdateParticle." This method will change each particle:

``` Public Sub UpdateParticle(sngTime As Single)
sngX = sngX + sngXSpeed * sngTime
sngY = sngY + sngYSpeed * sngTime

sngXSpeed = sngXSpeed + sngXAccel * sngTime
sngYSpeed = sngYSpeed + sngYAccel * sngTime

sngA = sngA - sngAlphaDecay * sngTime
End Sub
```

That's about as tough as the math gets. We simply update the position of the particle based on the speed, the acceleration and the time. The Alpha value decreases as well, based on the time.

The particle has changed now. Therefore, we have to update the vertex associated with this particle. We only have to update the position and the color.

```vertsPoints(I).color = D3DColorMake(.sngR,.sngG, .sngB, .sngA)
vertsPoints(I).X = .sngX
vertsPoints(I).Y = .sngY
```

After finishing the "Update" sub in our collection, the particles have been moved and the vertices (point sprites) have been updated.

Since we have already covered creating, resetting and updating, it's time for rendering. Rendering is similar to how you would render any other primitives. Due to the fact that vertex buffers are complicated to set up and to modify, I'm using DrawPrimitiveUP to render my vertices. With point sprites, this is done as follows:

First enable pointsprites:

``` With ObjDev
.SetRenderState D3DRS_POINTSPRITE_ENABLE, 1 'True
.SetRenderState D3DRS_POINTSCALE_ENABLE, 0 '//I don't need it..
End With
```

We need to set a certain alphablend state to get that "glowing" effect:

``` With ObjDev
.SetRenderState D3DRS_SRCBLEND, D3DBLEND_SRCALPHA
.SetRenderState D3DRS_DESTBLEND, D3DBLEND_ONE
.SetRenderState D3DRS_ALPHABLENDENABLE,1
End With
```

Then render:

``` '//Set up the vertex shader

'//Set our texture
.SetTexture 0, myTexture

'//And draw all our particles :D
.DrawPrimitiveUP D3DPT_POINTLIST, ParticleCounts, vertsPoints(0), Len(vertsPoints(0))
```

You might have noticed the texture. The texture controls (for this particle engine) which part of the particle is seen. It should be grayscale, since we set the colors manually. Changing the texture can result in interesting effects. For example, changing the texture in a "flare" texture will give the particles an entirely different look!

Once rendering is complete, you need to disable the point sprites again:

``` With ObjDev
.SetRenderState D3DRS_POINTSPRITE_ENABLE, 0 'True
End With
```

That's it for the rendering (be sure to change any renderstates you have modified back to the values they were).

A small point for optimization: The "Len(vertsPoints(0)" could simply be changed to a constant, or a value that is set once. Then the Len() function isn't required anymore, speeding up the rendering just a bit.

Remember, it's way more efficient to render as much as possible with one DrawPrimitive call.

We are ready with the code inside our particle class and collection.

To create an instance of our particle collection, we simply use the normal VB way for it:

``` Dim myNewFire As colFireFX
Set myNewFire = New colFireFX
myNewFire.ParticleCounts = 150
myNewFire.ReLocate 400, 400
myNewFire.Begin
```

And in our render loop we only have to use two lines of code to get the particle effect on the screen:

```myNewFire.Update
myNewFire.Render
```

Check out the source (or the compiled exe) to see it working.

# What do we have now?

Right now we have a simple particle engine. It does not have things like gravity, or attraction of particles to each other. But don't think you cannot do anything with this simple engine. You can simply change the "Reset" code a bit, and you can get truly wonderful things.

While trying to make some simple particle demos I was surprised at the power of this simple particle engine. Just changing a few numbers can generate wonderful particle collections. The source contains quite a number of the interesting patterns generated by code. Often a small change of a number can result in a completely new pattern.

The particle class and the collection class can easily be inserted into a 2D project and used instantly. Then you can try to experiment with the arguments or formulas in the Reset() method. There is a lot to experiment with. For example, with some of my demonstration patterns, changing the particlecount will change the entire look of the pattern.

I hope this tutorial sheds some light on particles and how to use point sprites in DirectX together with Visual Basic.

Almar Joling
www.persistentrealities.com

Contents
 Introduction Point Sprites Creating the code

 Source code Printable version Discuss this article