refactor(editor): enhance sidebar UI and card registration in SettingsEditor
- Updated the sidebar UI in EditorCardRegistry to improve visibility and theming consistency using ThemeManager. - Refactored SettingsEditor to register multiple settings cards, enhancing modularity and organization of settings. - Improved the layout and interaction of category tabs, ensuring a more intuitive user experience. Benefits: - Streamlines the settings management process, leading to a more organized and efficient user interface. - Enhances maintainability by clearly defining card registration and visibility logic within the editor framework.
This commit is contained in:
@@ -478,44 +478,88 @@ void EditorCardRegistry::DrawSidebar(size_t session_id,
|
||||
return;
|
||||
}
|
||||
|
||||
// Sidebar window
|
||||
ImGui::SetNextWindowSize(ImVec2(GetSidebarWidth() + 220, 0), ImGuiCond_Always);
|
||||
ImGui::SetNextWindowPos(ImVec2(0, ImGui::GetFrameHeightWithSpacing()), ImGuiCond_Always);
|
||||
// Use ThemeManager for consistent theming
|
||||
const auto& theme = gui::ThemeManager::Get().GetCurrentTheme();
|
||||
const float sidebar_width = GetSidebarWidth();
|
||||
|
||||
ImGui::Begin("##CardSidebar", nullptr,
|
||||
ImGuiWindowFlags_NoTitleBar | ImGuiWindowFlags_NoResize |
|
||||
ImGuiWindowFlags_NoMove | ImGuiWindowFlags_NoCollapse);
|
||||
// Fixed sidebar window on the left edge of screen (VSCode style)
|
||||
ImGui::SetNextWindowPos(ImVec2(0, ImGui::GetFrameHeight())); // Below menu bar
|
||||
ImGui::SetNextWindowSize(ImVec2(sidebar_width + 220, -1)); // Full height below menu
|
||||
|
||||
// Draw category tabs on the left
|
||||
ImGui::BeginChild("CategoryTabs", ImVec2(GetSidebarWidth(), 0), true);
|
||||
ImGuiWindowFlags sidebar_flags =
|
||||
ImGuiWindowFlags_NoTitleBar |
|
||||
ImGuiWindowFlags_NoResize |
|
||||
ImGuiWindowFlags_NoMove |
|
||||
ImGuiWindowFlags_NoCollapse |
|
||||
ImGuiWindowFlags_NoDocking | // Don't allow docking over sidebar
|
||||
ImGuiWindowFlags_NoScrollbar |
|
||||
ImGuiWindowFlags_NoScrollWithMouse |
|
||||
ImGuiWindowFlags_NoFocusOnAppearing | // Don't steal focus
|
||||
ImGuiWindowFlags_NoNavFocus; // Don't participate in nav
|
||||
|
||||
for (const auto& cat : active_categories) {
|
||||
bool is_active = (cat == category);
|
||||
if (is_active) {
|
||||
ImGui::PushStyleColor(ImGuiCol_Button, gui::GetPrimaryVec4());
|
||||
}
|
||||
// Make sidebar VERY visible - fully opaque dark background
|
||||
ImVec4 sidebar_bg = ImVec4(0.18f, 0.18f, 0.20f, 1.0f); // Dark opaque gray
|
||||
ImVec4 sidebar_border = ImVec4(0.4f, 0.4f, 0.45f, 1.0f); // Visible border
|
||||
|
||||
ImGui::PushStyleColor(ImGuiCol_WindowBg, sidebar_bg);
|
||||
ImGui::PushStyleColor(ImGuiCol_Border, sidebar_border);
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(4.0f, 8.0f));
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_ItemSpacing, ImVec2(0.0f, 6.0f));
|
||||
ImGui::PushStyleVar(ImGuiStyleVar_WindowBorderSize, 2.0f); // Thicker border
|
||||
|
||||
ImGui::Begin("##EditorCardSidebar", nullptr, sidebar_flags);
|
||||
|
||||
// Draw category tabs on the left (if multiple editors active)
|
||||
if (active_categories.size() > 1) {
|
||||
ImGui::BeginChild("CategoryTabs", ImVec2(sidebar_width, 0), false,
|
||||
ImGuiWindowFlags_NoScrollbar);
|
||||
|
||||
if (ImGui::Button(cat.substr(0, 1).c_str(), ImVec2(GetSidebarWidth() - 8, 40))) {
|
||||
if (on_category_switch) {
|
||||
on_category_switch(cat);
|
||||
ImVec4 accent = gui::ConvertColorToImVec4(theme.accent);
|
||||
ImVec4 inactive = gui::ConvertColorToImVec4(theme.button);
|
||||
|
||||
for (const auto& cat : active_categories) {
|
||||
bool is_current = (cat == category);
|
||||
|
||||
if (is_current) {
|
||||
ImGui::PushStyleColor(ImGuiCol_Button, ImVec4(accent.x, accent.y, accent.z, 0.8f));
|
||||
ImGui::PushStyleColor(ImGuiCol_ButtonHovered, ImVec4(accent.x, accent.y, accent.z, 1.0f));
|
||||
} else {
|
||||
ImGui::PushStyleColor(ImGuiCol_Button, inactive);
|
||||
ImGui::PushStyleColor(ImGuiCol_ButtonHovered, gui::ConvertColorToImVec4(theme.button_hovered));
|
||||
}
|
||||
|
||||
// Use first letter as icon
|
||||
std::string icon = cat.substr(0, 1);
|
||||
if (ImGui::Button(icon.c_str(), ImVec2(sidebar_width - 8, 40))) {
|
||||
if (on_category_switch) {
|
||||
on_category_switch(cat);
|
||||
}
|
||||
}
|
||||
|
||||
ImGui::PopStyleColor(2);
|
||||
|
||||
if (ImGui::IsItemHovered()) {
|
||||
ImGui::SetTooltip("%s", cat.c_str());
|
||||
}
|
||||
}
|
||||
|
||||
if (is_active) {
|
||||
ImGui::PopStyleColor();
|
||||
// Collapse button at bottom
|
||||
ImGui::SetCursorPosY(ImGui::GetWindowHeight() - 50);
|
||||
if (ImGui::Button(ICON_MD_CHEVRON_LEFT, ImVec2(sidebar_width - 8, 40))) {
|
||||
if (on_collapse) {
|
||||
on_collapse();
|
||||
}
|
||||
}
|
||||
if (ImGui::IsItemHovered()) {
|
||||
ImGui::SetTooltip("Hide Sidebar (Ctrl+B)");
|
||||
}
|
||||
|
||||
if (ImGui::IsItemHovered()) {
|
||||
ImGui::SetTooltip("%s", cat.c_str());
|
||||
}
|
||||
ImGui::EndChild();
|
||||
ImGui::SameLine();
|
||||
}
|
||||
|
||||
ImGui::EndChild();
|
||||
|
||||
ImGui::SameLine();
|
||||
|
||||
// Draw cards on the right
|
||||
ImGui::BeginChild("Cards", ImVec2(0, 0), true);
|
||||
// Draw cards list on the right
|
||||
ImGui::BeginChild("CardsList", ImVec2(0, 0), false);
|
||||
|
||||
ImGui::Text("%s %s", ICON_MD_DASHBOARD, category.c_str());
|
||||
ImGui::Separator();
|
||||
@@ -527,6 +571,9 @@ void EditorCardRegistry::DrawSidebar(size_t session_id,
|
||||
ImGui::EndChild();
|
||||
|
||||
ImGui::End();
|
||||
|
||||
ImGui::PopStyleVar(3);
|
||||
ImGui::PopStyleColor(2);
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
|
||||
@@ -52,8 +52,8 @@ const std::unordered_map<EditorType, bool> EditorRegistry::kCardBasedEditors = {
|
||||
{EditorType::kAssembly, true},
|
||||
{EditorType::kEmulator, true},
|
||||
{EditorType::kHex, true},
|
||||
{EditorType::kAgent, true},
|
||||
{EditorType::kSettings, true}
|
||||
{EditorType::kAgent, false}, // Agent: Traditional UI
|
||||
{EditorType::kSettings, true} // Settings: Now card-based for better organization
|
||||
};
|
||||
|
||||
bool EditorRegistry::IsCardBasedEditor(EditorType type) {
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
|
||||
#include "app/editor/system/settings_editor.h"
|
||||
|
||||
#include "absl/status/status.h"
|
||||
#include "app/editor/system/editor_card_registry.h"
|
||||
#include "app/gui/app/editor_layout.h"
|
||||
#include "app/gui/app/feature_flags_menu.h"
|
||||
#include "app/gfx/debug/performance/performance_profiler.h"
|
||||
#include "app/gui/core/style.h"
|
||||
@@ -26,7 +27,62 @@ using ImGui::TableHeadersRow;
|
||||
using ImGui::TableNextColumn;
|
||||
using ImGui::TableSetupColumn;
|
||||
|
||||
void SettingsEditor::Initialize() {}
|
||||
void SettingsEditor::Initialize() {
|
||||
// Register cards with EditorCardRegistry (dependency injection)
|
||||
if (!dependencies_.card_registry) return;
|
||||
auto* card_registry = dependencies_.card_registry;
|
||||
|
||||
card_registry->RegisterCard({
|
||||
.card_id = MakeCardId("settings.general"),
|
||||
.display_name = "General Settings",
|
||||
.icon = ICON_MD_SETTINGS,
|
||||
.category = "System",
|
||||
.priority = 10
|
||||
});
|
||||
|
||||
card_registry->RegisterCard({
|
||||
.card_id = MakeCardId("settings.appearance"),
|
||||
.display_name = "Appearance",
|
||||
.icon = ICON_MD_PALETTE,
|
||||
.category = "System",
|
||||
.priority = 20
|
||||
});
|
||||
|
||||
card_registry->RegisterCard({
|
||||
.card_id = MakeCardId("settings.editor_behavior"),
|
||||
.display_name = "Editor Behavior",
|
||||
.icon = ICON_MD_TUNE,
|
||||
.category = "System",
|
||||
.priority = 30
|
||||
});
|
||||
|
||||
card_registry->RegisterCard({
|
||||
.card_id = MakeCardId("settings.performance"),
|
||||
.display_name = "Performance",
|
||||
.icon = ICON_MD_SPEED,
|
||||
.category = "System",
|
||||
.priority = 40
|
||||
});
|
||||
|
||||
card_registry->RegisterCard({
|
||||
.card_id = MakeCardId("settings.ai_agent"),
|
||||
.display_name = "AI Agent",
|
||||
.icon = ICON_MD_SMART_TOY,
|
||||
.category = "System",
|
||||
.priority = 50
|
||||
});
|
||||
|
||||
card_registry->RegisterCard({
|
||||
.card_id = MakeCardId("settings.shortcuts"),
|
||||
.display_name = "Keyboard Shortcuts",
|
||||
.icon = ICON_MD_KEYBOARD,
|
||||
.category = "System",
|
||||
.priority = 60
|
||||
});
|
||||
|
||||
// Show general settings by default
|
||||
card_registry->ShowCard(MakeCardId("settings.general"));
|
||||
}
|
||||
|
||||
absl::Status SettingsEditor::Load() {
|
||||
gfx::ScopedTimer timer("SettingsEditor::Load");
|
||||
@@ -34,36 +90,69 @@ absl::Status SettingsEditor::Load() {
|
||||
}
|
||||
|
||||
absl::Status SettingsEditor::Update() {
|
||||
if (BeginTabBar("Settings", ImGuiTabBarFlags_None)) {
|
||||
if (BeginTabItem(ICON_MD_SETTINGS " General")) {
|
||||
if (!dependencies_.card_registry) return absl::OkStatus();
|
||||
auto* card_registry = dependencies_.card_registry;
|
||||
|
||||
// General Settings Card
|
||||
if (card_registry->IsCardVisible(MakeCardId("settings.general"))) {
|
||||
static gui::EditorCard general_card("General Settings", ICON_MD_SETTINGS);
|
||||
general_card.SetDefaultSize(600, 500);
|
||||
if (general_card.Begin()) {
|
||||
DrawGeneralSettings();
|
||||
EndTabItem();
|
||||
}
|
||||
if (BeginTabItem(ICON_MD_FONT_DOWNLOAD " Font Manager")) {
|
||||
gui::DrawFontManager();
|
||||
EndTabItem();
|
||||
}
|
||||
if (BeginTabItem(ICON_MD_KEYBOARD " Keyboard Shortcuts")) {
|
||||
DrawKeyboardShortcuts();
|
||||
EndTabItem();
|
||||
}
|
||||
if (BeginTabItem(ICON_MD_PALETTE " Themes")) {
|
||||
general_card.End();
|
||||
}
|
||||
|
||||
// Appearance Card (Themes + Font Manager combined)
|
||||
if (card_registry->IsCardVisible(MakeCardId("settings.appearance"))) {
|
||||
static gui::EditorCard appearance_card("Appearance", ICON_MD_PALETTE);
|
||||
appearance_card.SetDefaultSize(600, 600);
|
||||
if (appearance_card.Begin()) {
|
||||
DrawThemeSettings();
|
||||
EndTabItem();
|
||||
ImGui::Separator();
|
||||
gui::DrawFontManager();
|
||||
}
|
||||
if (BeginTabItem(ICON_MD_TUNE " Editor Behavior")) {
|
||||
appearance_card.End();
|
||||
}
|
||||
|
||||
// Editor Behavior Card
|
||||
if (card_registry->IsCardVisible(MakeCardId("settings.editor_behavior"))) {
|
||||
static gui::EditorCard behavior_card("Editor Behavior", ICON_MD_TUNE);
|
||||
behavior_card.SetDefaultSize(600, 500);
|
||||
if (behavior_card.Begin()) {
|
||||
DrawEditorBehavior();
|
||||
EndTabItem();
|
||||
}
|
||||
if (BeginTabItem(ICON_MD_SPEED " Performance")) {
|
||||
behavior_card.End();
|
||||
}
|
||||
|
||||
// Performance Card
|
||||
if (card_registry->IsCardVisible(MakeCardId("settings.performance"))) {
|
||||
static gui::EditorCard perf_card("Performance", ICON_MD_SPEED);
|
||||
perf_card.SetDefaultSize(600, 450);
|
||||
if (perf_card.Begin()) {
|
||||
DrawPerformanceSettings();
|
||||
EndTabItem();
|
||||
}
|
||||
if (BeginTabItem(ICON_MD_SMART_TOY " AI Agent")) {
|
||||
perf_card.End();
|
||||
}
|
||||
|
||||
// AI Agent Settings Card
|
||||
if (card_registry->IsCardVisible(MakeCardId("settings.ai_agent"))) {
|
||||
static gui::EditorCard ai_card("AI Agent", ICON_MD_SMART_TOY);
|
||||
ai_card.SetDefaultSize(600, 550);
|
||||
if (ai_card.Begin()) {
|
||||
DrawAIAgentSettings();
|
||||
EndTabItem();
|
||||
}
|
||||
EndTabBar();
|
||||
ai_card.End();
|
||||
}
|
||||
|
||||
// Keyboard Shortcuts Card
|
||||
if (card_registry->IsCardVisible(MakeCardId("settings.shortcuts"))) {
|
||||
static gui::EditorCard shortcuts_card("Keyboard Shortcuts", ICON_MD_KEYBOARD);
|
||||
shortcuts_card.SetDefaultSize(700, 600);
|
||||
if (shortcuts_card.Begin()) {
|
||||
DrawKeyboardShortcuts();
|
||||
}
|
||||
shortcuts_card.End();
|
||||
}
|
||||
|
||||
return absl::OkStatus();
|
||||
|
||||
@@ -102,21 +102,17 @@ UICoordinator::UICoordinator(
|
||||
|
||||
void UICoordinator::DrawAllUI() {
|
||||
// Note: Theme styling is applied by ThemeManager, not here
|
||||
// This is called from EditorManager::Update() - don't call menu bar stuff here
|
||||
|
||||
// Draw all UI components in order
|
||||
DrawMenuBarExtras();
|
||||
DrawContextSensitiveCardControl();
|
||||
DrawCommandPalette(); // NEW: Moved from EditorManager
|
||||
DrawSessionSwitcher();
|
||||
DrawSessionManager();
|
||||
DrawSessionRenameDialog();
|
||||
DrawLayoutPresets();
|
||||
DrawWelcomeScreen();
|
||||
DrawProjectHelp();
|
||||
DrawWindowManagementUI();
|
||||
|
||||
// Draw all popups
|
||||
DrawAllPopups();
|
||||
// Draw UI windows and dialogs
|
||||
DrawCommandPalette(); // Ctrl+Shift+P
|
||||
DrawSessionSwitcher(); // Ctrl+Tab popup
|
||||
DrawSessionManager(); // Session management window
|
||||
DrawSessionRenameDialog(); // Rename popup
|
||||
DrawLayoutPresets(); // Layout preset dialogs
|
||||
DrawWelcomeScreen(); // Welcome screen
|
||||
DrawProjectHelp(); // Project help
|
||||
DrawWindowManagementUI(); // Window management
|
||||
}
|
||||
|
||||
void UICoordinator::DrawMenuBarExtras() {
|
||||
|
||||
Reference in New Issue
Block a user