[BETA] Automatic DPI-aware UI scaling

Sources/OvEditor/include/OvEditor/Core/EditorActions.h

@@ -19,6 +19,7 @@
 #define EDITOR_EVENT(target) OvCore::Global::ServiceLocator::Get<OvEditor::Core::EditorActions>().target
 #define EDITOR_CONTEXT(instance) OvCore::Global::ServiceLocator::Get<OvEditor::Core::EditorActions>().GetContext().instance
 #define EDITOR_PANEL(type, id) OvCore::Global::ServiceLocator::Get<OvEditor::Core::EditorActions>().GetPanelsManager().GetPanelAs<type>(id)
+#define EDITOR_UI_SCALE EDITOR_CONTEXT(uiManager)->GetScale()
 
 namespace tinyxml2
 {

Sources/OvEditor/include/OvEditor/Settings/EditorSettings.h

@@ -8,7 +8,6 @@
 
 #include <string>
 
-#include <OvEditor/Settings/EFontSize.h>
 #include <OvTools/Eventing/Event.h>
 #include <OvUI/Styling/EStyle.h>
 
@@ -99,7 +98,8 @@ namespace OvEditor::Settings
 		inline static Property<float> ScalingSnapUnit = { 1.0f };
 		inline static Property<int> ColorTheme = { static_cast<int>(OvUI::Styling::EStyle::DEFAULT_DARK) };
 		inline static Property<int> ConsoleMaxLogs = { 500 };
-		inline static Property<int> FontSize = { static_cast<int>(EFontSize::DEFAULT) };
+		inline static Property<int> UIScale = { 100 };
+		inline static Property<bool> BetaDpiAwarenessDialogPresented = { false };
 		inline static Property<std::string> CodeEditorCommand = { "code {workdir} --goto {path}" };
 		inline static Property<bool> RegenerateScriptingProjectFilesOnStartup = { true };
 	};

Sources/OvEditor/src/OvEditor/Core/Context.cpp

@@ -15,6 +15,7 @@
 #include <OvEditor/Settings/EditorSettings.h>
 #include <OvRendering/Entities/Light.h>
 #include <OvTools/Utils/SystemCalls.h>
+#include <optional>
 
 using namespace OvCore::Global;
 using namespace OvCore::ResourceManagement;
@@ -117,25 +118,22 @@ OvEditor::Core::Context::Context(const std::filesystem::path& p_projectFolder) :
 
 	std::filesystem::create_directories(Utils::FileSystem::kEditorDataPath);
 
-	uiManager = std::make_unique<OvUI::Core::UIManager>(window->GetGlfwWindow(),
+	uiManager = std::make_unique<OvUI::Core::UIManager>(
+		*window,
 		static_cast<OvUI::Styling::EStyle>(OvEditor::Settings::EditorSettings::ColorTheme.Get())
 	);
 
-	const auto fontPath = editorAssetsPath / "Fonts" / "Ruda-Bold.ttf";
-
 	if (!std::filesystem::exists(OvEditor::Utils::FileSystem::kLayoutFilePath))
 	{
 		const auto defaultLayoutPath = std::filesystem::current_path() / "Config" / "layout.ini";
 		uiManager->ResetLayout(defaultLayoutPath.string());
 	}
 
-	uiManager->LoadFont(std::string{ Settings::GetFontID(Settings::EFontSize::BIG) }, fontPath.string(), 18);
-	uiManager->LoadFont(std::string{ Settings::GetFontID(Settings::EFontSize::MEDIUM) }, fontPath.string(), 15);
-	uiManager->LoadFont(std::string{ Settings::GetFontID(Settings::EFontSize::SMALL) }, fontPath.string(), 12);
-	uiManager->UseFont(std::string{ Settings::GetFontID(
-		static_cast<Settings::EFontSize>(Settings::EditorSettings::FontSize.Get())
-	) });
-
+	const auto fontPath = editorAssetsPath / "Fonts" / "Ruda-Bold.ttf";
+	uiManager->LoadFont("Ruda-Bold", fontPath.string(), 15);
+	uiManager->UseFont("Ruda-Bold");
+	const int uiScale = Settings::EditorSettings::UIScale.Get();
+	uiManager->SetScale(uiScale == 0 ? std::nullopt : std::make_optional(uiScale / 100.0f));
 	uiManager->SetEditorLayoutSaveFilename(OvEditor::Utils::FileSystem::kLayoutFilePath.string());
 	uiManager->SetEditorLayoutAutosaveFrequency(60.0f);
 	uiManager->EnableEditorLayoutSave(true);

Sources/OvEditor/src/OvEditor/Core/ProjectHub.cpp

@@ -45,10 +45,14 @@ namespace OvEditor::Core
 			SetSize({ 1000, 580 });
 			SetPosition({ 0.f, 0.f });
 
-			auto& openProjectButton = CreateWidget<OvUI::Widgets::Buttons::Button>("Open Project");
-			auto& newProjectButton = CreateWidget<OvUI::Widgets::Buttons::Button>("New Project");
-			auto& pathField = CreateWidget<OvUI::Widgets::InputFields::InputText>("");
-			m_goButton = &CreateWidget<OvUI::Widgets::Buttons::Button>("GO");
+			auto& actionBar = CreateWidget<OvUI::Widgets::Layout::Group>();
+			actionBar.horizontal = true;
+			actionBar.stretchWidget = 2;
+
+			auto& openProjectButton = actionBar.CreateWidget<OvUI::Widgets::Buttons::Button>("Open Project");
+			auto& newProjectButton = actionBar.CreateWidget<OvUI::Widgets::Buttons::Button>("New Project");
+			auto& pathField = actionBar.CreateWidget<OvUI::Widgets::InputFields::InputText>("");
+			m_goButton = &actionBar.CreateWidget<OvUI::Widgets::Buttons::Button>("GO");
 
 			pathField.ContentChangedEvent += [this, &pathField](std::string p_content) {
 				pathField.content = std::filesystem::path{
@@ -118,7 +122,7 @@ namespace OvEditor::Core
 
 			auto& columns = CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
 
-			columns.widths = { 750, 500 };
+			columns.widths = { -1, 0 };
 
 			// Sanitize the project registry before displaying it, so we avoid showing
 			// corrupted/deleted projects.
@@ -162,11 +166,8 @@ namespace OvEditor::Core
 		void Draw() override
 		{
 			ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, { 50.f, 50.f });
-			ImGui::PushStyleVar(ImGuiStyleVar_WindowRounding, 0.f);
-
 			OvUI::Panels::PanelWindow::Draw();
-
-			ImGui::PopStyleVar(2);
+			ImGui::PopStyleVar(1);
 		}
 
 	private:
@@ -281,19 +282,43 @@ void OvEditor::Core::ProjectHub::SetupContext()
 	/* Graphics context creation */
 	m_driver = std::make_unique<OvRendering::Context::Driver>(OvRendering::Settings::DriverSettings{ false });
 
-	m_uiManager = std::make_unique<OvUI::Core::UIManager>(m_window->GetGlfwWindow(),
+	// DPI awareness BETA option
+	const auto windowContentScale = m_window->GetContentScale();
+	const auto unifiedWindowContentScale = std::max(windowContentScale.first, windowContentScale.second);
+
+	if (!Settings::EditorSettings::BetaDpiAwarenessDialogPresented.Get() && unifiedWindowContentScale > 1.0f)
+	{
+		Settings::EditorSettings::BetaDpiAwarenessDialogPresented.Set(true);
+		const auto dpiAwarenessDialog = OvWindowing::Dialogs::MessageBox(
+			"High DPI Monitor Detected",
+			"Overload has detected that you might be running the editor from a high DPI monitor.\n\n"
+			"Support for automatic DPI-scaling is currently in BETA and might result in weird spacings, "
+			"icon sizes, layouts, and window sizes.\n\n"
+			"Do you want to enable automatic DPI scaling anyway?\n\n"
+			"(You can change this setting anytime from the menu bar: Settings > Appearance)",
+			OvWindowing::Dialogs::MessageBox::EMessageType::QUESTION,
+			OvWindowing::Dialogs::MessageBox::EButtonLayout::YES_NO
+		);
+		switch (dpiAwarenessDialog.GetUserAction())
+		{
+			case OvWindowing::Dialogs::MessageBox::EUserAction::YES:
+				Settings::EditorSettings::UIScale.Set(0);
+			default: break;
+		}
+	}
+
+	m_uiManager = std::make_unique<OvUI::Core::UIManager>(
+		*m_window,
 		static_cast<OvUI::Styling::EStyle>(OvEditor::Settings::EditorSettings::ColorTheme.Get())
 	);
 
 	const auto fontPath = std::filesystem::current_path() / "Data" / "Editor" / "Fonts" / "Ruda-Bold.ttf";
 
-	m_uiManager->LoadFont(std::string{ Settings::GetFontID(Settings::EFontSize::BIG) }, fontPath.string(), 20);
-	m_uiManager->LoadFont(std::string{ Settings::GetFontID(Settings::EFontSize::MEDIUM) }, fontPath.string(), 18);
-	m_uiManager->LoadFont(std::string{ Settings::GetFontID(Settings::EFontSize::SMALL) }, fontPath.string(), 16);
-	m_uiManager->UseFont(std::string{ Settings::GetFontID(
-		static_cast<Settings::EFontSize>(Settings::EditorSettings::FontSize.Get())
-	) });
-
+	m_uiManager->LoadFont("Ruda-Bold", fontPath.string(), 18);
+	m_uiManager->UseFont("Ruda-Bold");
+	const int uiScale = Settings::EditorSettings::UIScale.Get();
+	m_uiManager->SetScale(uiScale == 0 ? std::nullopt : std::make_optional(uiScale / 100.0f));
 	m_uiManager->EnableEditorLayoutSave(false);
 	m_uiManager->EnableDocking(false);
 }
+

Sources/OvEditor/src/OvEditor/Panels/AssetProperties.cpp

@@ -56,12 +56,12 @@ OvEditor::Panels::AssetProperties::AssetProperties
 	m_settings = &CreateWidget<OvUI::Widgets::Layout::GroupCollapsable>("Settings");
 	m_settings->neverDisabled = true;
 	m_settingsColumns = &m_settings->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	m_settingsColumns->widths[0] = 150;
+	m_settingsColumns->widths[0] = 150 * EDITOR_UI_SCALE;
 
 	m_info = &CreateWidget<OvUI::Widgets::Layout::GroupCollapsable>("Info");
 	m_info->neverDisabled = true;
 	m_infoColumns = &m_info->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	m_infoColumns->widths[0] = 150;
+	m_infoColumns->widths[0] = 150 * EDITOR_UI_SCALE;
 
 	m_settings->enabled = m_info->enabled = false;
 }
@@ -178,7 +178,7 @@ void OvEditor::Panels::AssetProperties::CreateHeaderButtons()
 void OvEditor::Panels::AssetProperties::CreateAssetSelector()
 {
 	auto& columns = CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	columns.widths[0] = 150;
+	columns.widths[0] = 150 * EDITOR_UI_SCALE;
 	m_assetSelector = &OvCore::Helpers::GUIDrawer::DrawAsset(columns, "Target", m_resource, &m_targetChanged);
 	const auto& widgets = columns.GetWidgets();
 	widgets[widgets.size() - 1].first->neverDisabled = true;

Sources/OvEditor/src/OvEditor/Panels/Console.cpp

@@ -56,7 +56,6 @@ OvEditor::Panels::Console::Console
 	allowHorizontalScrollbar = true;
 
 	auto& clearButton = CreateWidget<Buttons::Button>("Clear");
-	clearButton.size = { 50.f, 0.f };
 	clearButton.idleBackgroundColor = { 0.5f, 0.f, 0.f };
 	clearButton.ClickedEvent += std::bind(&Console::Clear, this);
 	clearButton.lineBreak = false;

Sources/OvEditor/src/OvEditor/Panels/Inspector.cpp

@@ -346,7 +346,7 @@ void OvEditor::Panels::Inspector::_DrawComponent(AComponent& p_component, int p_
 
 	auto& columns = header.CreateWidget<Layout::Columns<2>>();
 	columns.SetID("comp_" + p_component.GetName());
-	columns.widths[0] = 200;
+	columns.widths[0] = 200 * EDITOR_UI_SCALE;
 	p_component.OnInspector(columns);
 }
 
@@ -379,7 +379,7 @@ void OvEditor::Panels::Inspector::_DrawBehaviour(Behaviour& p_behaviour, int p_i
 
 	auto& columns = header.CreateWidget<Layout::Columns<2>>();
 	columns.SetID("bhv_" + p_behaviour.name);
-	columns.widths[0] = 200;
+	columns.widths[0] = 200 * EDITOR_UI_SCALE;
 	p_behaviour.OnInspector(columns);
 }
 

Sources/OvEditor/src/OvEditor/Panels/MaterialEditor.cpp

@@ -263,7 +263,7 @@ void OvEditor::Panels::MaterialEditor::CreateHeaderButtons()
 void OvEditor::Panels::MaterialEditor::CreateMaterialSelector()
 {
 	auto& columns = CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	columns.widths[0] = 150;
+	columns.widths[0] = 150 * EDITOR_UI_SCALE;
 	m_targetMaterialText = &GUIDrawer::DrawMaterial(columns, "Material", m_target, &m_materialDroppedEvent);
 	const auto& widgets = columns.GetWidgets();
 	widgets[widgets.size() - 1].first->neverDisabled = true;
@@ -273,7 +273,7 @@ void OvEditor::Panels::MaterialEditor::CreateMaterialSelector()
 void OvEditor::Panels::MaterialEditor::CreateShaderSelector()
 {
 	auto& columns = m_settings->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	columns.widths[0] = 150;
+	columns.widths[0] = 150 * EDITOR_UI_SCALE;
 	m_shaderText = &GUIDrawer::DrawShader(columns, "Shader", m_shader, &m_shaderDroppedEvent);
 }
 
@@ -282,28 +282,28 @@ void OvEditor::Panels::MaterialEditor::CreateMaterialSettings()
 	m_materialPipelineState = &m_settings->CreateWidget<Layout::GroupCollapsable>("Pipeline State");
 	m_materialPipelineState->neverDisabled = true;
 	m_materialPipelineStateColumns = &m_materialPipelineState->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	m_materialPipelineStateColumns->widths[0] = 150;
+	m_materialPipelineStateColumns->widths[0] = 150 * EDITOR_UI_SCALE;
 
 	m_materialSettings = &m_settings->CreateWidget<Layout::GroupCollapsable>("Settings");
 	m_materialSettings->neverDisabled = true;
 	m_materialSettingsColumns = &m_materialSettings->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	m_materialSettingsColumns->widths[0] = 150;
+	m_materialSettingsColumns->widths[0] = 150 * EDITOR_UI_SCALE;
 }
 
 void OvEditor::Panels::MaterialEditor::CreateMaterialFeatures()
 {
 	m_materialFeatures = &m_settings->CreateWidget<Layout::GroupCollapsable>("Features");
 	m_materialFeatures->neverDisabled = true;
 	m_materialFeaturesColumns = &m_materialFeatures->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	m_materialFeaturesColumns->widths[0] = 150;
+	m_materialFeaturesColumns->widths[0] = 150 * EDITOR_UI_SCALE;
 }
 
 void OvEditor::Panels::MaterialEditor::CreateMaterialProperties()
 {
 	m_materialProperties = &m_settings->CreateWidget<Layout::GroupCollapsable>("Properties");
 	m_materialProperties->neverDisabled = true;
 	m_materialPropertiesColumns = &m_materialProperties->CreateWidget<OvUI::Widgets::Layout::Columns<2>>();
-	m_materialPropertiesColumns->widths[0] = 150;
+	m_materialPropertiesColumns->widths[0] = 150 * EDITOR_UI_SCALE;
 }
 
 void OvEditor::Panels::MaterialEditor::GenerateMaterialSettingsContent()

Sources/OvEditor/src/OvEditor/Panels/MenuBar.cpp

@@ -26,6 +26,7 @@
 #include <OvUI/Widgets/Selection/ColorEdit.h>
 #include <OvUI/Widgets/Selection/ComboBox.h>
 #include <filesystem>
+#include <optional>
 
 #include "OvEditor/Core/EditorActions.h"
 #include "OvEditor/Panels/AssetView.h"
@@ -34,6 +35,7 @@
 #include "OvEditor/Panels/SceneView.h"
 #include "OvEditor/Settings/EditorSettings.h"
 #include "OvEditor/Utils/ActorCreationMenu.h"
+#include "OvUI/Widgets/Selection/CheckBox.h"
 
 using namespace OvUI::Panels;
 using namespace OvUI::Widgets;
@@ -74,10 +76,10 @@ void OvEditor::Panels::MenuBar::HandleShortcuts(float p_deltaTime)
 
 void OvEditor::Panels::MenuBar::InitializeSettingsMenu()
 {
-	auto& themeButton = m_settingsMenu->CreateWidget<MenuList>("Editor Theme");
-	themeButton.CreateWidget<Texts::Text>("Some themes may require a restart");
+	auto& appearanceButton = m_settingsMenu->CreateWidget<MenuList>("Appearance");
+	appearanceButton.CreateWidget<Texts::Text>("Some themes may require a restart");
 
-	auto& colorTheme = themeButton.CreateWidget<Selection::ComboBox>(static_cast<int>(Settings::EditorSettings::ColorTheme.Get()));
+	auto& colorTheme = appearanceButton.CreateWidget<Selection::ComboBox>(static_cast<int>(Settings::EditorSettings::ColorTheme.Get()));
 	colorTheme.choices = {
 		{ static_cast<int>(OvUI::Styling::EStyle::IM_CLASSIC_STYLE), "ImGui Classic"},
 		{ static_cast<int>(OvUI::Styling::EStyle::IM_DARK_STYLE), "ImGui Dark"},
@@ -92,17 +94,16 @@ void OvEditor::Panels::MenuBar::InitializeSettingsMenu()
 		EDITOR_CONTEXT(uiManager)->ApplyStyle(static_cast<OvUI::Styling::EStyle>(p_value));
 	};
 
-	auto& fontSizeMenu = m_settingsMenu->CreateWidget<MenuList>("Font Size");
-	auto& fontSizeSelector = fontSizeMenu.CreateWidget<Selection::ComboBox>(static_cast<int>(Settings::EditorSettings::FontSize.Get()));
-	fontSizeSelector.choices = {
-		{ static_cast<int>(Settings::EFontSize::SMALL), "Small"},
-		{ static_cast<int>(Settings::EFontSize::MEDIUM), "Medium"},
-		{ static_cast<int>(Settings::EFontSize::BIG), "Big"}
+	auto& uiScale = appearanceButton.CreateWidget<Selection::ComboBox>(static_cast<int>(Settings::EditorSettings::UIScale.Get()));
+	uiScale.choices = {
+		{ 0, "[BETA] Automatic (DPI Aware)"},
+		{ 100, "100%"},
+		{ 150, "150%"},
+		{ 200, "200%"},
 	};
-	fontSizeSelector.ValueChangedEvent += [this](int p_value) {
-		Settings::EditorSettings::FontSize = p_value;
-		const auto fontID = std::string{ Settings::GetFontID(static_cast<Settings::EFontSize>(p_value)) };
-		EDITOR_CONTEXT(uiManager)->UseFont(fontID);
+	uiScale.ValueChangedEvent += [this](int p_value) {
+		Settings::EditorSettings::UIScale = p_value;
+		EDITOR_CONTEXT(uiManager)->SetScale(p_value == 0 ? std::nullopt : std::make_optional(p_value / 100.0f));
 	};
 
 	m_settingsMenu->CreateWidget<MenuItem>("Spawn actors at origin", "", true, true).ValueChangedEvent += EDITOR_BIND(SetActorSpawnAtOrigin, std::placeholders::_1);
@@ -204,7 +205,6 @@ void OvEditor::Panels::MenuBar::InitializeSettingsMenu()
 	{
 		Settings::EditorSettings::CodeEditorCommand = p_value;
 	};
-
 }
 
 void OvEditor::Panels::MenuBar::CreateFileMenu()