Текст на экране

До сих пор на экране были только фигуры. Иногда нужен ещё и текст — например, подпись или число рядом с объектом.

Чтобы нарисовать текст, компьютеру нужен шрифт — готовый набор изображений для каждой буквы и цифры, то есть то, как именно будет выглядеть каждый символ на экране. Без шрифта рисовать текст было бы просто нечем. У macroquad уже есть свой, встроенный шрифт — его не нужно отдельно подключать, он подставляется сам. Но у этого шрифта есть ограничение: кириллицу, то есть русские буквы, он рисовать не умеет. Поэтому в этом уроке обойдёмся английскими буквами и цифрами.

В macroquad для текста есть draw_text:

draw_text(text, x, y, font_size, color);

text — это строка, та самая, что и в уроке «Строки». Если нужно показать число, сначала переводим его через .to_string(), как там и делали.

x, y — это не центр

У draw_circle x, y — центр круга. У draw_text всё иначе: это базовая линия — воображаемая черта, на которой стоят буквы, как линия в тетради. Сам текст рисуется в основном выше этой точки, а не вокруг неё.

Попробуй сам

Красная точка на картинке — это и есть (x, y), которые переданы в draw_text. Поводи мышью и посмотри, как текст расположен относительно неё:

Код

src/main.rs

use macroquad::prelude::*;

#[macroquad::main("Текст на экране")]
async fn main() {
    loop {
        clear_background(BLACK);

        // Координаты курсора.
        let (mouse_x, mouse_y) = mouse_position();

        // Текст рисуется от базовой линии — она идёт понизу букв,
        // а не через центр и не по верхнему краю.
        draw_text("Hello!", mouse_x, mouse_y, 80.0, WHITE);

        // Точка ровно в (mouse_x, mouse_y) — видно, где проходит
        // базовая линия относительно самих букв.
        draw_circle(mouse_x, mouse_y, 3.0, RED);

        next_frame().await;
    }
}

Что здесь происходит

• draw_text("Hello!", mouse_x, mouse_y, 80.0, WHITE) — рисует строку "Hello!" белым цветом, размером 80.0.
• mouse_x, mouse_y здесь — не центр текста, а его базовая линия: буквы стоят на этой точке, а не окружают её.
• Красная точка рисуется ровно в той же точке, что и текст, — чтобы было видно, где проходит базовая линия: чуть ниже большинства букв и примерно на уровне низа цифр.
• Если нужно показать число, сначала превращаем его в строку через .to_string() — draw_text ждёт именно строку, а не число.
• Текст на английском не случайно — встроенный шрифт macroquad умеет рисовать только латиницу и цифры, кириллицу он не понимает.