§1 Первая программа. Рисование линий

Знакомство с примитивами SFML

Графический модуль (Graphics module) содержит весь арсенал для рисования в области окна, а также функции для отрисовки самого окна. Создадим окно первого приложения. В начале программы (1.1) включим графический модуль и определим пространство имен SFML. В главной функции программы создадим объект окна window как экземпляр класса RenderWindow. Конструктор принимает несколько аргументов. Первый – это разрешение окна VideoMode, а второй строка-заголовок.
Программа 1.1

#include  <SFML/Graphics.hpp>
using namespace sf;

int main() {
	//======================================================//
	// Конструктор окна                                     //
	//======================================================//
    RenderWindow window(VideoMode(500, 500), "lesson-1-1");

    //======================================================//
    // Главный цикл программы                               //
    //======================================================//
    while (window.isOpen()) {
    	// Конструктор обработчика событий
        Event event;
        while (window.pollEvent(event)) {
            if (event.type == Event::Closed)
                window.close();
        }
        // Вызовы функций
        window.clear();
        window.display();
    }
    return 0;
}

Программа содержит два обязательных (т. е. их нельзя удалять) вложенных цикла, обеспечивающих работу приложения. Эти окна – событийного характера. Обработчики событий мы рассмотрим позднее. Внешний цикл, контролирующий закрытие окна, содержит вызовы различных функций. За отображение окна отвечает метод display(), он должен быть последним в череде вызовов.
В пределах созданного окна нарисуем две линии диагонально к окну. Обычные линии создаются классом VertexArray. Графические примитивы этого класса создаются путем введения массива точек, которые (если это не Points) соединяются линиями.
Система координат – обычная экранная система: центр координат находится в левом верхнем углу. Положительные значения по иксу откладываются вправо, а положительные значения по игреку откладываются вниз.
Толщину линий этого класса изменить нельзя, она всегда фиксирована, но можно определить их цвет. При этом цвет определяется к элементу массива, а не ко всему массиву. Это позволяет рисовать градиентные линии.
Для того, чтобы нарисовать линию с заданной толщиной необходимо использовать другой класс, например (как в программе ниже), – RectangleShape. В этом классе используются иные методы рисования: setPosition для определения начальной позиции, setFillColor – цвета и rotate – направления.
Программа 1.2. Линии

#include  <SFML/Graphics.hpp>
#include <cmath> // для hypot
using namespace sf;

int main() {
    RenderWindow window(VideoMode(500, 500), "lesson-1-2");
    //======================================================
    // Конструктор линии
    //======================================================
    VertexArray line(Lines, 2);
    line[0].position = Vector2f(0, 0);
    line[0].color = Color::Blue;
    line[1].position = Vector2f(500, 500);
    // линия будет с градиентом
    line[1].color = Color::Cyan;

    //======================================================
    // Конструктор линии с изменяемой толщиной
    //======================================================
    RectangleShape line2(Vector2f(hypot(500, 500), 5));
    // Устанавливаем позицию откуда начинать рисовать
    line2.setPosition(0, 500);
    line2.setFillColor(Color(255, 0, 0));
    // минус рисует вверх
    line2.rotate(-45);

    while (window.isOpen()) {
    	// Конструктор обработчика событий
        Event event;
        while (window.pollEvent(event)) {
            if (event.type == Event::Closed)
                window.close();
        }
        // Вызовы функций
        window.clear();
        window.draw(line);
        window.draw(line2);
        window.display();

    }
    return 0;
}


С помощью примитива Points создадим окно в котором будет нарисована синусоида градиентной линией. В отличие от предыдущей программы, массив будет определен в цикле, а для большей гибкости в управлении отображением графика и окна используем переменные.
Программа 1.3. Синусоида

#include <SFML/Graphics.hpp>
#include <cmath> //для sin
using namespace sf;

int main() {
	int W = 500; // Ширина и высота окна
	int H = 500;
    RenderWindow window(VideoMode(W, H), "lesson-1-3");
    //======================================================
    // Рисуем синусоиду с помощью Points
    //======================================================
    VertexArray point(Points, W);
    double x = 0.0;
    int n = 2; // плотность кривой
    int h = H / 2 - 30; // высота кривой
    double d = 0.05; // плотность точек
    for (int i = 0; i < W; i++) {
    	point[i].position = Vector2f(i * n, H / 2 - h * sin(x));
    	int clr = (i < 256 ? i : i % 255);
    	point[i].color = Color(255 - clr, 0, clr);
    	x += d;
    }
    //======================================================
    // Главный цикл программы
    //======================================================
    while (window.isOpen()) {
    	// Конструктор обработчика событий
        Event event;
        while (window.pollEvent(event)) {
            if (event.type == Event::Closed)
                window.close();
        }
        // Вызовы функций
        window.clear();
        window.draw(point);
        window.display();
    }
    return 0;
}

Задания для самостоятельной работы

  • С помощью линий изобразите гистограмму. Высоту и цвет столбов определите случайным образом
  • Нарисуйте график функции f(x) = ax3 + bx2. Используйте переменные a и b для изменения внешнего вида графика функции, а также переменные W и H для управления окном программы и отображением графика. Помимо графика, выведите оси координат.
Print Friendly, PDF & Email

Comments are closed.