Erwan's Blog

We have seen in previous article 8 how to perform pixel collision.
Altough it worked perfectly, it only worked on non rotated shapes.

But in some cases, your shape will rotate (like a car in a racing game – see article « A racing car game »).

To perform pixel collision for a rotated shape, here below the steps :

-you first need to draw a rotated rectangle around your shape
-you then need to draw a bounding rectanle around that rotated rectangle (also called AABB : Axis Aligned Bounding Box)
-finally you can check whether 2 AABB intersects, and if so, if in the intersected region, we have 2 non transparent pixels (colliding) or not

The source code : XNA_DEMO_18
Note : the project contains a class named primitives2d which is used only to draw lines/rectangles around my objects.

Lets illustrate this with some screenshots.

Lets rotate our rectangle along with my rocket

Lets define our bounding box

Despite bounding boxes intersecting, we dont detect collision yet

Here we go ! In the intersection region, there are 2 non transparent pixels

Sometimes you need a simple progressbar in your XNA game to display game points, life, etc.

Lets do it quick and simple with rectangles only:
-One gray rectangle for the fix bar, and one red rectangle for the moving bar (use +/- keys).
-a very simple math formula to draw the current value against the width of the bar : progressbar_width * progressbar_value / progressbar_max

The sourcecode : Here


Imports Microsoft.Xna.Framework
Imports Microsoft.Xna.Framework.Graphics
Imports Microsoft.Xna.Framework.Audio
Imports Microsoft.Xna.Framework.Content
Imports Microsoft.Xna.Framework.Media
Imports Microsoft.Xna.Framework.Input

Protected Overrides Sub Update(ByVal gameTime As Microsoft.Xna.Framework.GameTime)
If Keyboard.GetState.IsKeyDown(Keys.Add) Then progressbar_value += 1
If Keyboard.GetState.IsKeyDown(Keys.Subtract) Then progressbar_value -= 1
If progressbar_value >= progressbar_max Then progressbar_value = progressbar_max
If progressbar_value <= 0 Then progressbar_value = 0 MyBase.Update(gameTime) End Sub Protected Overrides Sub Draw(ByVal gameTime As Microsoft.Xna.Framework.GameTime) GraphicsDevice.Clear(Color.Blue) spritebatch.Begin() spritebatch.DrawString(font, progressbar_value, New Vector2(10, 10), Color.White) spritebatch.Draw(dummyTexture, New Rectangle(100, 10, progressbar_width, 10), Color.Gray) spritebatch.Draw(dummyTexture, New Rectangle(100, 10, progressbar_width * progressbar_value / progressbar_max, 10), Color.Red) spritebatch.End() MyBase.Draw(gameTime) End Sub End Class

So now you have made this sweet little XNA game of yours and you want to distribute it to friends.

Sure you could give them the content of your debug/release folder but thats a lot of files in there may be not needed for simple execution.
Not to mention you would like to distribute the XNA run time with it.
Why not package all this in a friendly setup that allow one to install/deinstall?

Well lets use Inno Setup.

Bere below a script that will allow you to make one standalone package handling it all.

Adapt paths and filenames to your project.


[Files]
Source: XNA_BASE1.exe; DestDir: {app}
Source: *.dll; DestDir: {app}
Source: xnb\*; DestDir: {app}\xnb
Source: xnafx40_redist.msi; DestDir: {tmp}; Flags: deleteafterinstall
[Icons]
Name: "{group}\Shooting"; Filename: "{app}\XNA_BASE1.exe"; WorkingDir: "{app}"
Name: "{group}\Uninstall Shooting"; Filename: "{uninstallexe}"
[Run]
Filename: {tmp}\xnafx40_redist.msi; Check: ask_; Flags: shellexec waituntilterminated; StatusMsg: "running"
[Code]
function Ask_():Boolean;
begin
result:=false;
if MsgBox('Install XNA Runtime? Needed to run the game', mbConfirmation, MB_YESNO) = IDYES then result:=true
end;
[Dirs]
Name: {app}\xnb
[Setup]
AppName=Shooting
AppVersion=1.0
DefaultDirName={pf}\shooting
DefaultGroupName=Shooting
UninstallDisplayIcon={app}\uninstall.exe
Compression=lzma2
SolidCompression=yes
SourceDir=C:\Projects\XNA_DEMO_12_shooting\XNA_BASE1\bin\Debug
OutputDir=C:\Projects\XNA_DEMO_12_shooting\installer


This time lets see how, without any external texture, we will animate forms and use collision detection.

To illustrate this, lets make a Pong game.

We will need to draw 3 rectangles : 2 bars and one ball.
The update method will manage check the keyboard, move the positions of each rectangle and check collision thru the intersect rectangle method.

The code : XNA_DEMO_17
up/down for player2, z/s for player1 : as simple as that.

See below a short video.

Enjoy

Today, lets see how to detect two sprites (i.e moving textures) colliding.
Pixel collision is the basic of any game.

The principle is the following :
first we need to define the region the two image rectangles intersect,
then we will iterate through each pixel in that region, and compare the alpha value of each image of each pixel.
If neither has an alpha value of 0 (transparent), they are both considered colliding.
See original discussion here.

A picture illustrating this priniciple :

In the attached code, we will
-setup a background and 2 balls
-update the balls position and make a sound when we touch the screen boundaries
-detect if the balls are colliding and if yes, make a sound

Note : this does not cover rotating shapes as this will be covered in a future article.

Enjoy.

xna_demo_6