Initial commit of WQ_GUI

IMAGE_CONFIG.md

@@ -0,0 +1,186 @@
+# Logo和横幅图像配置说明
+
+## 功能概述
+
+本更新实现了以下需求：
+1. **Logo在菜单栏左侧** - 和菜单栏在**同一行**
+2. **菜单栏在最右侧** - 使用弹性空间布局
+3. **横幅图片撑满整个区域** - 自适应窗口宽度
+
+## 布局说明
+
+```
+┌─────────────────────────────────────┐
+│ [Logo]          文件 工具 帮助      │  ← 同一行：Logo在左，菜单在右
+├─────────────────────────────────────┤
+│      [软件名称横幅图 - 撑满宽度]    │  ← 横幅撑满整个区域
+├─────────────────────────────────────┤
+│                                      │
+│         主要内容区                   │
+│                                      │
+```
+
+## 配置步骤
+
+### 1. 准备图像文件
+
+将你的图像文件放在项目目录中。建议的目录结构：
+
+```
+fengzhuang-ui2/
+├── assets/                    # 推荐：创建资源目录
+│   ├── logo.png             # 公司logo (建议高度30像素)
+│   └── banner.png           # 软件名称横幅 (建议高度70像素)
+├── src/
+│   └── gui/
+│       └── water_quality_gui.py
+└── ...
+```
+
+### 2. 修改图像路径
+
+打开 `src/gui/water_quality_gui.py` 文件，找到以下两处代码：
+
+#### Logo路径修改（create_logo_bar 方法中，第3928行左右）
+
+```python
+# 修改前：
+logo_path = "path/to/your/logo.png"
+
+# 修改后（使用相对路径）：
+logo_path = "assets/logo.png"
+
+# 或使用绝对路径：
+logo_path = r"E:\your\full\path\to\logo.png"
+```
+
+#### 横幅路径修改（create_banner_widget 方法中，第3978行左右）
+
+```python
+# 修改前：
+banner_path = "path/to/your/banner.png"
+
+# 修改后（使用相对路径）：
+banner_path = "assets/banner.png"
+
+# 或使用绝对路径：
+banner_path = r"E:\your\full\path\to\banner.png"
+```
+
+### 3. 图像规格建议
+
+| 名称 | 建议尺寸 | 格式 | 说明 |
+|-----|--------|------|------|
+| Logo | 高度30像素 | PNG/JPG | 放在顶部Logo栏中，自动按高度缩放保持宽高比 |
+| 横幅 | 高度70像素 | PNG/JPG | 占据横幅区域，自动按高度缩放保持宽高比 |
+
+### 4. 图像加载失败处理
+
+如果图像文件未找到或加载失败，系统会自动显示占位符：
+
+- **Logo占位符**: 显示"Logo"文本，背景为浅灰色
+- **横幅占位符**: 显示"软件名称横幅"文本，背景为蓝色，字体为24号加粗
+
+### 5. 自适应缩放说明
+
+为了避免图像拉伸，代码使用了 `scaledToHeight()` 方法：
+- Logo按高度30像素缩放，自动计算宽度，保持原始宽高比
+- 横幅按高度70像素缩放，自动计算宽度，保持原始宽高比
+
+这样可以确保无论原始图像大小如何，都能自然地显示而不会出现拉伸变形。
+
+## 常见问题
+
+### Q: 如何使用项目内的图像资源？
+
+**A**: 在项目中创建 `assets` 或 `resources` 文件夹，并使用相对路径：
+
+```python
+# 假设项目结构：
+# fengzhuang-ui2/
+#   ├── assets/
+#   │   ├── logo.png
+#   │   └── banner.png
+#   └── src/gui/water_quality_gui.py
+
+# 在 water_quality_gui.py 中（第3928行）：
+logo_path = "assets/logo.png"
+
+# 在 water_quality_gui.py 中（第3978行）：
+banner_path = "assets/banner.png"
+```
+
+### Q: Logo或横幅大小不合适？
+
+**A**: 修改以下代码调整显示大小：
+
+```python
+# 在 create_logo_bar() 方法中调整Logo大小
+logo_label.setFixedSize(60, 40)  # 改为 60×40
+
+# 在 create_banner_widget() 方法中调整横幅大小
+banner_label.setMaximumHeight(100)  # 改为100像素高
+banner_label.setMinimumHeight(80)   # 改为最小80像素高
+
+# 调整缩放高度
+scaled_pixmap = logo_pixmap.scaledToHeight(35, Qt.SmoothTransformation)  # 改为35
+scaled_pixmap = banner_pixmap.scaledToHeight(85, Qt.SmoothTransformation)  # 改为85
+```
+
+### Q: 如何隐藏Logo或横幅？
+
+**A**: 在 `init_ui()` 方法中注释掉相应的创建方法：
+
+```python
+# 在 init_ui() 中
+# self.create_logo_bar()          # 注释此行隐藏Logo
+# self.create_banner_widget()     # 注释此行隐藏横幅
+```
+
+### Q: Logo显示位置不对？
+
+**A**: Logo栏是作为独立的工具栏添加在菜单栏下方，不是在菜单栏内。当前的布局顺序是：
+1. 菜单栏 (最上方)
+2. Logo栏 (菜单栏下方)
+3. 横幅区域 (Logo栏下方)
+4. 主内容区域 (最下方)
+
+### Q: 图像在高分辨率屏幕上看起来模糊？
+
+**A**: 使用 `Qt.SmoothTransformation` 可以改善图像质量。如果仍然不够清晰，可以准备高分辨率的原始图像。
+
+## 代码位置
+
+- **Logo栏创建**: `create_logo_bar()` 方法 (第3902行)
+- **横幅区域创建**: `create_banner_widget()` 方法 (第3950行)
+- **主UI初始化**: `init_ui()` 方法 (第3821行)
+
+## 支持的图像格式
+
+- PNG (推荐，支持透明背景)
+- JPG/JPEG
+- BMP
+- GIF
+- TIFF
+
+## 样式调整
+
+如需修改样式（背景色、边框等），编辑以下位置的 `setStyleSheet()` 调用：
+
+```python
+# Logo样式（第3907-3916行）
+logo_toolbar.setStyleSheet("""...""")
+
+# 占位符样式（第3931行）
+logo_label.setStyleSheet("...")
+
+# 横幅占位符样式（第3959-3965行）
+banner_label.setStyleSheet("""...""")
+```
+
+## 更新日期
+2026-03-27
+
+## 备注
+
+所有的图像路径都可以根据你的实际项目结构灵活调整。建议将图像文件与代码一起版本控制，以确保项目的可维护性。