8. Starting with Graphics¶

In this small excursion, we want to create a program which draws a two-dimensional circle filled with green color onto the screen. Afterwards, we shall use the build system to automate the compilation process.

SFML as Grahpics Library¶

First of all, we need to install a graphics library. For this small example, the SFML library seems suitable. Read the official SFML documentation to get better insight on how to do this.

Drawing two-dimensional shapes, text, and similar objects on the screen is handled by the graphics card of a computer. The graphics card is a component which posseses its own memory, also known as dynamic random-access memory (DRAM), and its own processing unit (GPU). Typically, the information for a screen resides on the DRAM and has to be transferred by the GPU after running customizable programs, called shaders, adjusting the output.

Debian/Ubuntu

sudo apt-get update && sudo apt-get install libsfml-dev

Arch Linux

sudo pacman -S sfml

Sample Project¶

After a succesful installation of SFML, let us now start with a new project.

$ pwd
/home/lyrahgames/projects/cpp-course
$ ls
01-hello  02-input  03-fibonacci  04-files  05-rational
$ mkdir 06-graphics
$ ls
01-hello  02-input  03-fibonacci  04-files  05-rational  06-graphics
$ cd 06-graphics
$ pwd
/home/lyrahgames/projects/cpp-course/06-graphics
$ touch main.cpp
$ ls
main.cpp

First Graphics¶

We take the code for our small example from the official SFML documentation.

#include <SFML/Graphics.hpp>

int main() {
  sf::RenderWindow window(sf::VideoMode(800, 450), "SFML works!");

  sf::CircleShape shape(100.f);
  shape.setOrigin(100, 100);
  shape.setPosition(400, 225);
  shape.setFillColor(sf::Color::Green);

  while (window.isOpen()) {
    sf::Event event;
    while (window.pollEvent(event)) {
      if (event.type == sf::Event::Closed) window.close();
    }

    window.clear();
    window.draw(shape);
    window.display();
  }
}

Compiling the project with g++ -o graphics main.cpp will result in a few linker errors. That is because all the special structures and functions in main.cpp are at least declared somehow by including SFML/Graphics.hpp but not defined. For this, we need to actually link the SFML libraries to our project.

Library Linking¶

Again, this can be read here.

$ g++ -o graphics main.cpp -lsfml-graphics -lsfml-window -lsfml-system
./graphics
$ ./graphics

Using the Build System¶

We do not want to remember all those libraries and the linker options. Hence, we use a build system, like the build2 toolchain. The build system allows us to script the compiling process and automatically append the difficult flags and options.

$ pwd
/home/lyrahgames/projects/cpp-course/06-graphics
$ ls
main.cpp
$ touch buildfile
$ ls
main.cpp  buildfile

The buildfile is the file read by build2 to generate the executable. For this small project, it looks like the following.

using cxx
import libs = sfml-graphics%lib{sfml-graphics}
exe{graphics}: cxx{main.cpp} $libs

Furthe explanations of the buildfile syntax are given in the next lessons. We can start the compiling process by calling the following (very simple) command (at least it is only a single letter).

$ b
$ ./graphics

$ b clean

References¶

• SFML
• build2