Skip to content

Using Dear Imgui

Luke edited this page Jun 23, 2023 · 1 revision

Using Dear ImGui with TwinspireCS is easy to use and already has implementation details which means little is required to set it up.

Initialise Dear ImGui

In Program.cs, after calling InitAll() you need to specify that you wish to use ImGui and initialise it separately from the main Twinspire workflow.

app.UseImGui = true;
app.InitImGui();
var imguiController = app.GetImGuiController();
imguiController.Init();

After the application closes, we need to ensure everything closes down properly.

imguiController.Shutdown();

Running and Rendering Dear ImGui

In our main game loop, we need to update our code to allow us to render ImGui:

imguiController.NewFrame();
imguiController.ProcessEvent();
ImGui.NewFrame();

Raylib.BeginDrawing();
Raylib.ClearBackground(Color.RAYWHITE);

if (ImGui.Begin("Something"))
{
    ImGui.LabelText("Dum", "Yeah, sure.");

    ImGui.End();
}

ImGui.Render();
var data = ImGui.GetDrawData();
imguiController.Render(data);

Raylib.EndDrawing();

Using a Different Font

You can add fonts from memory using ResourceManager to obtain the byte data for the ttf font required.

To use another font in Dear ImGui, use the following:

app.UseImGui = true;
app.InitImGui();

string ext = "";
int size = 0;
app.ImGuiAddFont(app.ResourceManager.GetBytesFromMemory("MainFont", ref ext, ref size), 20);
var imguiController = app.GetImGuiController();
imguiController.Init();

We use the function GetBytesFromMemory which takes the identifier, the file extension and size as a reference. Both of these are references, but we don't need them. This function is used internally to load resources typically, so it makes sense in those contexts, but here we can discard these variables.

Note the order of instructions. app.ImGuiAddFont must be called after app.InitImGuI() is called and before imguiController.Init().

The first font you add is the first one used by default in Dear ImGui.

To get another font or format for ImGui, you need access the the public function GetFont which you can do by calling into Application.Instance.GetImGuiController(). Font names are generated in a specific format.

The way the identifiers are generated internally is based on the index of when fonts were added. Identifiers are in the following format:

data_{index}:{fontsize}

This is generated if using byte[] data when adding fonts. If you are adding fonts directly from a raw file, like if using ImGuiAddFont("path_to_font.ttf", 20), the identifier is instead generated as:

path_to_font.ttf:{fontsize}

fontsize refers to the size you want to load the font in as, which in the above example is 20. So, if you want to load a font loaded from a raw file, you use `Application.Instance.GetImGuiController().GetFont("path_to_font.ttf:20");".

If adding a font using the second overload with byte[] data, then indexes are generated based on when you added using this overload.

So, if you add three fonts by memory and you want the second font loaded from memory, use the index value 1. Example: Application.Instance.GetImGuiController().GetFont("data_1:20").

Clone this wiki locally