2.9.16
Coherent GT
A modern user interface library for games
Minimal HelloGT Sample

This guide is about the way Coherent GT works at runtime and has to be integrated in an application. For a guide on the workflow and how to create beautiful UI with Coherent GT, please refer to our Workflow guide and the Coherent Editor guide.

This guide will show you how to

  1. Add Coherent GT as a library to a project
  2. Create a Coherent::UIGT::UISystem and create a single view
  3. Create surfaces to be used by this view
  4. Display the view using a graphics API

Note that the sample depends on the Coherent Sample framework and can work with DirectX 11.

System Initialization

Configure the Coherent::UIGT::UISystem settings in a Coherent::UIGT::SystemSettings variable. Here we only set a debugger port for debugging purposes and use everything else by default.

settings.DebuggerPort = 19999;
Coherent::UIGT::UISystem* system = InitializeUIGTSystem(COHERENT_UI_GT_LICENSE,
settings,
Coherent::LoggingGT::Info);

View Initialization

  1. Configure the View settings in a Coherent::UIGT::ViewInfo variable.
  2. Create a file resource handler and give it as reference Coherent::UIGT::ViewInfo::ResourceHandlerInstance. (If you want to work with "coui" resources. Set the full path to the html document you want to load.)
  3. Create the View using the Coherent::UIGT::UISystem::CreateView method.
const char* resourcePath = "coui://uiresources/minRes/MainUI.html";
FileResourceHandler fileHandler;
info.Width = width;
info.Height = height;
info.IsTransparent = true;
info.ResourceHandlerInstance = &fileHandler;
Coherent::UIGT::View* view = system->CreateView(info, resourcePath);

Backend Initialization

All rendering in Coherent GT is performed by the Renoir graphics library on the GPU. The API-specific piece that connects the Renoir Core to the GPU is distributed for all major graphics APIs (DirectX 9/11, OpenGL, libGNM etc.) in the package. You can directly use the provided code or use it to customize and integrate the rendering in your engine. You can use your own backend by inheriting from the renoir::RendererBackend interface.

renoir::Dx11BackendSettings backendSettings;
backendSettings.Device = static_cast<ID3D11Device*>(renderer.GetDevice());
std::unique_ptr<renoir::Dx11Backend> backend(new renoir::Dx11Backend(&backendSettings));
bool didInitialize = backend->InitializeStaticResources();

Create System Renderer

Create the Coherent::UIGT::UISystemRenderer using the Coherent::UIGT::UISystem::CreateRenderer method and the backend.

Coherent::UIGT::UISystemRenderer* systemRenderer = system->CreateRenderer(backend.get(), backend.get());

Create View Renderer

Create the Coherent::UIGT::ViewRenderer using the Coherent::UIGT::UISystemRenderer::CreateViewRenderer method and the textures from the DirectX initialization.

Coherent::UIGT::NativeRenderTarget rt = { texture.TextureRTV, depthStencil.DSV };
Coherent::UIGT::ViewRenderer* viewRenderer = systemRenderer->CreateViewRenderer(
view,
rt,
width,
height,
1/*sample count*/);

Setup Events

Propagate the events to the View event handlers.

std::function<void(const COUI_NMSPC::KeyEventData& e)> onKeyEvent = [&](const COUI_NMSPC::KeyEventData& e)
{
view->KeyEvent(e);
};
std::function<void(const COUI_NMSPC::MouseEventData& e)> onMouseEvent = [&](const COUI_NMSPC::MouseEventData& e)
{
view->MouseEvent(e);
};
window.setEvents(onKeyEvent, onMouseEvent);

Game Loop

  1. Coherent::UIGT::UISystem::Advance is advancing the timers of the UI. Should be called each frame.
  2. Coherent::UIGT::View::Layout layouts the content of the page. Layout returns the id of the rendering commands it recorded. You should call this method each frame after calling Advance on the UI system.
  3. Coherent::UIGT::ViewRenderer::Paint executes the recorded rendering commands with the given id in the user supplied texture.
system->Advance();
unsigned frameId = view->Layout();
viewRenderer->Paint(frameId);
renderer.DrawScene();

Resource destruction

Always destroy the resources in the following order:

  1. Coherent::UIGT::ViewRenderer::Destroy
  2. Coherent::UIGT::View::Destroy
  3. Coherent::UIGT::UISystemRenderer::Destroy
  4. Coherent::UIGT::UISystem::Uninitialize
viewRenderer->Destroy();
viewRenderer = nullptr;
view->Destroy();
view = nullptr;
systemRenderer->Destroy();
systemRenderer = nullptr;
system->Uninitialize();
system = nullptr;