Loads and displays an image, using the nuget MonoGame.Content.Builder.Task.

https://github.com/tornseglare/ShootThemAll/releases/tag/v1.1

All images, fonts (and I think sound files) must be converted to .xnb files before monogame can use them. Usually, you do this in the content builder app, which is manual, tedious and boring when you forget to do it.

The nuget MonoGame.Content.Builder.Task automatically rebuild the .xnb files for you! When you edit and save an image file the nuget detect the file has changed and rebuild its corresponding .xnb file.

So install this nuget in your project at once.

New in this version is the folder Content, and inside that a folder Art. The fabulous image snail.png dwelve in this folder.

The file ShootThemAll.mgcb describe which files we want the content builder to recognize and build .xnb files for.

Let's start with the last line in the .mgcb file: /build:Art/snail.png

This line tells the content builder to create snail.xnb so we can use the image in our game. Above this line are a bunch of settings for images, you should google them and read about the details. My settings are good for “gamy” images, most important it supports the alpha channel so we can draw an image but omit the transparent parts.

I created it static with static member images. This let me collect all images in one class to keep them organized.

This line finds the Snail.xnb file and load it into memory:

Snail = content.Load<Texture2D>(“Art/snail”);

This line creates an empty texture with the dimensions 1×1 pixels:

Pixel = new Texture2D(Snail.GraphicsDevice, 1, 1);

Lastly, this line set the single pixel to white:

Pixel.SetData(new[] { Color.White });

Here we mainly have some changes to let us draw the image. We are using the monogame SpriteBatch to draw our image.

Initialize() instructs monogame where to find the Content-directory. In our case we named it “Content”. In this folder monogame finds the .mgcb file and the image files.

LoadContent() creates the spriteBatch object and connect it to our game's GraphicsDevice. Art.Load(Content) loads the actual .xnb file(s) into our game's ContentManager.

Update() should contain game-logic but no drawing operations.

Draw() contains all drawing logic. In our simple example we start with simply clearing the screen.

spriteBatch.Begin() starts a new 'recording' of draw-events and spriteBatch.End() ends it, and somewhere along the line, your draw events are sent to the graphic card.

spriteBatch.Draw() let us tell monogame we want to draw the Art.Snail image. The extra parameters are position, source clip rectangle, rotation and rotation center, scale and a heap of other neat functionality. But right now we don't use any of that, we simply draw our image.

The quickest way for you to grasp these settings is to download the code, compile and run, and then start changing the position! In no time you will have a semi-transparent rotated up-scaled image of a snail with a red tone.

Back to index