Refactor editor dock and panel chrome styling

editor/src/UI/Core.h

@@ -1,11 +1,30 @@
 #pragma once
 
+#include "StyleTokens.h"
+
 #include <imgui.h>
 
 namespace XCEngine {
 namespace Editor {
 namespace UI {
 
+inline float DefaultControlLabelWidth() {
+    return 104.0f;
+}
+
+inline ImVec2 DefaultControlCellPadding() {
+    return ImVec2(0.0f, 2.0f);
+}
+
+inline ImVec2 DefaultControlFramePadding() {
+    return ImVec2(6.0f, 3.0f);
+}
+
+inline void PushControlRowStyles() {
+    ImGui::PushStyleVar(ImGuiStyleVar_CellPadding, DefaultControlCellPadding());
+    ImGui::PushStyleVar(ImGuiStyleVar_FramePadding, DefaultControlFramePadding());
+}
+
 inline void StyleVarPush(ImGuiStyleVar idx, float val) {
     ImGui::PushStyleVar(idx, val);
 }
@@ -56,6 +75,26 @@ inline void EndDisabled(bool disabled = true) {
     }
 }
 
+inline void DrawCurrentWindowBottomBorder(ImU32 color = PanelDividerColor()) {
+    ImDrawList* drawList = ImGui::GetWindowDrawList();
+    const ImVec2 min = ImGui::GetWindowPos();
+    const ImVec2 max = ImVec2(min.x + ImGui::GetWindowSize().x, min.y + ImGui::GetWindowSize().y);
+    drawList->AddLine(ImVec2(min.x, max.y - 1.0f), ImVec2(max.x, max.y - 1.0f), color);
+}
+
+inline bool ToolbarButton(const char* label, bool active = false, ImVec2 size = ImVec2(0.0f, 0.0f)) {
+    const ImVec4 buttonColor = ToolbarButtonColor(active);
+    const ImVec4 hoverColor = ToolbarButtonHoveredColor(active);
+    const ImVec4 activeColor = ToolbarButtonActiveColor();
+
+    ImGui::PushStyleColor(ImGuiCol_Button, buttonColor);
+    ImGui::PushStyleColor(ImGuiCol_ButtonHovered, hoverColor);
+    ImGui::PushStyleColor(ImGuiCol_ButtonActive, activeColor);
+    const bool pressed = ImGui::Button(label, size);
+    ImGui::PopStyleColor(3);
+    return pressed;
+}
+
 }
 }
 }

editor/src/UI/DockHostStyle.h

@@ -0,0 +1,40 @@
+#pragma once
+
+#include "StyleTokens.h"
+
+#include <imgui.h>
+
+namespace XCEngine {
+namespace Editor {
+namespace UI {
+
+class DockHostStyleScope {
+public:
+    DockHostStyleScope() {
+        ImGui::PushStyleVar(ImGuiStyleVar_FramePadding, DockHostFramePadding());
+        ImGui::PushStyleVar(ImGuiStyleVar_ItemInnerSpacing, DockHostItemInnerSpacing());
+        ImGui::PushStyleVar(ImGuiStyleVar_WindowBorderSize, DockHostWindowBorderSize());
+        ImGui::PushStyleVar(ImGuiStyleVar_TabBarBorderSize, DockHostTabBarBorderSize());
+        ImGui::PushStyleVar(ImGuiStyleVar_TabBarOverlineSize, DockHostTabBarOverlineSize());
+
+        ImGui::PushStyleColor(ImGuiCol_Tab, DockTabColor());
+        ImGui::PushStyleColor(ImGuiCol_TabHovered, DockTabHoveredColor());
+        ImGui::PushStyleColor(ImGuiCol_TabSelected, DockTabSelectedColor());
+        ImGui::PushStyleColor(ImGuiCol_TabSelectedOverline, DockTabSelectedOverlineColor());
+        ImGui::PushStyleColor(ImGuiCol_TabDimmed, DockTabDimmedColor());
+        ImGui::PushStyleColor(ImGuiCol_TabDimmedSelected, DockTabDimmedSelectedColor());
+        ImGui::PushStyleColor(ImGuiCol_TabDimmedSelectedOverline, DockTabDimmedSelectedOverlineColor());
+    }
+
+    ~DockHostStyleScope() {
+        ImGui::PopStyleColor(7);
+        ImGui::PopStyleVar(5);
+    }
+
+    DockHostStyleScope(const DockHostStyleScope&) = delete;
+    DockHostStyleScope& operator=(const DockHostStyleScope&) = delete;
+};
+
+}
+}
+}

editor/src/UI/PanelChrome.h

@@ -0,0 +1,120 @@
+#pragma once
+
+#include "Core.h"
+#include "StyleTokens.h"
+
+#include <imgui.h>
+
+namespace XCEngine {
+namespace Editor {
+namespace UI {
+
+class PanelWindowScope {
+public:
+    explicit PanelWindowScope(const char* name, ImGuiWindowFlags flags = ImGuiWindowFlags_None) {
+        ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, PanelWindowPadding());
+        m_open = ImGui::Begin(name, nullptr, flags);
+        ImGui::PopStyleVar();
+        m_began = true;
+    }
+
+    ~PanelWindowScope() {
+        if (m_began) {
+            ImGui::End();
+        }
+    }
+
+    PanelWindowScope(const PanelWindowScope&) = delete;
+    PanelWindowScope& operator=(const PanelWindowScope&) = delete;
+
+    bool IsOpen() const {
+        return m_open;
+    }
+
+private:
+    bool m_began = false;
+    bool m_open = false;
+};
+
+class PanelToolbarScope {
+public:
+    explicit PanelToolbarScope(
+        const char* id,
+        float height,
+        ImGuiWindowFlags flags = ImGuiWindowFlags_NoScrollbar | ImGuiWindowFlags_NoScrollWithMouse,
+        bool drawBottomBorder = true,
+        ImVec2 padding = ToolbarPadding(),
+        ImVec2 itemSpacing = ToolbarItemSpacing())
+        : m_drawBottomBorder(drawBottomBorder) {
+        ImGui::PushStyleColor(ImGuiCol_ChildBg, ToolbarBackgroundColor());
+        ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, padding);
+        ImGui::PushStyleVar(ImGuiStyleVar_ItemSpacing, itemSpacing);
+        m_open = ImGui::BeginChild(id, ImVec2(0.0f, height), false, flags);
+        m_began = true;
+    }
+
+    ~PanelToolbarScope() {
+        if (m_began) {
+            if (m_drawBottomBorder) {
+                DrawCurrentWindowBottomBorder();
+            }
+            ImGui::EndChild();
+            ImGui::PopStyleVar(2);
+            ImGui::PopStyleColor();
+        }
+    }
+
+    PanelToolbarScope(const PanelToolbarScope&) = delete;
+    PanelToolbarScope& operator=(const PanelToolbarScope&) = delete;
+
+    bool IsOpen() const {
+        return m_open;
+    }
+
+private:
+    bool m_began = false;
+    bool m_open = false;
+    bool m_drawBottomBorder = true;
+};
+
+class PanelContentScope {
+public:
+    explicit PanelContentScope(
+        const char* id,
+        ImVec2 padding = DefaultPanelContentPadding(),
+        ImGuiWindowFlags flags = ImGuiWindowFlags_None,
+        bool pushItemSpacing = false,
+        ImVec2 itemSpacing = ImVec2(0.0f, 0.0f)) {
+        ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, padding);
+        m_styleVarCount = 1;
+        if (pushItemSpacing) {
+            ImGui::PushStyleVar(ImGuiStyleVar_ItemSpacing, itemSpacing);
+            ++m_styleVarCount;
+        }
+        m_open = ImGui::BeginChild(id, ImVec2(0.0f, 0.0f), false, flags);
+        m_began = true;
+    }
+
+    ~PanelContentScope() {
+        if (m_began) {
+            ImGui::EndChild();
+            ImGui::PopStyleVar(m_styleVarCount);
+        }
+    }
+
+    PanelContentScope(const PanelContentScope&) = delete;
+    PanelContentScope& operator=(const PanelContentScope&) = delete;
+
+    bool IsOpen() const {
+        return m_open;
+    }
+
+private:
+    bool m_began = false;
+    bool m_open = false;
+    int m_styleVarCount = 0;
+};
+
+}
+}
+}

editor/src/UI/StyleTokens.h

@@ -0,0 +1,103 @@
+#pragma once
+
+#include <imgui.h>
+
+namespace XCEngine {
+namespace Editor {
+namespace UI {
+
+inline ImVec2 DockHostFramePadding() {
+    return ImVec2(4.0f, 2.0f);
+}
+
+inline ImVec2 DockHostItemInnerSpacing() {
+    return ImVec2(0.0f, 4.0f);
+}
+
+inline float DockHostWindowBorderSize() {
+    return 0.0f;
+}
+
+inline float DockHostTabBarBorderSize() {
+    return 0.0f;
+}
+
+inline float DockHostTabBarOverlineSize() {
+    return 0.0f;
+}
+
+inline ImVec4 DockTabColor() {
+    return ImVec4(0.17f, 0.17f, 0.17f, 1.00f);
+}
+
+inline ImVec4 DockTabHoveredColor() {
+    return ImVec4(0.21f, 0.21f, 0.21f, 1.00f);
+}
+
+inline ImVec4 DockTabSelectedColor() {
+    return ImVec4(0.24f, 0.24f, 0.24f, 1.00f);
+}
+
+inline ImVec4 DockTabSelectedOverlineColor() {
+    return ImVec4(0.62f, 0.62f, 0.62f, 0.70f);
+}
+
+inline ImVec4 DockTabDimmedColor() {
+    return ImVec4(0.16f, 0.16f, 0.16f, 1.00f);
+}
+
+inline ImVec4 DockTabDimmedSelectedColor() {
+    return ImVec4(0.20f, 0.20f, 0.20f, 1.00f);
+}
+
+inline ImVec4 DockTabDimmedSelectedOverlineColor() {
+    return ImVec4(0.44f, 0.44f, 0.44f, 0.55f);
+}
+
+inline ImVec2 PanelWindowPadding() {
+    return ImVec2(0.0f, 0.0f);
+}
+
+inline ImVec2 ToolbarPadding() {
+    return ImVec2(8.0f, 6.0f);
+}
+
+inline ImVec2 ToolbarItemSpacing() {
+    return ImVec2(6.0f, 6.0f);
+}
+
+inline ImVec2 DefaultPanelContentPadding() {
+    return ImVec2(8.0f, 6.0f);
+}
+
+inline ImVec2 InspectorPanelContentPadding() {
+    return ImVec2(10.0f, 0.0f);
+}
+
+inline ImVec2 AssetPanelContentPadding() {
+    return ImVec2(10.0f, 10.0f);
+}
+
+inline ImVec4 ToolbarBackgroundColor() {
+    return ImVec4(0.19f, 0.19f, 0.19f, 1.0f);
+}
+
+inline ImU32 PanelDividerColor() {
+    return IM_COL32(36, 36, 36, 255);
+}
+
+inline ImVec4 ToolbarButtonColor(bool active) {
+    return active ? ImVec4(0.33f, 0.33f, 0.33f, 1.0f) : ImVec4(0.24f, 0.24f, 0.24f, 1.0f);
+}
+
+inline ImVec4 ToolbarButtonHoveredColor(bool active) {
+    return active ? ImVec4(0.38f, 0.38f, 0.38f, 1.0f) : ImVec4(0.30f, 0.30f, 0.30f, 1.0f);
+}
+
+inline ImVec4 ToolbarButtonActiveColor() {
+    return ImVec4(0.42f, 0.42f, 0.42f, 1.0f);
+}
+
+}
+}
+}

editor/src/UI/UI.h

@@ -1,6 +1,9 @@
 #pragma once
 
 #include "Core.h"
+#include "DockHostStyle.h"
+#include "PanelChrome.h"
+#include "StyleTokens.h"
 #include "VectorControls.h"
 #include "ScalarControls.h"