Some questions about Hello ImGui and communication

[pthom]

Hello, I really like your project, and its dear-imgui branch makes an excellent demonstration of Hello ImGui capabilities. I have several questions related to this.

Can I refer to your project and display it as an example for HelloImGui / ImGui Bundle?

The fact that your project compiles to Emscripten seamlessly and is able to load images even on a browser does interest me quite a lot.

If you agree (and when you are ready), I would like to consider the possibility to add it to a gallery inside Hello ImGui documentation and maybe also inside the interactive manual for ImGui Bundle, with a link to a live Emscripten version.

As a matter of fact, the way that you setup the application (see below) is extremely readable and could serve as an additional hands-on tutorial for Hello ImGui.

Below is the code extract I would like to show in a possible documentation/gallery page:

hdrview/src/app.cpp

Lines 152 to 334 in 881d56c

	HDRViewApp::HDRViewApp()
	{
	spdlog::set_pattern("%^[%T | %5l]: %$%v");
	spdlog::set_level(spdlog::level::trace);
	spdlog::default_logger()->sinks().push_back(ImGui::GlobalSpdLogWindow().sink());
	ImGui::GlobalSpdLogWindow().set_pattern("%^%*[%T | %5l]: %$%v");
	#if defined(__EMSCRIPTEN__) && !defined(HELLOIMGUI_EMSCRIPTEN_PTHREAD)
	// if threading is disabled, create no threads
	unsigned threads = 0;
	#elif defined(HELLOIMGUI_EMSCRIPTEN_PTHREAD)
	// if threading is enabled in emscripten, then use just 1 thread
	unsigned threads = 1;
	#else
	unsigned threads = std::thread::hardware_concurrency();
	#endif
	spdlog::debug("Setting global OpenEXR thread count to {}", threads);
	Imf::setGlobalThreadCount(threads);
	spdlog::debug("OpenEXR reports global thread count as {}", Imf::globalThreadCount());
	#if defined(__APPLE__)
	// if there is a screen with a non-retina resolution connected to an otherwise retina mac, the fonts may look
	// blurry. Here we force that macs always use the 2X retina scale factor for fonts. Produces crisp fonts on the
	// retina screen, at the cost of more jagged fonts on screen set to a non-retina resolution.
	m_params.dpiAwareParams.dpiWindowSizeFactor = 1.f;
	m_params.dpiAwareParams.fontRenderingScale = 0.5f;
	#endif
	m_params.rendererBackendOptions.requestFloatBuffer = HelloImGui::hasEdrSupport();
	spdlog::info("Launching GUI with {} display support.", HelloImGui::hasEdrSupport() ? "EDR" : "SDR");
	spdlog::info("Creating a {} framebuffer.",
	HelloImGui::hasEdrSupport() ? "floating-point precision" : "standard precision");
	// set up HelloImGui parameters
	m_params.appWindowParams.windowGeometry.size = {1200, 800};
	m_params.appWindowParams.windowTitle = "HDRView";
	m_params.appWindowParams.restorePreviousGeometry = false;
	// Setting this to true allows multiple viewports where you can drag windows outside out the main window in order to
	// put their content into new native windows
	m_params.imGuiWindowParams.enableViewports = false;
	m_params.imGuiWindowParams.defaultImGuiWindowType = HelloImGui::DefaultImGuiWindowType::ProvideFullScreenDockSpace;
	// m_params.imGuiWindowParams.backgroundColor = float4{0.15f, 0.15f, 0.15f, 1.f};
	// Load additional font
	m_params.callbacks.LoadAdditionalFonts = [this]() { load_fonts(); };
	//
	// Menu bar
	//
	// Here, we fully customize the menu bar:
	// by setting `showMenuBar` to true, and `showMenu_App` and `showMenu_View` to false,
	// HelloImGui will display an empty menu bar, which we can fill with our own menu items via the callback `ShowMenus`
	m_params.imGuiWindowParams.showMenuBar = true;
	m_params.imGuiWindowParams.showMenu_App = false;
	m_params.imGuiWindowParams.showMenu_View = false;
	// Inside `ShowMenus`, we can call `HelloImGui::ShowViewMenu` and `HelloImGui::ShowAppMenu` if desired
	m_params.callbacks.ShowMenus = [this]() { draw_menus(); };
	//
	// Toolbars
	//
	HelloImGui::EdgeToolbarOptions edgeToolbarOptions;
	edgeToolbarOptions.sizeEm = 2.2f;
	edgeToolbarOptions.WindowPaddingEm = ImVec2(0.7f, 0.35f);
	m_params.callbacks.AddEdgeToolbar(
	HelloImGui::EdgeToolbarType::Top, [this]() { draw_top_toolbar(); }, edgeToolbarOptions);
	//
	// Status bar
	//
	// We use the default status bar of Hello ImGui
	m_params.imGuiWindowParams.showStatusBar = true;
	m_params.callbacks.ShowStatus = [this]() { draw_status_bar(); };
	//
	// Dockable windows
	//
	// the histogram window
	HelloImGui::DockableWindow histogram_window;
	histogram_window.label = "Histogram";
	histogram_window.dockSpaceName = "HistogramSpace";
	histogram_window.isVisible = true;
	histogram_window.rememberIsVisible = true;
	histogram_window.GuiFunction = [this] { draw_histogram_window(); };
	// the file window
	HelloImGui::DockableWindow file_window;
	file_window.label = "File";
	file_window.dockSpaceName = "FileSpace";
	file_window.isVisible = true;
	file_window.rememberIsVisible = true;
	file_window.GuiFunction = [this] { draw_file_window(); };
	// the info window
	HelloImGui::DockableWindow info_window;
	info_window.label = "Info";
	info_window.dockSpaceName = "FileSpace";
	info_window.isVisible = true;
	info_window.rememberIsVisible = true;
	info_window.GuiFunction = [this] { draw_info_window(); };
	// the channels window
	HelloImGui::DockableWindow channel_window;
	channel_window.label = "Channels";
	channel_window.dockSpaceName = "ChannelSpace";
	channel_window.isVisible = true;
	channel_window.rememberIsVisible = true;
	channel_window.GuiFunction = [this] { draw_channel_window(); };
	// the window showing the spdlog messages
	HelloImGui::DockableWindow log_window;
	log_window.label = "Log";
	log_window.dockSpaceName = "LogSpace";
	log_window.isVisible = false;
	log_window.rememberIsVisible = true;
	log_window.GuiFunction = [this] { ImGui::GlobalSpdLogWindow().draw(font("mono regular")); };
	// docking layouts
	m_params.dockingParams.layoutName = "Standard";
	m_params.dockingParams.dockableWindows = {histogram_window, file_window, info_window, channel_window, log_window};
	m_params.dockingParams.dockingSplits = {
	HelloImGui::DockingSplit{"MainDockSpace", "HistogramSpace", ImGuiDir_Left, 0.2f},
	HelloImGui::DockingSplit{"HistogramSpace", "FileSpace", ImGuiDir_Down, 0.75f},
	HelloImGui::DockingSplit{"FileSpace", "ChannelSpace", ImGuiDir_Down, 0.25f},
	HelloImGui::DockingSplit{"MainDockSpace", "LogSpace", ImGuiDir_Down, 0.25f}};
	m_params.callbacks.SetupImGuiStyle = []()
	{
	// make things like radio buttons look nice and round
	ImGui::GetStyle().CircleTessellationMaxError = 0.1f;
	};
	#if defined(HELLOIMGUI_USE_GLFW)
	m_params.callbacks.PostInit_AddPlatformBackendCallbacks = [this]
	{
	spdlog::trace("Registering glfw drop callback");
	spdlog::trace("m_params.backendPointers.glfwWindow: {}", m_params.backendPointers.glfwWindow);
	glfwSetDropCallback((GLFWwindow *)m_params.backendPointers.glfwWindow,
	[](GLFWwindow *w, int count, const char **filenames)
	{
	vector<string> arg(count);
	for (int i = 0; i < count; ++i) arg[i] = filenames[i];
	hdrview()->load_images(arg);
	});
	};
	#endif
	//
	// Load user settings at `PostInit` and save them at `BeforeExit`
	//
	m_params.iniFolderType = HelloImGui::IniFolderType::AppUserConfigFolder;
	m_params.iniFilename = "HDRView/settings.ini";
	m_params.callbacks.PostInit = [this]
	{
	load_settings();
	setup_rendering();
	};
	m_params.callbacks.BeforeExit = [this] { save_settings(); };
	m_params.callbacks.ShowGui = [this]()
	{
	add_pending_images();
	if (g_show_help)
	draw_about_dialog();
	if (g_show_tool_metrics)
	ImGui::ShowMetricsWindow(&g_show_tool_metrics);
	if (g_show_tool_debug_log)
	ImGui::ShowDebugLogWindow(&g_show_tool_debug_log);
	if (g_show_tool_id_stack_tool)
	ImGui::ShowIDStackToolWindow(&g_show_tool_id_stack_tool);
	if (g_show_tool_style_editor)
	{
	ImGui::Begin("Dear ImGui Style Editor", &g_show_tool_style_editor);
	ImGui::ShowStyleEditor();
	ImGui::End();
	}
	if (g_show_tool_about)
	ImGui::ShowAboutWindow(&g_show_tool_about);
	};
	m_params.callbacks.CustomBackground = [this]() { draw_background(); };
	}

There is no rush. You can tell me yes or no, or tell me that you prefer to wait until you added some more features to it.

About the logger

I like the way you did the layout for the logger in the application. Would you mind if someday I take some inspiration from it in order to update the logger inside Hello ImGui?

---

We can discuss this inside this GitHub issue or you can contact me by email if you prefer.

Thanks!

[wkjarosz]

Sorry for my delay and thanks for the offer.

Yes, I would be interested in this once the new branch is in a state that I feel could be shared more broadly. I had hoped to get more time in the last month to make progress, but unfortunately haven't yet.

Things work pretty well on macOS, but I'll need to get things working reliably in emscripten and windows in the ci and deployment github actions.

[wkjarosz]

@pthom I've merged the dear-imgui branch to master and released version 2.0. If you are still interested we could resume this conversation now.

[pthom]

Hello,

I am definitely interested! Let's resume this conversation of course. I'll have time after new year for this.

Congrats, the new version looks extremely polished!

[wkjarosz]

One note @pthom: I plan to switch from your imgui bundle to just hello imgui since I don't need any of the python stuff.