Hello again! In this video, we are going to have a slight digression before we get onto the breakout
game
in the project. We are going to go back to the random walk practical from the "Algorithms" section.
I promised I would show you how to do this in two dimensions, using graphics.
And here it is.
Let's start off with a couple more concepts from SFML that we are going to need. The "Vector2" represents
a two-dimensional vector. It has members 'x' and 'y', which you can access directly, without using getters
and setters.
It supports arithmetic operations.
So you could add two vectors together, for example, and you can also compare them for equality.
And it is a template class.
We are going to be using "Vector2f", which is an alias for the instantiation of this with a float
type parameter.
And the reason for that is that SFML uses float internally. As opposed to C++, which uses double by
default.
We are not actually going to use the "Texture" class until the next video, but we need to introduce it
now.
This represents an image which has been loaded into the graphics card. And it can be drawn on a "render
target", such as the RenderWindow.
we had in the last example.
This drawing will actually be done by the graphics card.
It does not involve the CPU or main memory at all, so there is no overhead in terms of processor time or memory
operations.
So this is incredibly fast.
On the other hand, loading data into the graphics cards and getting it out again is extremely slow.
So this is mainly useful for things which you are going to be displaying very frequently.
The shape class represents a pre-defined texture.
So you can think of this as a texture which is provided by the library. And it can be drawn on a render
target.
It has a rectangle associated with it, called a "texture rectangle".
So for example, we could have a texture, an image which represents a circle. This texture rectangle
will be the vector angle which bounds this circle.
So the circle just fits inside it. The "origin" of this shape is the top left-hand corner of the
texture rectangle. Which confused me a bit when I started using SFML.
You would think, if you rotate a circle, it would go like that, about the centre of the circle.
In fact, it goes like that, around the origin of the rectangle.
The Shape is an abstract base class, so we cannot use it directly.
There are some child classes. We are going to use the CircleShape, which is obviously a circle.
There is also a ConvexShape and a RectangleShape.
So here is the code.
We are going to write a class, which will represent the creature which is moving around on the screen.
We have the random number engine and the Bernoulli distribution object, which we declare as static.
So these are going to generate Booleans with a 50/50 chance of being true or false.
We are going to use a Vector2f to represent the velocity of this creature. The x component will control
the movement sideways.
So if "vx" is positive, it is going to move to the right.
And if it is negative, it is going to move to the left.
If "vy" is positive, the creature will move down the screen, and if it is negative, it will move up.
We are going to use a CircleShape as the actual graphical object.
And then we have the constructor.
So this will create a creature
at the requested coordinates. We set the velocity to the default values, then we set the circle
to be in the position that is requested.
We set the radius of the circle to be 5 pixels, and we fill it in with the red colour.
We have a draw() member function, which will do whatever is needed to get an object to this class to be drawn
on the window.
In this case, we just call the draw() member function of the window and we pass the CircleShape to it. Because
the SFML library will know what to do with that.
And finally, we have an update() member function, which will calculate the new position of the creature.
So this is just the logic we had before, to change the direction of movement at random.
And then, once we have got this velocity vector, we move the creature to its new position.
So this will add "vx" and "vy" to the existing position.
Then we initialize our static objects, outside any class or function.
We create an object of this class.
We want this to appear in the middle of the screen.
So we use half the width as the x coordinate, and half the height as the y coordinate.
And then, most of this code is going to look very familiar.
So we create the RenderWindow, limit the frame rate, have a game loop, clear the screen, check for closing
or pressing escape, and then we update the creature.
So this is where we calculate the new position of the creature. And then we call its draw member function.
So it is all ready, it is all in the window's buffer. And then we call display() to make it actually
appear on the screen.
And then we go back on, to the next loop iteration.
And there we are.
So there is our bee, buzzing around.
Or our drunkard tryin to find a way home.
Or whatever it is meant to represent.
Okay, so that is it for this feature.
I will see you next time.
Until then, keep coding!