How to use different fonts

[rainzee]

I have a very basic question, I want to create a text like a title that is more eye-catching than normal ImGui::Text, with a larger font and different colors.

I checked the documentation and this can be achieved with different fonts.

Load multiple fonts:

// Init
ImGuiIO& io = ImGui::GetIO();
ImFont* font1 = io.Fonts->AddFontFromFileTTF("font.ttf", size_pixels);
ImFont* font2 = io.Fonts->AddFontFromFileTTF("anotherfont.otf", size_pixels);
// In application loop: select font at runtime
ImGui::Text("Hello"); // use the default font (which is the first loaded font)
ImGui::PushFont(font2);
ImGui::Text("Hello with another font");
ImGui::PopFont();

As I was on an open source project to make some modifications, The project is structured like this
├─Project
│ │ GUI.cpp
│ │ GUI.hpp
│ │ Hooks.cpp
│ │ Hooks.hpp

In GUI.cpp

ImGui::Begin();
//Title ImGui Text Here
ImGui::PushFont(font_title);
ImGui::Text("Title");
ImGui::PopFont();
//Normal ImGui Text Here
ImGui::Text("Normal");
ImGui::End();

In Hook.cpp

static void init_imgui(void* device, bool is_d3d11 = false) noexcept
	{
		ImGui::CreateContext();
		auto& style{ ImGui::GetStyle() };
		// init style
		
		auto& io{ ImGui::GetIO() };
		io.IniFilename = nullptr;
		io.LogFilename = nullptr;
		io.ConfigFlags |= ImGuiConfigFlags_NoMouseCursorChange;

		if (PWSTR pathToFonts; SUCCEEDED(::SHGetKnownFolderPath(FOLDERID_Fonts, 0, nullptr, &pathToFonts))) {
			const std::filesystem::path path{ pathToFonts };
			::CoTaskMemFree(pathToFonts);
			ImFontConfig cfg;
			cfg.SizePixels = 15.0f;
			io.Fonts->AddFontFromFileTTF((path / "tahoma.ttf").string().c_str(), 15.0f, &cfg, ranges);
			cfg.MergeMode = true;
			io.Fonts->AddFontFromFileTTF((path / "malgun.ttf").string().c_str(), 16.0f, &cfg, getFontGlyphRangesKr());
			io.Fonts->AddFontFromFileTTF((path / "simhei.ttf").string().c_str(), 12.0f, &cfg, io.Fonts->GetGlyphRangesChineseFull());
			cfg.MergeMode = false;
		}
                // init d3d device
	}

Now my question is where should I add my title font and how do I use it in GUI.cpp.

Sorry, this seems like a very rookie question, but I have checked all the documentation I can read, and since this is a small open source project and not all code in one file, So I don't quite understand how to do.

[MachineDynamo]

Hi, no it's not a bad question😄
I checked doc and demo code but seems there's no feature for just title text but you still can make title font by your own.
You need import a font for title that be bold and have bigger size then imoprt a regular font with smaller size for body text.

For Example:

1. Import Font :

ImFont* font_title = io.Fonts->AddFontFromFileTTF("c:\\Windows\\Fonts\\Roboto-Bold.ttf", 23.0f, NULL, io.Fonts->GetGlyphRangesDefault()); 
IM_ASSERT(title != NULL);
ImFont* font_body = io.Fonts->AddFontFromFileTTF("c:\\Windows\\Fonts\\Roboto-Regular.ttf", 18.0f, NULL, io.Fonts->GetGlyphRangesDefault());
IM_ASSERT(body != NULL);

2. Then Useing it :

ImGui::Begin("Hello");

//Title ImGui Text Here
ImGui::PushFont(font_title);
ImGui::Text("Title");
ImGui::PopFont();

//Normal ImGui Text Here
PushFont(font_body);
ImGui::Text("Normal");
ImGui::PopFont();
ImGui::End();

[rainzee]

Thank you so much for your reply, I didn't think anyone would see it after all this time, very high quality response!

[MachineDynamo]

Your welcome, if was useful mark it