From 6ec2a804ba0271b70db6e425695f055a3a3a4903 Mon Sep 17 00:00:00 2001
From: jackqqq123 <1175861874@qq.com>
Date: Wed, 24 Sep 2025 03:14:25 +0800
Subject: [PATCH] =?UTF-8?q?=E7=AC=AC=E4=B8=80=E7=89=88=E9=A1=B5=E9=9D=A2?=
=?UTF-8?q?=E8=AE=BE=E8=AE=A1=EF=BC=9B=E5=AE=9E=E7=8E=B0=E4=B8=BB=E9=A2=98?=
=?UTF-8?q?=E5=88=87=E6=8D=A2=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.github/instructions/prompt.instructions.md | 61 ++++-
design/页面设计.md | 17 ++
src/LubanHub.App/App.axaml | 3 +
src/LubanHub.App/App.axaml.cs | 34 ++-
src/LubanHub.App/MainWindow.axaml | 260 +++++++++++++++++++-
src/LubanHub.App/MainWindow.axaml.cs | 122 +++++++++
src/LubanHub.App/Program.cs | 21 +-
src/LubanHub.App/Services/ThemeManager.cs | 71 ++++++
src/LubanHub.App/Themes/DarkTheme.axaml | 72 ++++++
src/LubanHub.App/Themes/LightTheme.axaml | 72 ++++++
src/LubanHub.App/Themes/Styles.axaml | 249 +++++++++++++++++++
11 files changed, 971 insertions(+), 11 deletions(-)
create mode 100644 design/页面设计.md
create mode 100644 src/LubanHub.App/Services/ThemeManager.cs
create mode 100644 src/LubanHub.App/Themes/DarkTheme.axaml
create mode 100644 src/LubanHub.App/Themes/LightTheme.axaml
create mode 100644 src/LubanHub.App/Themes/Styles.axaml
diff --git a/.github/instructions/prompt.instructions.md b/.github/instructions/prompt.instructions.md
index 576cbe0..d0b9ea2 100644
--- a/.github/instructions/prompt.instructions.md
+++ b/.github/instructions/prompt.instructions.md
@@ -2,4 +2,63 @@
applyTo: '**'
---
- 说中文
-- 这是一个基于electron的项目管理工程,目标是让非程序员也能轻松使用luban管理配置表。
\ No newline at end of file
+- 这是一个基于Avalonia的项目管理工程,目标是让非程序员也能轻松使用luban管理配置表。
+
+## UI设计规范
+
+### 🎨 主题兼容性
+- **深色模式支持**: 所有UI元素必须在深色主题下清晰可见,具有足够的对比度
+- **浅色模式支持**: 所有UI元素必须在浅色主题下保持良好的可读性和视觉效果
+- **动态主题切换**: 使用DynamicResource绑定,支持运行时主题切换
+- **颜色资源化**: 避免硬编码颜色值,统一使用主题资源字典中的颜色定义
+
+### 🎯 交互状态设计
+- **主要操作按钮**: 使用主题蓝色系,在两种模式下都要突出显示
+- **成功/确认状态**: 使用绿色系,表示积极操作
+- **警告状态**: 使用黄色系,提醒用户注意
+- **错误/删除状态**: 使用红色系,表示危险操作
+- **悬停和按下状态**: 提供清晰的视觉反馈,确保在两种主题下都有足够的对比度
+
+### 📝 文字层级
+- **主要文字**: 使用主题的主要文字颜色,确保最佳可读性
+- **次要文字**: 使用稍浅的颜色,但仍保持良好的可读性
+- **占位符文字**: 使用更浅的颜色,明确区分占位符和实际内容
+- **禁用文字**: 使用最浅的颜色,明确表示不可用状态
+
+### 🔘 圆角规范
+- **按钮圆角**: `4px`
+- **输入框圆角**: `4px`
+- **卡片圆角**: `5px`
+- **列表项圆角**: `3px`
+
+### 📏 间距规范
+- **小间距**: `5px`
+- **标准间距**: `10px`
+- **中等间距**: `15px`
+- **大间距**: `20px`
+- **页面边距**: `20px`
+- **按钮内边距**: 水平`15px` 垂直`8px`
+- **导航按钮内边距**: 水平`20px` 垂直`15px`
+
+### 🎭 动画规范
+- **过渡时间**: `0.2s` (200ms)
+- **缓动函数**: `ease-out`
+- **支持的过渡**: 背景色、前景色、透明度
+
+### 📱 组件规范
+- **导航栏宽度**: `200px`
+- **最小窗口尺寸**: 宽度`1000px` 高度`600px`
+- **设计尺寸**: 宽度`1200px` 高度`800px`
+- **按钮最小高度**: `36px`
+- **输入框最小高度**: `32px`
+
+### 🎪 图标使用
+- 使用Emoji作为图标: 📚📁📦📱⚙️🎮📊🔧🤖➕🔄📂🌐等
+- 图标大小: 导航按钮中正常大小,卡片中`40px`
+
+### 🖱️ 交互反馈
+- 所有可点击元素必须有悬停状态
+- 按钮支持按下状态反馈
+- 输入框支持焦点状态
+- 列表项支持选中和悬停状态
+- 过渡动画让交互更流畅
\ No newline at end of file
diff --git a/design/页面设计.md b/design/页面设计.md
new file mode 100644
index 0000000..4ddfd22
--- /dev/null
+++ b/design/页面设计.md
@@ -0,0 +1,17 @@
+这是我的应用主页设计,
+左侧按钮依次为知识库、项目、安装
+左侧最下方是设置按钮
+
+- 点击知识库右侧内容区:
+ - 左侧,第一行为新建会话,下面是历史会话记录
+ - 右侧,没有内容时显示问答窗口,可以切换AI模型,有内容时显示会话内容
+- 点击项目管理右侧内容区:
+ - 顶部,导入项目、新建项目
+ - 下方,项目列表
+- 点击安装鲁班右侧内容区:
+ - 顶部,添加本地版本,在线安装
+ - 下方,鲁班版本列表
+- 点击设置,右侧内容区:
+ - 下载目录,用于存放下载资源
+ - 主体颜色,亮色、深色跟随系统
+
\ No newline at end of file
diff --git a/src/LubanHub.App/App.axaml b/src/LubanHub.App/App.axaml
index 97d3b23..63c7ce7 100644
--- a/src/LubanHub.App/App.axaml
+++ b/src/LubanHub.App/App.axaml
@@ -6,5 +6,8 @@
+
+
+
\ No newline at end of file
diff --git a/src/LubanHub.App/App.axaml.cs b/src/LubanHub.App/App.axaml.cs
index efdc4da..803b3b9 100644
--- a/src/LubanHub.App/App.axaml.cs
+++ b/src/LubanHub.App/App.axaml.cs
@@ -1,6 +1,7 @@
using Avalonia;
using Avalonia.Controls.ApplicationLifetimes;
using Avalonia.Markup.Xaml;
+using System;
namespace LubanHub.App;
@@ -8,16 +9,39 @@ public partial class App : Application
{
public override void Initialize()
{
- AvaloniaXamlLoader.Load(this);
+ try
+ {
+ Console.WriteLine("正在初始化应用程序...");
+ AvaloniaXamlLoader.Load(this);
+ Console.WriteLine("XAML加载完成。");
+ }
+ catch (Exception ex)
+ {
+ Console.WriteLine($"初始化时发生错误: {ex.Message}");
+ Console.WriteLine($"详细错误信息: {ex}");
+ throw;
+ }
}
public override void OnFrameworkInitializationCompleted()
{
- if (ApplicationLifetime is IClassicDesktopStyleApplicationLifetime desktop)
+ try
{
- desktop.MainWindow = new MainWindow();
- }
+ Console.WriteLine("框架初始化完成,正在创建主窗口...");
+ if (ApplicationLifetime is IClassicDesktopStyleApplicationLifetime desktop)
+ {
+ desktop.MainWindow = new MainWindow();
+ Console.WriteLine("主窗口已创建。");
+ }
- base.OnFrameworkInitializationCompleted();
+ base.OnFrameworkInitializationCompleted();
+ Console.WriteLine("应用程序启动完成。");
+ }
+ catch (Exception ex)
+ {
+ Console.WriteLine($"框架初始化完成时发生错误: {ex.Message}");
+ Console.WriteLine($"详细错误信息: {ex}");
+ throw;
+ }
}
}
\ No newline at end of file
diff --git a/src/LubanHub.App/MainWindow.axaml b/src/LubanHub.App/MainWindow.axaml
index 01f9a23..e3a20f5 100644
--- a/src/LubanHub.App/MainWindow.axaml
+++ b/src/LubanHub.App/MainWindow.axaml
@@ -2,8 +2,262 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
- mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+ mc:Ignorable="d" d:DesignWidth="1200" d:DesignHeight="800"
x:Class="LubanHub.App.MainWindow"
- Title="LubanHub">
- Welcome to Avalonia!
+ Title="LubanHub"
+ MinWidth="1000" MinHeight="600">
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/LubanHub.App/MainWindow.axaml.cs b/src/LubanHub.App/MainWindow.axaml.cs
index 7b77049..0faa8f4 100644
--- a/src/LubanHub.App/MainWindow.axaml.cs
+++ b/src/LubanHub.App/MainWindow.axaml.cs
@@ -1,11 +1,133 @@
using Avalonia.Controls;
+using Avalonia.Interactivity;
+using Avalonia.Controls.Selection;
+using LubanHub.App.Services;
namespace LubanHub.App;
public partial class MainWindow : Window
{
+ private Panel? _contentPanel;
+ private StackPanel? _welcomePanel;
+ private Grid? _knowledgePanel;
+ private Grid? _projectPanel;
+ private Grid? _installPanel;
+ private Grid? _settingsPanel;
+
+ private Button? _knowledgeButton;
+ private Button? _projectButton;
+ private Button? _installButton;
+ private Button? _settingsButton;
+ private ComboBox? _themeComboBox;
+
public MainWindow()
{
InitializeComponent();
+ InitializeComponents();
+
+ // 订阅主题变化事件
+ ThemeManager.ThemeChanged += OnThemeChanged;
+
+ // 初始化主题
+ ThemeManager.Initialize();
+ UpdateThemeComboBox();
+ }
+
+ private void InitializeComponents()
+ {
+ // 获取面板引用
+ _contentPanel = this.FindControl("ContentPanel");
+ _welcomePanel = this.FindControl("WelcomePanel");
+ _knowledgePanel = this.FindControl("KnowledgePanel");
+ _projectPanel = this.FindControl("ProjectPanel");
+ _installPanel = this.FindControl("InstallPanel");
+ _settingsPanel = this.FindControl("SettingsPanel");
+
+ // 获取按钮引用
+ _knowledgeButton = this.FindControl