Riemers2DXNA13texturetocolors
With the slopes finally ready, we can move on and do something about the solid green color of our terrain. Instead of using a fixed color, for each pixel of the terrain, we are going to look up the color from an existing ground image and use this color for our own terrain. This might be a problem when our terrain is larger than the existing ground image, which is why we need a ‘tileable’ ground image, meaning that you cannot see an edge when you put two of the images next to, on top of below each other.
Start by importing the ground.jpg image into your content project and then add a new variable into the Properties section of our code to store the Texture data:
private Texture2D _groundTexture;And initialize it in our LoadContent method:
_groundTexture = Content.Load<Texture2D>("ground");Now, instead of specifying a fixed color, we will transfer the color data from this image into our foregroundTexture. However, to do this we will need access to the color data stored inside the groundTexture. This is the opposite of what we did a few chapters ago where we created a texture from an array of colors, here we need to copy the data from an existing texture into an array of colors.
This is not that difficult, so let us start by adding this method to extract the data from a Texture2D:
private Color[,] TextureTo2DArray(Texture2D texture)
{
Color[] colors1D = new Color[texture.Width * texture.Height];
texture.GetData(colors1D);
}Ignore any errors raised from this new function as we slowly build it up and explain.
As described above, we want this method to accept a Texture2D object, extract the color data, and return this color data as a 2D array. Having a 2D array makes things easier later on as each color inside this 2D array corresponds to a pixel from the 2D image.
For now, this method simply creates a 1D array of Colors, capable of storing one color for each pixel in the image (Width*Height pixels in the image). Then, it copies the color data from the texture into the array.
However, we want this data as a 2D array and not as a 1D array, so add this easy code at the end of the method:
Color[,] colors2D = new Color[texture.Width, texture.Height];
for (int x = 0; x < texture.Width; x++)
{
for (int y = 0; y < texture.Height; y++)
{
colors2D[x, y] = colors1D[x + y * texture.Width];
}
}
return colors2D;We first initialize a new 2D array large enough to store one Color for each pixel of the texture, then we copy the data from our 1D array to the exact location inside our 2D array. In the end, we return this 2D array to the calling code.
Now, in our CreateForeground method we will use the colors from this 2D array instead of the solid green color. So, go to the CreateForeground method, and add this as first line:
Color[,] groundColors = TextureTo2DArray(_groundTexture);Now find this line, which sets green for each pixel below the terrain slope:
foregroundColors[x + y * _screenWidth] = Color.Green;And replace it with this line:
_foregroundColors[x + y * _screenWidth] = groundColors[x, y];Which will copy the color of the same pixel from the ground texture into our array defining the foregroundTexture.
This will work fine, unless the screen is wider or higher than the width and height of our ground texture, to solve this, we will take the modulo of both.
The Modulo is the remainder after division and can be best explained by the following example.
If groundWidth = 400, then (100 modulo 400) remains 100, while (500 modulo 400) will also be 100. (532 modulo 400) is 132, (389 modulo 400) is 389 and (929 modulo 400) is 129. This means that it maps all numbers inside the [0,groundWidth] range, exactly what we need.
The modulo operator in C# is ‘%’ so this is how we take (x modulo groundWidth):
x % groundWidth
We need to apply this for both the X and y coordinates, to make sure the selections does not become larger than the width or height of the ground image. So this is what we finally get the following:
foregroundColors[x + y * _screenWidth] = groundColors[x % _groundTexture.Width, y % _groundTexture.Height];Update the previous line with the above and when you run the code with these adjustments, you should see the following:
Two chapters ago, you learned how to create a Texture2D object from a 2D array of Colors. This chapter, you learned the opposite: how to obtain the 2D array of Colors from a Texture2D. This means you know all there is to know about per-pixel Texture color manipulations.
You can try these exercises to practice what you have learned:
- Try using different textures for the terrain and see if the scaling logic works
- Also, try changing the starting window dimensions to test the same
using System;
using System.Collections.Generic;
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Graphics;
using Microsoft.Xna.Framework.Input;
namespace Series2D1
{
public struct PlayerData
{
public Vector2 Position;
public bool IsAlive;
public Color Color;
public float Angle;
public float Power;
}
public class Game1 : Game
{
//Properties
private GraphicsDeviceManager _graphics;
private SpriteBatch _spriteBatch;
private GraphicsDevice _device;
private Texture2D _backgroundTexture;
private Texture2D _foregroundTexture;
private Texture2D _carriageTexture;
private Texture2D _cannonTexture;
private Texture2D _rocketTexture;
private Texture2D _smokeTexture;
private Texture2D _groundTexture;
private SpriteFont _font;
private int _screenWidth;
private int _screenHeight;
private PlayerData[] _players;
private int _numberOfPlayers = 4;
private float _playerScaling;
private int _currentPlayer = 0;
private bool _rocketFlying = false;
private Vector2 _rocketPosition;
private Vector2 _rocketDirection;
private float _rocketAngle;
private float _rocketScaling = 0.1f;
private Color[] _playerColors = new Color[10]
{
Color.Red,
Color.Green,
Color.Blue,
Color.Purple,
Color.Orange,
Color.Indigo,
Color.Yellow,
Color.SaddleBrown,
Color.Tomato,
Color.Turquoise
};
private List<Vector2> _smokeList = new List<Vector2>();
private Random _randomizer = new Random();
private int[] _terrainContour;
public Game1()
{
_graphics = new GraphicsDeviceManager(this);
Content.RootDirectory = "Content";
}
protected override void Initialize()
{
// TODO: Add your initialization logic here
_graphics.PreferredBackBufferWidth = 500;
_graphics.PreferredBackBufferHeight = 500;
_graphics.IsFullScreen = false;
_graphics.ApplyChanges();
Window.Title = "Riemer's 2D MonoGame Tutorial";
base.Initialize();
}
private void SetUpPlayers()
{
_players = new PlayerData[_numberOfPlayers];
for (int i = 0; i < _numberOfPlayers; i++)
{
_players[i].IsAlive = true;
_players[i].Color = _playerColors[i];
_players[i].Angle = MathHelper.ToRadians(90);
_players[i].Power = 100;
_players[i].Position = new Vector2();
_players[i].Position.X = _screenWidth / (_numberOfPlayers + 1) * (i + 1);
_players[i].Position.Y = _terrainContour[(int)_players[i].Position.X];
}
}
private void GenerateTerrainContour()
{
_terrainContour = new int[_screenWidth];
double rand1 = _randomizer.NextDouble() + 1;
double rand2 = _randomizer.NextDouble() + 2;
double rand3 = _randomizer.NextDouble() + 3;
float offset = _screenHeight / 2;
float peakheight = 100;
float flatness = 70;
for (int x = 0; x < _screenWidth; x++)
{
double height = peakheight / rand1 * Math.Sin((float)x / flatness * rand1 + rand1);
height += peakheight / rand2 * Math.Sin((float)x / flatness * rand2 + rand2);
height += peakheight / rand3 * Math.Sin((float)x / flatness * rand3 + rand3);
height += offset;
_terrainContour[x] = (int)height;
}
}
private void CreateForeground()
{
Color[,] groundColors = TextureTo2DArray(_groundTexture);
Color[] foregroundColors = new Color[_screenWidth * _screenHeight];
for (int x = 0; x < _screenWidth; x++)
{
for (int y = 0; y < _screenHeight; y++)
{
if (y > _terrainContour[x])
{
foregroundColors[x + y * _screenWidth] = groundColors[x % _groundTexture.Width, y % _groundTexture.Height];
}
else
{
foregroundColors[x + y * _screenWidth] = Color.Transparent;
}
}
}
_foregroundTexture = new Texture2D(_device, _screenWidth, _screenHeight, false, SurfaceFormat.Color);
_foregroundTexture.SetData(foregroundColors);
}
private void FlattenTerrainBelowPlayers()
{
foreach (PlayerData player in _players)
{
if (player.IsAlive)
{
for (int x = 0; x < 40; x++)
{
_terrainContour[(int)player.Position.X + x] = _terrainContour[(int)player.Position.X];
}
}
}
}
private Color[,] TextureTo2DArray(Texture2D texture)
{
Color[] colors1D = new Color[texture.Width * texture.Height];
texture.GetData(colors1D);
Color[,] colors2D = new Color[texture.Width, texture.Height];
for (int x = 0; x < texture.Width; x++)
{
for (int y = 0; y < texture.Height; y++)
{
colors2D[x, y] = colors1D[x + y * texture.Width];
}
}
return colors2D;
}
protected override void LoadContent()
{
_spriteBatch = new SpriteBatch(GraphicsDevice);
_device = _graphics.GraphicsDevice;
// TODO: use this.Content to load your game content here
_backgroundTexture = Content.Load<Texture2D>("background");
_carriageTexture = Content.Load<Texture2D>("carriage");
_cannonTexture = Content.Load<Texture2D>("cannon");
_rocketTexture = Content.Load<Texture2D>("rocket");
_smokeTexture = Content.Load<Texture2D>("smoke");
_groundTexture = Content.Load<Texture2D>("ground");
_font = Content.Load<SpriteFont>("myFont");
_screenWidth = _device.PresentationParameters.BackBufferWidth;
_screenHeight = _device.PresentationParameters.BackBufferHeight;
_playerScaling = 40.0f / (float)_carriageTexture.Width;
GenerateTerrainContour();
SetUpPlayers();
FlattenTerrainBelowPlayers();
CreateForeground();
}
private void ProcessKeyboard()
{
KeyboardState keybState = Keyboard.GetState();
if (keybState.IsKeyDown(Keys.Left))
{
_players[_currentPlayer].Angle -= 0.01f;
}
if (keybState.IsKeyDown(Keys.Right))
{
_players[_currentPlayer].Angle += 0.01f;
}
if (_players[_currentPlayer].Angle > MathHelper.PiOver2)
{
_players[_currentPlayer].Angle = -MathHelper.PiOver2;
}
if (_players[_currentPlayer].Angle < -MathHelper.PiOver2)
{
_players[_currentPlayer].Angle = MathHelper.PiOver2;
}
if (keybState.IsKeyDown(Keys.Down))
{
_players[_currentPlayer].Power -= 1;
}
if (keybState.IsKeyDown(Keys.Up))
{
_players[_currentPlayer].Power += 1;
}
if (keybState.IsKeyDown(Keys.PageDown))
{
_players[_currentPlayer].Power -= 20;
}
if (keybState.IsKeyDown(Keys.PageUp))
{
_players[_currentPlayer].Power += 20;
}
if (_players[_currentPlayer].Power > 1000)
{
_players[_currentPlayer].Power = 1000;
}
if (_players[_currentPlayer].Power < 0)
{
_players[_currentPlayer].Power = 0;
}
if (keybState.IsKeyDown(Keys.Enter) || keybState.IsKeyDown(Keys.Space))
{
_rocketFlying = true;
_rocketPosition = _players[_currentPlayer].Position;
_rocketPosition.X += 20;
_rocketPosition.Y -= 10;
_rocketAngle = _players[_currentPlayer].Angle;
Vector2 up = new Vector2(0, -1);
Matrix rotMatrix = Matrix.CreateRotationZ(_rocketAngle);
_rocketDirection = Vector2.Transform(up, rotMatrix);
_rocketDirection *= _players[_currentPlayer].Power / 50.0f;
}
}
private void UpdateRocket()
{
if (_rocketFlying)
{
Vector2 gravity = new Vector2(0, 1);
_rocketDirection += gravity / 10.0f;
_rocketPosition += _rocketDirection;
_rocketAngle = (float)Math.Atan2(_rocketDirection.X, -_rocketDirection.Y);
for (int i = 0; i < 5; i++)
{
Vector2 smokePos = _rocketPosition;
smokePos.X += _randomizer.Next(10) - 5;
smokePos.Y += _randomizer.Next(10) - 5;
_smokeList.Add(smokePos);
}
}
}
protected override void Update(GameTime gameTime)
{
if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed ||
Keyboard.GetState().IsKeyDown(Keys.Escape))
{
Exit();
}
// TODO: Add your update logic here
ProcessKeyboard();
UpdateRocket();
base.Update(gameTime);
}
protected override void Draw(GameTime gameTime)
{
GraphicsDevice.Clear(Color.CornflowerBlue);
// TODO: Add your drawing code here
_spriteBatch.Begin();
DrawScenery();
DrawPlayers();
DrawText();
DrawRocket();
DrawSmoke();
_spriteBatch.End();
base.Draw(gameTime);
}
private void DrawScenery()
{
Rectangle screenRectangle = new Rectangle(0, 0, _screenWidth, _screenHeight);
_spriteBatch.Draw(_backgroundTexture, screenRectangle, Color.White);
_spriteBatch.Draw(_foregroundTexture, screenRectangle, Color.White);
}
private void DrawPlayers()
{
for (int i = 0; i < _players.Length; i++)
{
if (_players[i].IsAlive)
{
int xPos = (int)_players[i].Position.X;
int yPos = (int)_players[i].Position.Y;
Vector2 cannonOrigin = new Vector2(11, 50);
_spriteBatch.Draw(_carriageTexture, _players[i].Position, null, _players[i].Color, 0, new Vector2(0, _carriageTexture.Height), _playerScaling, SpriteEffects.None, 0);
_spriteBatch.Draw(_cannonTexture, new Vector2(xPos + 20, yPos - 10), null, _players[i].Color, _players[i].Angle, cannonOrigin, _playerScaling, SpriteEffects.None, 1);
}
}
}
private void DrawText()
{
PlayerData player = _players[_currentPlayer];
int currentAngle = (int)MathHelper.ToDegrees(player.Angle);
_spriteBatch.DrawString(_font, "Cannon angle: " + currentAngle.ToString(), new Vector2(20, 20), player.Color);
_spriteBatch.DrawString(_font, "Cannon power: " + player.Power.ToString(), new Vector2(20, 45), player.Color);
}
private void DrawRocket()
{
if (_rocketFlying)
{
_spriteBatch.Draw(_rocketTexture, _rocketPosition, null, _players[_currentPlayer].Color, _rocketAngle, new Vector2(42, 240), _rocketScaling, SpriteEffects.None, 1);
}
}
private void DrawSmoke()
{
for (int i = 0; i < _smokeList.Count; i++)
{
_spriteBatch.Draw(_smokeTexture, _smokeList[i], null, Color.White, 0, new Vector2(40, 35), 0.2f, SpriteEffects.None, 1);
}
}
}
}