EnvironmentValueSetter_Preview.md

环境数值设置面板 - 界面预览

面板外观示意图

┌─────────────────────────────────────┐
│            环境设置                  │
├─────────────────────────────────────┤
│ 房间: [LivingRoom01 ▼]              │
├─────────────────────────────────────┤
│ 温度: [ 25.6 ]    PM2.5: [ 33.7 ]   │
│ 烟雾: [ 15.2 ]    能耗: [ 2.45 ]   │
├─────────────────────────────────────┤
│        [应用]         [重置]         │
└─────────────────────────────────────┘

尺寸规格

• 总尺寸: 280 × 240 像素
• 背景: 半透明深灰色 (RGBA: 0.1, 0.1, 0.1, 0.85)
• 位置: 屏幕右上角，距离边缘0像素

布局说明

垂直布局（从上到下）

1. 标题区域 (30px高)

   • 居中显示"环境设置"
   • 16pt白色字体

2. 房间选择 (35px高)

   • 下拉菜单显示当前房间
   • 支持切换不同房间

3. 数值输入区域 (120px高)

   • 温度输入框 (120x30px)
   • PM2.5输入框 (120x30px)
   • 烟雾浓度输入框 (120x30px)
   • 能耗显示框 (120x30px，只读)
   • 左右排列，节省空间

4. 按钮区域 (30px高)

   • 应用按钮 (70x30px)
   • 重置按钮 (70x30px)
   • 左右对称排列

颜色方案

• 背景: 深灰色半透明
• 文字: 白色
• 输入框: 深色背景，白色边框
• 按钮: 深色背景，鼠标悬停高亮

交互行为

正常状态

• 面板半透明显示，不影响游戏视觉
• 所有输入框显示当前环境数值

鼠标悬停

• 面板可以选择性增加透明度（可选）
• 按钮显示悬停效果

输入状态

• 点击输入框时，显示输入光标
• 支持数字输入和删除
• 实时验证输入格式

按钮交互

• 应用按钮: 保存所有修改的数值
• 重置按钮: 恢复到当前环境数值

视觉层次

Z轴排序

• Sort Order: 100 (高于其他UI)
• 确保始终显示在最上层

透明度层次

• 背景: 85% 不透明
• 文字: 100% 不透明
• 边框: 100% 不透明

响应式设计

不同分辨率

• 面板尺寸固定，不随分辨率变化
• 始终保持在右上角
• 文字大小保持可读性

不同屏幕比例

• 16:9, 16:10, 4:3 等比例下都正常显示
• 锚点固定确保位置正确

无障碍设计

键盘导航

• Tab键可以在输入框间切换
• Enter键可以应用修改
• Escape键可以取消修改

视觉反馈

• 输入错误时，输入框边框变红
• 成功应用时，短暂显示绿色确认效果

与游戏场景的协调

视觉融合

• 颜色与游戏UI风格一致
• 半透明度不影响游戏沉浸感
• 紧凑尺寸不占用过多屏幕空间

功能集成

• 数值修改立即反映到游戏环境
• 与现有环境控制系统无缝集成
• 不干扰其他游戏机制