最近在做一個檢測類的專案，其中需要對一項項的資料做自動檢測匹配。就想到了progressSteps 控制元件。

最初設想的是採用類似圖片中的這種方式。一項檢測完了提示一項成功與否，其實和progressSteps 展示類似。只不過這個是分表格展示的。後面每一行有個Status 顯示狀態資訊。

在翻看dotnetbar示例時突然看到了這個控制元件想著這個做一個出來。

新增一個檢測控制元件

private DevComponents。DotNetBar。ProgressSteps progressSteps1_jiance；

首先新增每一個Item

this。progressSteps1_jiance。Items。Clear（）； List gasList = new List（）； gasList。Add（“CH4”）； gasList。Add（“CO2”）； gasList。Add（“CO”）； gasList。Add（“T”）； gasList。Add（“H”）； gasList。Add（“O2”）； gasList。Add（“煙感”）； foreach （var item in gasList） { StepItem newItem = new StepItem（）； newItem。Name = item； newItem。Text = item； //newItem。Padding。Top = 8； //newItem。Padding。Bottom=8； //newItem。Padding。Left = 8； //newItem。Padding。Right = 8； this。progressSteps1_jiance。Items。Add（newItem）； }

執行介面效果：

執行前

繫結檢測邏輯更改對應的Item的背景色和顯示的圖示標誌（這裡使用Symbol來控制更改）。

private void setItemBackColor（string itemName，bool warning） { List colors = new List（）； colors。Add（Color。Green）； colors。Add（Color。White）； StepItem tmpItem = （StepItem）this。progressSteps1_jiance。GetItem（itemName）； tmpItem。BackColors = colors。ToArray（）； if （warning） { tmpItem。BackColors = colors。ToArray（）； tmpItem。BackColors［0］ = Color。Red； tmpItem。Symbol =“”； tmpItem。SymbolColor =Color。Red； // tmpItem。SymbolSet = DevComponents。DotNetBar。eSymbolSet。Material； } else { tmpItem。BackColors［0］ = Color。Green； tmpItem。Symbol = “”； tmpItem。SymbolColor =Color。Green； } this。BeginInvoke（new Action（（） => { this。progressSteps1_jiance。Refresh（）； }））； }

這段程式碼裡 使用item的名字來控制是顯示綠色的透過和紅色的警告不透過的。執行下看看效果。有了：

檢測後