Посмотреть демо можно здесь: https://ubgamez.ru/graph2d/game.html (откроется в браузере)
Моя C++ либа для 2D-игр: scene graph, HTML-UI, свет и запеченный Spine
Короче, здорово, аноны. Давно собирался показать, какую хуйню я пилю в свободное время, когда не надо впахивать на галере. Это кастомная библиотека для 2D-игр на плюсах. Из фич: древовидный scene graph, рендер через один батч-конвейер, HTML-рендерер для UI (чтобы не ебаться с рантайм-версткой), нормальный свет и, сука, запеченные Spine-анимации. Код выкачу в ближайшее время под MIT — вместе с демкой, из которой надергал примеры ниже.
[SceneGraph]
Каждый объект — это CContainer. Внутри зашито всё: позиция, скейл, поворот, пивот, альфа, tint, скролл-бокс, твины и дочерние элементы. Трансформа наследуется по дереву, рендер хуярит строго в порядке детей, а z-order — это просто их индекс в массиве. Спрайт, лейбл, HTML-документ, партиклы, Spine, диалог — всё это ноды одного дерева с единым интерфейсом.
auto ptrHero = std::make_shared
ptrHero->addChild(ptrShadow);
ptrHero->addChild(ptrBody); // тень под телом
// z-order — просто порядок детей
ptrHero->swapChildren(ptrShadow, ptrBody);
ptrHero->bringChildToFront(ptrBody);
dialog->bringChildUnderForeground(ptrPanel);
// вспышка удара: твин тинта
ptrBody->addSelfTween(eTweenProp::BLACKEN, 1.f, 0.2f, 0.1f, Easing::linear);
ptrBody->addSelfTween(eTweenProp::BLACKEN, 0.f, 1.0f, 0.6f, Easing::outQuad, 0.1f);
Если надо, чтобы лейбл намертво привязался к спине персонажа и двигался вместе с ним — делаешь addChild() и вообще не паришь мозг, он будет кататься, крутиться и скейлиться за родителем. Из коробки завез каскадную упаковку детей с переносом строк и выравниванием, drag & drop и таймеры через тот же твинер, чтоб не городить велосипеды.
_ptrParticlesDemo->packChildrenCascade(maxCx, maxCy, 7.f, true);
btnsCont->alignChildren(eChildrenAlign::HORIZONTAL, 20.f, getDialogCx());
// drag & drop
ptrFace->setInteractive(true);
ptrFace->setDragable({}, [](CContainerPtr, float, float) { return true; });
ph->setInteractive(true);
ph->setOnDragDropAccept([](CContainerPtr dropped) { return true; });
ph->setOnDragDropped([](float x, float y, CContainerPtr dropped)
{
dropped->setPos(0, 0);
ph->addChild(dropped); // карта стала ребёнком слота
});
------------------------------
[Диалоговая_система]
BaseDialog — нода дерева со стеком модальных окон, стилями закрытия и жизненным циклом.
auto dlg = std::make_shared
dlg->setTitle("Настройки", ptrTitleSprite, 113, 113);
dlg->createCloseButton(ptrNormal, ptrPressed, ptrHover, ptrDisabled);
dlg->createFgLayer(ptrFg, 60, 60, 46, 46); // рамка поверх контента
// модально: захватывает ввод, скрывает предыдущее окно стека
dlg->open(this { refreshHud(); }); // колбэк после закрытия
Режимы жизни: open() — модальное окно со стеком; showAsPanel() — панель внутри родительского диалога, ввод не блокирует; закрытие по крестику, по колбэку или CLICK_ANYWHERE — когда кликаешь мимо окна. На коленке собран встроенный скролл: скроллбар, тени, физика флинга с «оттяжкой» за краем и возвратом обратно, колесо мыши и drag-скролл — работает сразу без допила напильником.
------------------------------
[HTML_внутри_сцены]
UI — это просто HTML-документ, который прикидывается нодой дерева. Таблицы, ссылки, чекбоксы, слайдеры, прогрессбары, комбобоксы с выпадашкой, nine/three-slice, картинки с дефолтными эффектами (glare, glitch, пикселизация…) и даже тег
_ptrAboutDemo->init(R"HTML(....)HTML", cx - 40, cy, shared_from_this());
// клик по ссылке копирует в буфер (через Emscripten)
auto* dom = HTMLDom::getInstance();
dom->setOnClick(dom->findNodeIdByAttr(0, "id", "tg_link"),
[](unsigned long long, float x, float y, int)
{
copyToClipboard("@ubgamez");
showCopyToast(x, y);
});
------------------------------
[Запеченный Spine: в десятки раз быстрее]
Если выкатить дефолтный Runtime-Spine на сотню юнитов, он просто трахнет CPU в кашу из-за костей, мешей и клатчинга. Поэтому анимации можно запечь оффлайн в компактный бинарник — позиции жмутся в int16, UV в uint16, альфа и blend — в один байт. В рантайме движок просто один раз проходится по статическому буферу с интерполяцией кадров:
ptrSpine->loadPackedAnimation(0, "BBB/barbarian_idle.panm", 1, true, ptrTex);
ptrSpine->setAnimationByTag(1);
Никакой тяжелой костной математики в кадре — можно спавнить десятки спинов на сцене, fps не просядет. При этом Runtime-режим никуда не делся: если нужны события анимации и хитбоксы — дергаешь обычный API. Оба режима спокойно уживаются вместе.
------------------------------
[Свет прибитый к Spine]
Движок держит до 204 источников в uniform-блоке на кадр, куллинг слоев идет прямо в шейдере. Но самая сочная фича — привязка света к самому скелету:
// аттачмент сам светит: фонарь из картинки фонаря
_ptrLamp->setLightAttachment("light", true);
_ptrLamp->setLightAttachment("lightspot", true);
// радиальный свет на кости
ptrHero->addRadialLight(300.f, "hand_bone", "torch_slot", 1.5f);
Для отмеченного аттачмента рендерер каждый кадр строит квад спрайта в экранных координатах и кидает в световую таблицу — фрагмент шейпится UV аттачмента, яркость умножается на альфу слота. Факел машет — пятно света гуляет по стенам ровно так, как его нарисовал аниматор. Светят и runtime-, и запеченные спины.
На том же конвейере крутятся bloom, виньетка, «капли на стекле», зерно, аберрация и fish-eye. Если интенсивность эффекта на нуле — ветка в шейдере полностью отключается, так что на слабом говне мамонта тяжелые постэффекты не будут жрать ресурсы.