Triangles, Translations

Game Design Experience

Professor Jim Whitehead

March 2, 2009

Creative Commons Attribution 3.0(Except copyrighted images)creativecommons.org/licenses/by/3.0

Announcements

• Project progress report► Due Today

• In class, or in my box by 5pm

► Take your project work breakdown and schedule (done previously)

• Update this schedule based on your (now improved) understanding of what still needs to be done

• Cut project scope, if necessary• Remember, you have assignments due in other classes too

• Days until Final Project Due: 14► Due Monday, March 16

Announcements

• 3D modeling homework► Assignment text not yet on web► Will be up soon► Due Monday, March 9► Assignment will involve:

• Create a simple 3D model (e.g., in Blender)– Something slightly (but not by much) more complex than a

cube will be fine• Make this model show up in XNA• Extra credit for making model rotate, applying bitmap textures• Goal is to exercise a model import pathway

► Intended to be a straightforward assignment

Drawing Triangles

• All complex 3D shapes seen in games are composed of a series of triangles

► A triangle has 3 points, one for each corner• Points are more typically known as verticies• Minimum number of points to unambiguously define a plane

Vertex Structures in XNA

• XNA has 4 different structures for representing verticies► VertexPositionColor

• Useful for basic shapes, basic colors

• x,y,z plus a color for each vertex► VertexPositionTexture

• Overlay a bitmap texture onto a shape

• x,y,z plus a u,v coordinate into a bitmap texture► VertexPositionNormalTexture

• Normal permits lighting effects

• x,y,z plus a u,v, coordinate, plus a normal vector► VertexPositionColorTexture

• Color information changes color of bitmap texture

• Reuse same texture in different contexts

• x,y,z plus u,v plus color

VertexPositionColor

• VertexPositionColor object► Represents the x,y,z location of a vertex► Also has a color for the vertex

► VertexPositionColor v = new VertexPositionColor(new Vector3(0,1,0), Color.Blue);

► Need 3 verticies to draw a triangle

Vertex Declaration

• XNA requires you to tell the graphics device what kind of vertex data you will be using

► Vertex data is written directly to the GPU► Need to tell the GPU how to interpret the data it receives► GraphicsDevice.VertexDeclaration = new

VertexDeclaration(GraphicsDevice, VertexPositionColor.VertexElements);

• For different types of verticies, would change the vertex structure

► VertexPositionTexture example:► GraphicsDevice.VertexDeclaration = new

VertexDeclaration(GraphicsDevice, VertexPositionTexture.VertexElements);

Actually drawing the triangles

• In XNA, all 3D rendering is handled by a shader► Shaders defined using High Level Shader Language

(HLSL)► Permits creation of wide range of visual effects► More on shaders in a few classes

• XNA provides a default shader► Called BasicEffect► Will use this for now

• BasicEffect is a type of effect► Effects contain a series of EffectPass► Each pass handles some aspect of putting things on

screen

Using Basic shader

Five steps:1. Create Shader

► BasicEffect effect = new BasicEffect(GraphicsDevice, null);2. Copy over camera information

► effect.View = camera.view;► effect.Projection = camera.projection;

3. Set world matrix► effect.World = … (more on this in a few slides)

4. Enable vertex capabilities (varies by Vertex type)► Effect.VertexColorEnabled = true; // for VertexPositionColor► Effect.Texture = myTexture; // for

VertexPositionTextureEffect.TextureEnabled = true;

5. Iterate through EffectPasses► Call to DrawUserPrimitives inside EffectPass puts triangles on

screen

Iterating Through Effect Passes

• Each Effect has calls to begin()/end()

• Effects are comprised of passes► Each pass requires a call to begin()/end()

effect.Begin();

foreach (EffectPass pass in effect.CurrentTechnique.Passes)

{

pass.Begin();

GraphicsDevice.DrawUserPrimitives<VertexPositionColor>

(PrimitiveType.TriangleStrip, verts, 0, 1);

pass.End();

}

effect.End();

Draws verticiesPasses

# of triangles (the “primitive shape” in this context) to draw

Index into verts array

Triangle Drawing

• Examine this line of code► GraphicsDevice.DrawUserPrimitives<Vert

exPositionColor>

(PrimitiveType.TriangleStrip, verts, 0, 1);

► What is a TriangleStrip?• Three ways to draw triangles

► Triangle List• Each set of three verticies defines a

triangle• Memory inefficient, since triangles often

share edges in complex 3D meshes► Triangle Strip

• Builds triangle out of first three verticies• Each additional vertex creates new triangle

using that vertex, plus previous two verticies

► Triangle Fan• Each additional vertex creates new triable

using that vertex, the previous vertex, plus the first vertex

http://escience.anu.edu.au/lecture/cg/surfaceModeling/image/surfaceModeling015.png

World Matrix

• Each triangle has 3 verticies, and each vertex has an x,y,z position

► This position is given with respect to an origin location► That is, location is with respect to a local coordinate system

• World matrix► Translates from the local coordinate

system to the world (i.e., visible on screen) coordinate system

Local coordinate system offset, no rotation (Note: example uses left handed coordinate system, XNA uses right-handed coordinates) Source: MSDN DirectX documentation

Local coordinate system offset and rotatedwww1.adept.com/main/KE/DATA/V%20Plus/V%20Language%20User/images/World+yaw.gif

local

world

Translation

• A translation shifts the local coordinate system relative to the world coordinate system

• XNA provides a method for this► Matrix.CreateTranslation

• 3 parameters are x,y,z movements• Matrix.CreateTranslation(0.01f, 0, 0); // Shift right

(positive) along x axis• Matrix.CreateTranslation(-0.01f, 0, 0); // Shift left

(negative) along x axis

• Multiply world matrix by translation matrix to cause shift

► All translations and rotations in 3D graphics accomplished via matrix multiplication

Rotation

• A rotation shifts the local coordinate system by an angle relative to the world coordinate system

• XNA helper methods► Matrix.CreateRotationX, Matrix.CreateRotationY,

Matrix.CreateRotationZ• Rotations around single axes• Matrix.CreateRotationY(angle in radians);

► Matrix.CreateFromYawPitchRoll• Rotate around multiple axes• Matrix.CreateFromYawPitchRoll(yaw rad., pitch rad., roll

rad.)

• Demonstration of example triangle drawing code