想要实现的效果如下:
单元格背景进度条的大小取决于当前单元格里的数值
TreeList和GridControl的设置方法都是相同的:都是通过给列设置FormatRule来实现的。
相关代码及设置如下:
1、给控件绑定数据源,我的数据源是一个DataTable,相关代码如下:
/// <summary>
/// 生成一个DataTable
/// </summary>
/// <returns></returns>
public static DataTable GetPercentDataSource()
{
DataTable dt = new DataTable();
dt.Columns.Add(new DataColumn("ID", typeof(Int32))
{
AllowDBNull = false,
AutoIncrement = true,
AutoIncrementSeed = 1,
AutoIncrementStep = 1
});
dt.Columns.Add(new DataColumn("Name", typeof(string)));
dt.Columns.Add(new DataColumn("Year", typeof(int)));
dt.Columns.Add(new DataColumn("Numb", typeof(double)));
dt.Columns.Add(new DataColumn("NumbPercent1", typeof(double)));
dt.Columns.Add(new DataColumn("NumbPercent2", typeof(double)));
int index = 1;
for (int i = 0; i <= 100; i++)
{
double x = i * 0.01;
double y = x;
if (i % 2 == 1)
{
y = -1 * x;
}
dt.Rows.Add(new object[] { index++, "张三", 2024, i, x, y });
}
return dt;
}
2、设置控件,我的示例使用的是TreeList控件(GridControl的设置步骤与此相同)
(1)添加treeListColumn,设置对应的Caption和FieldName
(2)切换到Format Rules页码上,按照下图顺序进行设置:
- 一个Format Rules对应一个TreeListColumn
- 下图是NumbPercent1的设置:单元格涂色部分按照数值的百分比显示(设置Rule时,在Preview区域可以预览设置的效果)
- 下图是NumbPercent2的设置:涂色进度条要能体现出正负
3、最终效果
如果想要实现这种效果:根据单元格数值显示不同的图标。
也是通过给单元格设置FormatRule来实现的