Basic SFML Moving a Sprite

Transcription

1 Basic SFML Moving a Sprite This sample program is a basic SFML program allowing the user to move a sprite around a screen by using the keyboard. 1. Download the zip file associated with this lecture. This file is named graphics.zip and it contains a folder with two images inside the folder. 2. Create a new project in either Visual Studio or CodeBlock and name it movesprite 3. Visual Studio unzip the graphics.zip file in the project folder. This is the folder containing the project file movesprite.vcxproj. 4. CodeBlocks unzip the graphics.zip file in the project folder. This is the folder containing the project file movesprite.cbp. 5. Enter the following code: #include <SFML/Graphics.hpp> using namespace sf; # using stdafx.h for Visual Studio int main() // set framerate const unsigned int FPS = 60; // setup screen VideoMode vm(1024,768); RenderWindow window(vm, "SFML works!"); window.setframeratelimit(fps); // create textures Texture backt, carrott; backt.loadfromfile("graphics/background1.png"); carrott.loadfromfile("graphics/carrot.png"); // create sprites from textures Sprite bbb(backt); Sprite car(carrott); car.setorigin(carrott.getsize().x/2, carrott.getsize().y/2); float carspeed = 1.0f; // draw background bbb.setposition(0,0); // position carrot on screen in random position srand( (int)time(0)); int xpos =(int)(rand()%window.getsize().x); int ypos = (int)(rand()%window.getsize().y); while(xpos-car.getorigin().x<0 xpos+car.getorigin().x>window.getsize().x) xpos = (int)(rand()%window.getsize().x); while(ypos-car.getorigin().y<0 ypos+car.getorigin().y>window.getsize().y) ypos = (int)(rand()%window.getsize().y); car.setposition(xpos,ypos); Event evt;

2 while (window.isopen()) while(window.pollevent(evt)) if(evt.type==event::closed) window.close(); // check keyboard and move carrot if(keyboard::iskeypressed(keyboard::left)) car.move(-5.0f,0.0f); if(keyboard::iskeypressed(keyboard::right)) car.move(5.0f,0.0f); if(keyboard::iskeypressed(keyboard::up)) car.move(0.0f,-5.0f); if(keyboard::iskeypressed(keyboard::down)) car.move(0.0f,5.0f); window.clear(); window.draw(bbb); window.draw(car); window.display(); return 0; This code includes the following sections: A. Setup B. Initial Position C. Game Loop

3 Setup In this section the window is defined, the framerate capped, and the images are loaded. A const value named FPS is set to 60. This is then used (line 12) to set the window framerate. A video mode named vm is defined so the window will have the size 1024 X and 768 Y. This video mode is then used to create a RenderWindow (line 11) and the window then has it s framerate capped (12). Two texture object are then defined (backt, carrot) and each is loaded from the external file. Notice how the path name in the loadfromfile() method refers to the graphics folder in the project area. Sprites can only be defined once textures are loaded. Multiple sprites can share the same texture. The sprites are both defined and loaded with their associated textures on lines 20/21. The origin of a Sprite is the position in the sprite where drawing will start. The origin is also how the sprite will be positioned on the screen. In this case the Sprite car is setting its own Origin by dividing the size of the texture by 2 (Line 22). Notice how the texture.getsize() method returns a vector and not a specific number. The getsize() method returns an object of the type Vector2u which is a pair of unsigned integers that can be accessed with x and y. For example, in line 22 when the width of the sprite was accessed you could have written: Vector2u vsize = carrott.getsize(); car.setorigin(vsize.x/2, vsize.y/2); The sprite movement speed is then set to 1.0f in line 23. Finally, the background image is set to the upper left corner of the screen by using the statement in line 26.

4 Initial Position The next tasks is to set the carrot image on the screen in a random position. This entails getting a random pair of x/y numbers and using them in a setposition(x,y) statement. However, your program wants to make sure that the carrot image does not appear partially off the screen. Since the drawing point of the carrot image is the center of the image we want to make sure that it is not randomly drawn off the screen. This drawing logic is: I. Generate a pair of values for X and Y that is > 0 and less than the width or height of the window. II. Fixup the x/y values to prevent the carrot being drawn partially off the screen. III. Position the carrot. In order to create a pair of X/Y values that are inside the game window you would use the code: First, the random generator Seed is set. This is a value that ensures a more random result and it is done on line 29. The current time in milliseconds is used as the seed and it is returned by using the command (int) time(0) Once the seed has been set the actual values of xpos and ypos are generated by returning a random number with rand() and dividing this number by the window size and returning the remainder (lines 30,31). This ensures that the value of xpos and ypos can never be larger than the window size because the remainder of dividing a number into another number can never be larger than the original number (100%51 is 49). One you have a pair of random numbers for the x/y positions, you must fixup these numbers so they keep the sprite inside the boundary of the window. This is done by checking the position values and generating new ones if the sprite position is off screen to the left or right. In order for the sprite to be offscreen to the left the xpos the sprite width/2 must be zero or less. The value of getorigin().x is the center point of the sprite and represents the width divided by 2. Same with the height. The while() statement keeps generating xpos and ypos values as long as the value is either off to the left or off to the right (xpos minus half the width must be greater than 0 and xpos plus half the width must be less than the window width. Finally, the carrot sprite is set in position with setposition(xpos,ypos).

5 Game Loop The game loop is where everything happens First, an event object is defined in line 41. The game loop starts on line 43. While the window flag returned by isopen() is true then the game loop continues. On lines 45 to 49 the queue of Events returned by the Window is checked. This is done by retrieving the event object from the pollevent() method into the Event object evt. Then, if the event object is a Closed event then the window is closed(). Below the Event loop are a series of checks on the keyboard. These are written to check the Keyboard object and are written in the format: if( Keyboard::isKeyPressed ( Keyboard:: Left) ) The Keyboard class has a static method named iskeypressed() that, when passed a Keyboard value (Keyboard::Left) returns a boolean value as long as this key is being pressed. If the key is being pressed then the sprite move() method is used:

6 car.move( vx, vy); This move method does not set the position of the sprite but adds a number to the x/y values and then calls a setposition(). If you were to write your own move command it would look like: public void MoveSprite( Sprite s, float movex, float movey) float xpos = s.getposition().x; float ypos = s.getposition().y; xpos += movex; ypos += movey; s.setposition( xpos, ypos ); You would pass either positive or negative values to this method. This is what is being implemented with the move() command. Finally, the window is cleared and the two sprites are drawn. Make sure that the background is always drawn first otherwise it will draw over any other graphic object.