XNA Background

From BluWiki

This is a tutorial on changing the background and wall-collision detection. It is broken down into blocks of code that are grouped together into sections.

This page is part of XNA Tutorials. The previous tutorial is XNA Keyboard. The next tutorial is XNA Tutorials/Rotating a Sprite.

[edit] Class-wide variables

1. Put the following code before your Initialize() function


    // Create a string variable to keep track of Image Name.
    // Use the Asset Name for your image
    String BackgroundImage = "Crystal";
    // Create an instance of Texture2D that 
    // will contain the background texture.
    Texture2D background;
    // Create a Rectangle that will define the 
    // limits for the main game screen.
    Rectangle mainFrame;

[edit] LoadContent() function

2. In the LoadContent() function put the following code:


    protected override void LoadContent()
    {
         spriteBatch = new SpriteBatch(GraphicsDevice);
         myTexture = Content.Load<Texture2D>("smiley"); //Your image object
         // Load the background content.
         background = Content.Load<Texture2D>(BackgroundImage);
         // Set the rectangle parameters.
         mainFrame = new Rectangle(0, 0, GraphicsDevice.Viewport.Width, GraphicsDevice.Viewport.Height);
    }

[edit] UpdateSprite() function

3. Add the code in bold to the UpdateSprite() function:


    void UpdateSprite(GameTime gameTime)
    {
         // Move the sprite by speed, scaled by elapsed time.
         spritePosition += spriteSpeed * (float)0.05; //Moves the sprite faster
         int MaxX = graphics.GraphicsDevice.Viewport.Width - myTexture.Width;
         int MinX = 0;
         int MaxY = graphics.GraphicsDevice.Viewport.Height - myTexture.Height;
         int MinY = 0;
         // Check for bounce.
         if (spritePosition.X > MaxX)
         {
         ChangeBackgroundImage(); //Function call to change the background image
         spriteSpeed.X *= -1;
         spritePosition.X = MaxX;
         }
         else if (spritePosition.X < MinX)
         {
         ChangeBackgroundImage(); //Function call to change the background image
         spriteSpeed.X *= -1;
         spritePosition.X = MinX;
         }
         if (spritePosition.Y > MaxY)
         {
         ChangeBackgroundImage(); //Function call to change the background image
         spriteSpeed.Y *= -1;
         spritePosition.Y = MaxY;
         }
         else if (spritePosition.Y < MinY)
         {
         ChangeBackgroundImage(); //Function call to change the background image
         spriteSpeed.Y *= -1;
         spritePosition.Y = MinY;
         }
    }

[edit] Draw() function

4. Add the line in bold to your Draw(GameTime gameTime) function


    protected override void Draw(GameTime gameTime)
    {
    graphics.GraphicsDevice.Clear(Color.CornflowerBlue);
    // Draw the sprite.
    spriteBatch.Begin(SpriteBlendMode.AlphaBlend);
    spriteBatch.Draw(background, mainFrame, Color.White); 
    spriteBatch.Draw(myTexture, spritePosition, Color.White);
    spriteBatch.End();
    base.Draw(gameTime);
    }

[edit] ChangeBackground() function

5. Finally the following function is what gets called to change the background image on wall-collision.


    //This variable is used only in the following function.
    int ImageCounter = 0;
    /// <summary>
    /// Changes the background image to the next one in an array.
    /// </summary>
    void ChangeBackgroundImage()
    {
         const int MAX = 2;//If you want to use more background images increase MAX to the size you need
         string[] ImageArray = new string[MAX];
         ImageArray[0] = "Ascent"; //Enter the names of your background images.
         ImageArray[1] = "Crystal";
         //Set BackgroundImage to the name of a new image
         BackgroundImage = ImageArray[ImageCounter];
         //increment the counter variable
         ImageCounter = (ImageCounter + 1) % MAX;
         //load the new background
         background = Content.Load<Texture2D>(BackgroundImage);
    }