157 lines
6.9 KiB
Plaintext
157 lines
6.9 KiB
Plaintext
液体吸收测试报告 - 隔行变色实现说明
|
||
=========================================
|
||
|
||
## 实现方式
|
||
|
||
参考图片示例，使用DataGridView的内置属性实现黄色和白色交替的隔行变色效果。
|
||
|
||
### 1. Designer.cs配置
|
||
|
||
在Form3.Designer.cs中，DataGridView配置了隔行变色：
|
||
|
||
```csharp
|
||
dataGridViewCellStyle1.BackColor = System.Drawing.Color.FromArgb(255, 255, 200);
|
||
this.dataGridView1.AlternatingRowsDefaultCellStyle = dataGridViewCellStyle1;
|
||
```
|
||
|
||
这个配置会自动为奇数行和偶数行设置不同的背景色：
|
||
- 偶数行（0, 2, 4...）：白色背景（默认）
|
||
- 奇数行（1, 3, 5...）：黄色背景 RGB(255, 255, 200)
|
||
|
||
### 2. 颜色说明
|
||
|
||
根据参考图片，使用以下颜色方案：
|
||
- **白色行**：RGB(255, 255, 255) - 纯白色
|
||
- **黄色行**：RGB(255, 255, 200) - 浅黄色
|
||
|
||
这种配色方案：
|
||
- ✅ 对比度适中，不刺眼
|
||
- ✅ 清晰区分不同行
|
||
- ✅ 提高数据可读性
|
||
- ✅ 符合常见表格设计规范
|
||
|
||
### 3. 代码优化要点
|
||
|
||
为了让隔行变色正常工作，需要注意以下几点：
|
||
|
||
#### 3.1 不要在列样式中设置BackColor
|
||
```csharp
|
||
// ❌ 错误做法 - 会覆盖隔行变色
|
||
DataGridViewCellStyle style = new DataGridViewCellStyle
|
||
{
|
||
BackColor = Color.White, // 这会覆盖隔行变色
|
||
Alignment = DataGridViewContentAlignment.MiddleCenter
|
||
};
|
||
|
||
// ✅ 正确做法 - 不设置BackColor
|
||
DataGridViewCellStyle style = new DataGridViewCellStyle
|
||
{
|
||
Alignment = DataGridViewContentAlignment.MiddleCenter
|
||
// 不设置BackColor，让隔行变色自动生效
|
||
};
|
||
```
|
||
|
||
#### 3.2 避免使用CellPainting事件设置背景色
|
||
```csharp
|
||
// ❌ 错误做法 - CellPainting会覆盖隔行变色
|
||
private void DataGridView1_CellPainting(...)
|
||
{
|
||
e.CellStyle.BackColor = Color.White; // 这会覆盖隔行变色
|
||
}
|
||
|
||
// ✅ 正确做法 - 移除CellPainting事件或不设置BackColor
|
||
```
|
||
|
||
#### 3.3 只在必要时使用CellFormatting
|
||
```csharp
|
||
// ✅ 正确做法 - 只格式化显示内容，不改变背景色
|
||
private void DataGridView1_CellFormatting(...)
|
||
{
|
||
// 只处理显示格式，不设置BackColor
|
||
e.Value = value.ToString("F2");
|
||
e.FormattingApplied = true;
|
||
}
|
||
```
|
||
|
||
### 4. 效果展示
|
||
|
||
实现后的效果（参考图片）：
|
||
```
|
||
┌─────────────┬────────┬────────┬────────┬────────┬────────┬──────────────────┐
|
||
│ 序号 │ 试样1 │ 试样2 │ 试样3 │ 试样4 │ 试样5 │ 时间 │
|
||
├─────────────┼────────┼────────┼────────┼────────┼────────┼──────────────────┤
|
||
│吸水时间(s) │ 30.49 │ 30.78 │ 31.41 │ 31.19 │ 30.82 │ 2025-12-30 17:25 │ ← 黄色背景
|
||
├─────────────┼────────┼────────┼────────┼────────┼────────┼──────────────────┤
|
||
│吸芯高度(mm) │ 30.62 │ 30.53 │ 31.43 │ 32.62 │ 30.35 │ 2025-12-30 17:26 │ ← 白色背景
|
||
├─────────────┼────────┼────────┼────────┼────────┼────────┼──────────────────┤
|
||
│芯吸速率 │ 31.11 │ 31.05 │ 30.52 │ 33.21 │ 31.13 │ 2025-12-30 17:27 │ ← 黄色背景
|
||
├─────────────┼────────┼────────┼────────┼────────┼────────┼──────────────────┤
|
||
│平均芯吸速率 │ 32.71 │ 30.53 │ 30.92 │ 33.96 │ 31.52 │ 2025-12-30 17:28 │ ← 白色背景
|
||
├─────────────┼────────┼────────┼────────┼────────┼────────┼──────────────────┤
|
||
│标准偏差 │ 32.26 │ 30.64 │ 31.04 │ 34.00 │ 31.13 │ 2025-12-30 17:29 │ ← 黄色背景
|
||
├─────────────┼────────┼────────┼────────┼────────┼────────┼──────────────────┤
|
||
│互检/审核 │ 30.57 │ 31.20 │ 33.66 │ 32.12 │ 33.22 │ 2025-12-30 17:30 │ ← 白色背景
|
||
└─────────────┴────────┴────────┴────────┴────────┴────────┴──────────────────┘
|
||
```
|
||
|
||
### 5. 优势
|
||
|
||
使用DataGridView内置的隔行变色功能有以下优势：
|
||
|
||
1. **性能好**：不需要在CellPainting事件中手动绘制
|
||
2. **代码简洁**：只需要在Designer中配置一次
|
||
3. **自动适应**：添加/删除行时自动调整颜色
|
||
4. **视觉清晰**：黄白交替，易于区分不同行
|
||
5. **符合规范**：与参考图片保持一致的视觉效果
|
||
|
||
### 6. 颜色对比
|
||
|
||
| 背景色 | RGB值 | 用途 | 视觉效果 |
|
||
|--------|-------|------|----------|
|
||
| 白色 | (255, 255, 255) | 偶数行 | 纯白色，清爽 |
|
||
| 浅黄色 | (255, 255, 200) | 奇数行 | 淡黄色，温和 |
|
||
|
||
### 7. 与参考图片的对比
|
||
|
||
参考图片的特点：
|
||
- ✅ 黄白交替的隔行变色
|
||
- ✅ 黄色背景不刺眼
|
||
- ✅ 数据清晰易读
|
||
- ✅ 专业的表格外观
|
||
|
||
我们的实现：
|
||
- ✅ 完全匹配参考图片的颜色方案
|
||
- ✅ 使用相同的RGB(255, 255, 200)黄色
|
||
- ✅ 自动隔行变色，无需手动设置
|
||
- ✅ 性能优化，流畅显示
|
||
|
||
### 8. 注意事项
|
||
|
||
1. 如果需要特定单元格使用特殊背景色，可以在CellFormatting中设置
|
||
2. 但要注意，特殊背景色会覆盖隔行变色效果
|
||
3. 建议只对特殊情况（如错误提示）使用特殊背景色
|
||
4. 大部分情况下，让隔行变色自动生效即可
|
||
|
||
### 9. 测试验证
|
||
|
||
运行程序后，应该看到：
|
||
- 第1行（吸水时间）：黄色背景 RGB(255, 255, 200)
|
||
- 第2行（吸芯高度）：白色背景
|
||
- 第3行（芯吸速率）：黄色背景
|
||
- 第4行（平均芯吸速率）：白色背景
|
||
- 第5行（标准偏差）：黄色背景
|
||
- 第6行（互检/审核）：白色背景
|
||
|
||
如果看不到隔行变色效果，检查：
|
||
1. Designer.cs中是否配置了AlternatingRowsDefaultCellStyle
|
||
2. 代码中是否设置了BackColor覆盖了隔行变色
|
||
3. 是否使用了CellPainting事件设置背景色
|
||
|
||
### 10. Excel导出
|
||
|
||
导出到Excel时，也可以保持相同的隔行变色效果：
|
||
- 使用NPOI设置单元格背景色
|
||
- 奇数行使用黄色背景
|
||
- 偶数行使用白色背景
|
||
- 保持与界面一致的视觉效果
|