Графическая библиотека SFML. Создание простых геометрических фигур

  Дмитрий Бушуев  | 

    | 

  Обновл. 8 Сен 2019  | 

 419

Ты всю жизнь ощущал, что мир не в порядке. Странная мысль, но её не отогнать. Она — как заноза в мозгу. Она сводит с ума, не даёт покоя. Это и привело тебя ко мне… Примешь синюю таблетку — и сказке конец. Ты проснёшься в своей постели и поверишь, что это был сон. Примешь красную таблетку — войдёшь в страну чудес. Я покажу тебе, насколько глубока библиотека SFML кроличья нора.

Круги

Предлагаю для начала потренироваться на простых геометрических фигурах типа Михаила круга. В этом деле большую помощь нам окажет класс CircleShape:

   конструктор данного класса принимает в качестве параметра радиус нашей будущей фигуры (например, circle(50.f));

   закрасить её можно с помощью метода setFillColor(), который очень похож на уже знакомый нам метод window.clear();

   ну и для отображения круга в окне нам нужно использовать метод window.draw().

Например:

Результат выполнения программы выше:

Наша фигура может иметь контур. Для его создания используется метод setOutlineThickness(), а для цвета контура — setOutlineColor():

Результат:

Как уже знаем из предыдущего урока, при закрашивании фигур или фона можно ещё указывать значение прозрачности. Например, строчкой setOutlineColor(Color(80, 220, 50, 150)) мы устанавливаем 150 в качестве значения прозрачности контура:

А теперь, с помощью строчки setOutlineColor(Color(80, 220, 50, 50)), мы установим 50 в качестве значения прозрачности контура:

Вы уже наверняка заметили, что наш круг выходит за границы окна, а это не совсем хорошо. Нужно его немного подвинуть, а поможет нам в этом метод move():

Результат:

Регулярные полигоны


-Welcome to the real world!

Отлично! Сейчас мы рассмотрим, как нарисовать и другие фигуры. Теперь ты готов узнать истину. Она заключается в том, что, на самом деле, ложки не существует, Нео твой круг — это немножко не круг, а многоугольник. Да-да, самый обычный многоугольник с большИм количеством вершин. Всё дело в том, что у конструктора класса CircleShape есть ещё и второй параметр (помимо радиуса), который отвечает за количество вершин у создаваемой фигуры и, по умолчанию, он равен 30. Именно при значениях близких к 30, многоугольник становится мало отличимым от круга. В то же время, задавая этот параметр самостоятельно, мы можем получить абсолютно другие геометрические элементы. Не трудно догадаться, что 3 вершины — это треугольник, 4 вершины — квадрат, 5 вершин — пятиугольник, ну а 8 вершин — восьмиугольник (октагон).

Ниже приведен полный код матрицы программы, которая наглядно покажет создание данных фигур:

Результат выполнения программы выше:

Выпуклые многоугольники

Теперь рассмотрим создание выпуклого многоугольника через координаты его вершин. Для работы с такими фигурами в SFML имеется класс ConvexShape, который содержит методы setPointCount() и setPoint(). Метод setPointCount() устанавливает количество вершин будущего многоугольника, а метод setPoint() устанавливает сами вершины, принимая в качестве параметров порядковый номер (индекс) создаваемой вершины и её координаты:

Результат выполнения программы выше:

Обратите внимание, координаты вершин задаются в виде контейнера Vector2f(a, b). Данный контейнер — это простой шаблонный класс библиотеки SFML.

Примечание: Порядок, в котором вы будете определять точки многоугольника, очень важен. Все они должны быть определены либо по часовой стрелке, либо против часовой стрелки. Если вы будете определять их в несогласованном порядке, то форма многоугольника будет построена неправильно.

Прямоугольники


Для работы с прямоугольниками используется класс RectangleShape, параметрами которого являются геометрические размеры фигуры (ширина и высота). Здесь всё просто:

Результат:

Линии

Для рисования линий в SFML есть класс, который называется… называется… а никак он не называется, потому что специализированного класса для работы с линиями в SFML нет. Но если так подумать: а нужен ли он вообще, ведь линии по своей сути — это те же прямоугольники, только не такие широкие, поэтому вполне логично, что мы можем использовать уже знакомый нам класс RectangleShape.

Сейчас мы создадим линию с заданной толщиной:

Результат:

А теперь линия с нулевой толщиной:

Результат:

Вы уже заметили, что последняя линия получилась с небольшим дефектом цвета? Об этом мы поговорим чуть позже.

Сглаживание


Заметили, какие края у чёрного многоугольника? Как нет?!?! Да его краями можно деревья пилить! Чтобы избавиться от этого дефекта, нужно включить сглаживание, которое сделает нашу картинку намного более приятной глазу. Сразу отмечу, что в SFML нет возможности включить сглаживание (или ещё «антиалиасинг», от англ. «anti-aliasing») для какой-то одной фигуры. Оно действует глобально: для всего окна. При этом учитывайте, что возможность использовать сглаживание зависит от характеристик вашей видеокарты или параметров видеодрайвера:

Результат выполнения программы выше:

А теперь немного .gif-ки вам в ленту (смотрите на края вершин — как было и как стало):

Заключение

-I know Kung Fu!

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

Теперь ты понял, насколько глубока кроличья нора, впереди нас ждёт ещё очень много интересного…  KNOCK KNOCK NEO.

Исходный код. Урок №2 — Графическая библиотека SFML

Оценить статью:

Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5 (5 оценок, среднее: 5,00 из 5)
Загрузка...

Добавить комментарий

Ваш E-mail не будет опубликован. Обязательные поля помечены *