XNa two-dimensional game parallax background Implementation Method

Objective: To develop a practical manual for Windows Phone in game applications Program Before coding starts, you should first ask yourself a few questions about game design, think clearly about the goal, and then start design and development.

• What type of games does it make?
  
• What is the goal of the game?
  
• Is the gameplay designed?
  
• What kind of driver does the game use?
  
• How to Design the artistic resources of games?
  

"Liji-moderate": "when everything goes wrong, it will be abolished. If the statement is set, the statement is not required. If the statement is set beforehand, the statement is not required. If the statement is set before the statement is set, the statement is not required. "Everything can be done with preparation. If you do not have any preparation, it will fail. If you are prepared in advance, you will not be confused during the debate. make full preparations before you take actions, so that you will not be in trouble. make full preparations before you take actions, at that time, you will not feel guilty. When you are ready to fulfill the principle of being a person, you will not be able to do anything smoothly. The same is true for game design. If the game's design intention or idea is modified halfway through game development, it will be expensive. Sun Tzu said: "If you do not fight, the temple will count as the winner. If you do not fight, the temple will count as the winner. If you do not fight, the temple will count as few as the winner. If you calculate more than one, you can calculate less than one! "This is also the truth. Game Design Flowchart
Creating a game design document helps mitigate potential defects and help developers understand and process the game design logic. To understand the game logic we want to design, start with the following flowchart. As you can see, the flowchart of a small shooting game is so complicated, and the design of a large game is more complicated. Detailed documents can be used as communication tools to help designers, developers, and testers understand the expected goals and accomplish the expected work. Game parallax background
When moving, the airship draws a cloud pattern as the background and moves it from right to left. In this example, the parallax background is used to achieve real and dynamic background effects. In astronomy, the parallax method is used to determine the distance between celestial bodies. ParallaxIt is to observe the direction difference produced by the same target from two points with a certain distance. The angle between the two points from the target is called the two points.The parallax angle of a point. The distance between two points is called a baseline. As long as you know the parallax angle and baseline length, you can calculate the distance between the target and the observer.
In game development, visual errors are often referred to as visual illusion. The so-called Parallax is caused not only by the limitations and obstacles of the human eye, but also by deep cultural associations and thoughts. In this example, the method for drawing the parallax background is: used to draw multi-layer images and move at different speeds to achieve the illusion of flying on the cloud.
Press SHIFT + ALT + C to create the parallax background class, and type the class name parallaxingbackground. CS. Create a game role class named parallaxingbackground. At the same time, press SHIFT + ALT + C and select [Code] | [code file] . Add references to the newly created parallaxingbackground. CS file. XNa project: Shooter file: parallaxingbackground. CS

 

 
UsingSystem;

UsingMicrosoft. xNa. Framework;

UsingMicrosoft. xNa. Framework. content;

UsingMicrosoft. xNa. Framework. graphics;
 

In the parallaxingbackground class, define the background image variables of the texture2d type, the vector2 array, and the moving speed variables. XNa project: Shooter file: parallaxingbackground. CS

//The image representing the parallaxing background

Texture2d texture;



//An array of positions of the parallaxing background

Vector2 [] positions;



//The speed which the background is moving

IntSpeed;
 

In the initialize () method, load the background image and set the image moving speed. First, use the content. Load Method to initialize the image, and then calculate the number of objects in the vector2 array (screenwidth/texture. Width + 1). The purpose of + 1 is to ensure smooth background switching. In the for loop, set the initial position of the background image. XNa project: Shooter file: parallaxingbackground. CS

 Publicvoid initialize (contentmanager content, string texturepath,  Int  Screenwidth,  Int  Speed)

{

  //  Load the background texture we will be using  
  
Texture  = Content. Load  <  Texture2d  >  (Texturepath );



  //  Set the speed of the background  
  
  This  . Speed  =  Speed;



  // If we divide the screen with the texture width then we can determine the number of tiles need.

  //  We add 1 to it so that we won't have a gap in the tiling  
  
Positions  =  Newvector2 [screenwidth  /  Texture. Width  +     1  ];



  // Set the initial positions of the parallaxing background  
  
  For  (  Int  I  =     0  ; I  <  Positions. length; I  ++  )

{

  // We need the tiles to be side by side to create a tiling Effect  
  
Positions [I]  =  Newvector2 (I  *  Texture. Width,  0  );

}

} 

In the update method, the coordinates of the background image are changed. Each background image is considered as a tile. It updates the X axis coordinate of the tile and uses the moving speed variable value as the increment of moving the X axis coordinate. If the moving speed variable is less than zero, the tile is moved from right to left. If the moving speed variable is greater than zero, the tiles move from left to right. When moving, determine whether the display position of the tile exceeds the screen area. If so, reset the X axis coordinates of the tile to smooth the background rolling. XNa project: Shooter file: parallaxingbackground. CS

 Publicvoid Update ()

{

  //  Update the positions of the background  
  
  For  (  Int  I  =     0  ; I  < Positions. length; I  ++  )

{

  //  Update the position of the screen by adding the speed  
  
Positions [I]. x  + =  Speed;

  //  If the speed has the background moving to the left  
  
  If  (Speed <=     0  )

{

  //  Check the texture is out of view then put that texture at the end of the screen  
  
  If  (Positions [I]. x  <=     -  Texture. width)

{

Positions [I]. x  = Texture. Width  *  (Positions. Length  -     1  );

}

}

  //  If the speed has the background moving to the right  
  
  Else  

{

  // Check if the texture is out of view then position it to the start of the screen  
  
  If  (Positions [I]. x  > =  Texture. Width  *  (Positions. Length  -     1  ))

{

Positions [I]. x  =    -  Texture. width;

}

}

}

} 

After the positional coordinates are updated, draw the parallax background using the draw method. XNa project: Shooter file: parallaxingbackground. CS

Publicvoid draw (spritebatch)

{

For(IntI= 0; I<Positions. length; I++)

{

Spritebatch. Draw (texture, positions [I], color. White );

}

}
 

Declare bglayer1 and bglayer2 of the parallax background in game1.cs. XNa project: Shooter file: game1.cs

// Image used to display the static background texture2d mainbackground; // parallaxing layers parallaxingbackground bglayer1; parallaxingbackground bglayer2;
 

Instantiate the parallax background layer in the initialize method of game1. XNa project: Shooter file: game1.cs

 Bglayer1  =     New  Parallaxingbackground ();

Bglayer2  =     New Parallaxingbackground ();

Load the background layer in the loadcontent method of game1.

XNa project: Shooter file: game1.cs

  //  Load the parallaxing background  
  
Bglayer1.initialize (content,  "  Bglayer1  "  , Graphicsdevice. viewport. Width,  -  1  );

Bglayer2.initialize (content,  "  Bglayer2 "  , Graphicsdevice. viewport. Width,  -  2  );



Mainbackground  =  Content. Load  <  Texture2d  >  (  "  Mainbackground  "  ); 

In the update method of game1, the parallax background is updated after the game role is updated. XNa project: Shooter file: game1.cs

 
//Update the parallaxing background

Bglayer1.update ();

Bglayer2.update ();
 

Draw the game background in the draw method of game1. XNa project: Shooter file: game1.cs

Graphicsdevice. Clear (color. cornflowerblue );



//Start drawing

Spritebatch. Begin ();



Spritebatch. Draw (mainbackground, vector2.zero, color. White );



//Draw the moving background

Bglayer1.draw (spritebatch );

Bglayer2.draw (spritebatch );
 

Run in Simulator
Press F5 to run the application, or click Start debugging to start debugging. Figure start debugging graph ins game references
This chapter references and references the game development tutorial of the app Hub (http://create.msdn.com/en-US) and the msdn Windows Phone development documentation. Source code : Bytes.