XNa billboard (announcement board technology)

Source: Internet
Author: User

The announcement board technology is a widely used technology in 3D games. It is mainly used to control the texture direction in scenarios, let him always face our camera at a certain angle (usually perpendicular to the camera ).
For example, the blue, red, and monster names of monsters we see in 3D games, and some flowers, trees, etc. No matter which direction we look at, it always faces us.
As shown in:

Graphicsdevicemanager graphics; texture2d texredpanda; // lens information parameters vector3 POs, lookat, up; // world, view, Project Matrix matrix Matrix world, view, project; basiceffect; // vertex structure vertexpositiontexture [] VPT; vertexdeclaration vertexdec; Public gamemain () {graphics = new graphicsdevicemanager (this); content. rootdirectory = "content";} protected override void initialize () {// initialize the camera information Pos = new vector3 (0, 0,200); lookat = vector3.zero; up = vector3.up; // initialize the transformation matrix world = matrix. identity; bbworld = matrix. identity; view = matrix. createlookat (Pos, lookat, up); Project = matrix. createperspectivefieldofview (mathhelper. piover4, 800f/600f, 1, 1000); VPT = new vertexpositiontexture [6]; graphicsdevice. renderstate. cullmode = cullmode. none; base. initialize ();} protected override void loadcontent () {texredpanda = content. load <texture2d> ("redpanda"); basiceffect = new basiceffect (graphicsdevice, null); vertexdec = new vertexdeclaration (graphicsdevice, vertexpositiontexture. vertexelements); // defines vertex coordinates and texture coordinates of a triangle VPT [0] = new vertexpositiontexture (New vector3 (-25,-25, 0), new vector2 (0, 1); VPT [1] = new vertexpositiontexture (New vector3 (-25, 25, 0), new vector2 (0, 0 )); VPT [2] = new vertexpositiontexture (New vector3 (25,-25, 0), new vector2 (1, 1 )); VPT [3] = new vertexpositiontexture (New vector3 (-25, 25, 0), new vector2 (0, 0 )); VPT [4] = new vertexpositiontexture (New vector3 (25, 25, 0), new vector2 (1, 0); VPT [5] = new vertexpositiontexture (New vector3 (25, -25, 0), new vector2 (1, 1);} protected override void Update (gametime) {// allows the game to exit if (gamepad. getstate (playerindex. one ). buttons. back = buttonstate. pressed) This. exit (); base. update (gametime);} protected override void draw (gametime) {graphicsdevice. clear (color. black); // set the transform matrix parameter basiceffect. world = World; basiceffect. view = view; basiceffect. projection = project; // you can specify basiceffect to draw a texture. textureenabled = true; basiceffect. texture = texredpanda; basiceffect. begin (); foreach (VAR pass in basiceffect. currenttechnique. passes) {pass. begin (); graphicsdevice. vertexdeclaration = vertexdec; graphicsdevice. drawuserprimitives <vertexpositiontexture> (primitivetype. trianglelist, VPT, 0, 2); pass. end ();} basiceffect. end (); base. draw (gametime );}

The position of texredpanda is probably at the coordinate origin. To facilitate observation, some content will be added in update. Let the camera position rotate around the origin through the keyboard (the World conversion is not used here ). Here is the formula found online:
X1 = x0 * CoSb + y0 * sinb
Y1 =-x0 * sinb + y0 * CoSb
 
X0 and Y0 indicate the current position of the lens, and Y1 and Y2 indicate the coordinates after B radians are rotated around the origin.
Now let's stay and see the effect when no announcement board technology is used. Set the followingCodeAdd to the update method:

 
Float x0, z0; X0 = POS. x; z0 = POS. z; If (Keyboard. getstate (). iskeydown (keys. left) {pos. X = x0 * (float) math. cos (0.1d) + z0 * (float) math. sin (0.1d); POS. z = (-X0) * (float) math. sin (0.1d) + z0 * (float) math. cos (0.1d);} If (Keyboard. getstate (). iskeydown (keys. right) {pos. X = x0 * (float) math. cos (-0.1d) + z0 * (float) math. sin (-0.1d); POS. z = (-X0) * (float) math. sin (-0.1d) + z0 * (float) math. cos (-0.1d);} view = matrix. createlookat (Pos, vector3.zero, vector3.up); // display the viewpoint position in the title bar window. title = POS. tostring ();

Next we will add a world change using the announcement board. The main code is as follows,
Bbworld = matrix. createbillboard (vector3.zero,-pos, vector3.up, null );
Now let's compare the effect and find that no matter where we control the camera, the pictures of pandatv always face us.

A preliminary announcement board has been implemented here. Of course, we can also put the code into HLSL without using the existing xNa method. Here we have an implementation, but I have not figured out the mathematical principles for him. So it is only applicable.

Float4x4 world; float4x4 view; float4x4 projection; texture; sampler placement = sampler_state {texture = <texture>; magfilter = Linear; minfilter = Linear; mipfilter = Linear; addressu = clamp; addressv = clamp;}; struct vertexshaderinput {float3 pos: position0; float2 texcoord: vertex;}; struct vertexshaderoutput {float4 position: position0; float2 texcoord: texcoord0 ;}; vertexshaderoutput vertexshaderfunction (vertexshaderinput input) {vertexshaderoutput output; float4x4 worldviewmatrix = MUL (World, view); float3 positionvs = input. pos + float3 (worldviewmatrix. _ 41, worldviewmatrix. _ 42, worldviewmatrix. _ 43); output. position = MUL (float4 (positionvs, 1.0f), projection); output. texcoord = input. texcoord; return output;} float4 pixelshaderfunction (vertexshaderoutput input): color0 {return tex2d (texturesampler, input. texcoord);} technique billboard {pass billboard {vertexshader = compile vs_00000 vertexshaderfunction (); pixelshader = compile ps_00000 pixelshaderfunction ();}}

the commonly used announcement board technology is implemented here. Whether to use the existing xNa method or HLSL is determined by yourself as needed.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.