search

segross / UnrealImGui

Unreal plug-in that integrates Dear ImGui framework into Unreal Engine 4.
MIT License
666 stars 211 forks source link

Custom Fonts Example #69

Closed Calvinatorr closed 2 years ago

Calvinatorr commented 2 years ago

Just wondering if you could provide an example of how to use custom fonts with the plugin?

I've tried the standard ImGui method of adding a font but end up with a broken font atlas (just using a standard ttf font). I see there's some methods for using custom fonts through the Unreal wrappers provided, but no indication how to really use these.

image

sammyfreg commented 2 years ago

This should be fairly easy.

In 'FImGuiContextManager::BuildFontAtlas()' add your new font loading after 'FontAtlas.AddFontDefault()'.

Then use 'ImGui::PushFont() / ImGui::PopFont()' using its font index (order it was added) to retrieve the font object to push, using ' ImGui::GetIO().Fonts->Fonts[YourFontIndex]'.

For more details, you can look at the implementation in UnrealNetImgui : *https://github.com/sammyfreg/UnrealNetImgui/blob/master/Source/Private/NetImguiModule.cpp in 'StartupModule()' and 'PushFont()'.

It is somewhat a little bit more complicated but should give you a good template. It handles multiple fonts with multiple characters pages in each (for icons and japanese). It also use compiled binary font, avoiding file loading so it easily with on any platform

On Wed, Jun 15, 2022 at 4:31 AM Calvin @.***> wrote:

Just wondering if you could provide an example of how to use custom fonts with the plugin?

I've tried the standard ImGui method of adding a font but end up with a broken font atlas (just using a standard ttf font). I see there's some methods for using custom fonts through the Unreal wrappers provided, but no indication how to really use these.

[image: image] https://user-images.githubusercontent.com/8314550/173673088-c1b2b0c8-846c-447f-9189-66b0895d6675.png

— Reply to this email directly, view it on GitHub https://github.com/segross/UnrealImGui/issues/69, or unsubscribe https://github.com/notifications/unsubscribe-auth/AESBPYZWXSYDJRSYJYR5LSDVPDMZNANCNFSM5YY2KMEA . You are receiving this because you are subscribed to this thread.Message ID: @.***>

Calvinatorr commented 2 years ago

Adding it in FImGuiContextManager::BuildFontAtlas did the trick. I expected to need to use FImGuiModule::Get().GetProperties().AddCustomFont() but I don't understand how ImFontConfig is related to the actual ImFont which gets added to the font atlas.

sammyfreg commented 2 years ago

Ah, it might be possible to do it that way, and the right way to do it. I had not seen the method when quickly answering.

Looking at the codebase at home, I can see that you should be able to use FImGuiModule::Get().GetProperties().AddCustomFont() like you were doing, and then call FImGuiModule:: Get().RebuildFontAtlas(). This should allow the system to regenerate the font texture and updating Dear ImGui with the new FontId.

On Thu., Jun. 16, 2022, 02:57 calvin @.***> wrote:

Adding it in FImGuiContextManager::BuildFontAtlas did the trick. I expected to need to use FImGuiModule::Get().GetProperties().AddCustomFont() but I don't understand how ImFontConfig is related to the actual ImFont which gets added to the font atlas.

— Reply to this email directly, view it on GitHub https://github.com/segross/UnrealImGui/issues/69#issuecomment-1156769117, or unsubscribe https://github.com/notifications/unsubscribe-auth/AESBPY2HYUBE2NBQBV4BKE3VPIKQJANCNFSM5YY2KMEA . You are receiving this because you commented.Message ID: @.***>

Calvinatorr commented 2 years ago

Yeah unfortunately that's what I'd tried prior but as it expects ImFontConfig and not the ImFont itself, and looking at the code I'm a bit confused what it actually achieves.

I was able to modify the plugin to add an optional list of font filenames stored in FImGuiModuleProperties which it'll load inside FImGuiContextManager::BuildFontAtlas and an optional bool to build the default font, so it does what I want now.