top of page

[XNA/MG] Voxel Engine - 2 - First steps and drawing

Dernière mise à jour : 6 août 2018



We created a new project with MonoGame. But we have to know where to start, and at first, you will see that there are already some classes. Let's look at it :


  • Program : This first class is where everything starts. You don't have to change anything in it, unless you are building more complex things around it. It generates a new instance of your game which loops until you close it.

  • Game1 : This is your main script. Where everything starts. This is what is generated by "Program". In it you have some variables :

GraphicsDeviceManager graphics;

It stores and manages data for the window and your display. It's where you will set your screen size and fullscreen value.

SpriteBatch spriteBatch;

The SpriteBatch is used to manage the drawing system. With it, you can drawn on the screen and build your graphics.


There are also some Methods added to the class :


protected override void Initialize()

It will be used like a "Start" method in Unity. That's where you can initialize your classes and call things once.

protected override void LoadContent()

Inside this method, you can call the content manager to load images or sounds in your game. You can ignore this method but it is optimized to load everything when you start the game.

It also builds the SpriteBatch.

protected override void UnloadContent()

This one unloads content you don't need anymore. It is also called when you close the game.

protected override void Update(GameTime gameTime)

Like Unity, there is an Update method. It loops every frame and the game time is stored in a variable.

protected override void Draw(GameTime gameTime)

Finally, the Draw method will be where we will draw our graphics. We also have a gameTime variable because the graphics will be updated every frame.



Pipeline Tool :

In your solution explorer (your project files), in the "Content" folder, there is the Content file of your project. Right click on it and select "Open With..". Then select "MonoGame Pipeline Tool" (You can set it as default).


Your game images and sounds will have to be added here. It will build them and generate files that will be read by your game loaded in MonoGame.

You can make folders/add items and Drag-and-Drop files in the Pipeline Tool. When your files are ready, click on "Build".




How can i draw with my new images?


Here i used two block textures, both 32x32. Let's look at the "Draw" method.

First, we will show a block on screen :

There are already two lines.

GraphicsDevice.Clear(Color.CornflowerBlue);

The frame starts by clearing the last frame shown on screen and adding a color for the background instead of nothing.

base.Draw(gameTime);

This line is used by MonoGame to call back an update. It must be in the method and can't be removed.


Between the two lines, we can add our code. We have to tell when we begin drawing and where it ends. It is used because we can add parameters to "Begin". Here we will show the image on the window, but later we will add parameters to put the image in a 2D world view. The drawing system will be handled by the SpriteBatch.


Let's add a new Texture2D, a 2D sprite. It will be our block texture. We use the ContentManager, which looks in the Pipeline Tool where we added the textures, to load the image in our new variable.



Now we can draw the texture on screen :

We give the texture we just loaded. We can also load it directly in this line but it is more readable this way. Next, we create a rectangle. It contains the position and size of the image, it's the bounding box of the texture. Here we put it at 0,0 (Origin of the screen is Top Left) and it's size to 32x32, the size of the image. Finally, we set the color of it. Here white, we set it to the color we already have.


Now click on "Start" or "F5" to test your code.

The Game window will open after building the project and it will show your texture on screen. (Remember that it is updated every frame).


I will show you in the next guides how to draw text and get the mouse position in a grid :


558 vues0 commentaire

Posts récents

Voir tout
bottom of page