在Dev GridControl中添加顏色可變的ProgressBar z

在使用DevExpress，GridControl自帶的ProgressBarControl的時候

由於無法通過BackColor/ForeColor來改變進度條的顏色所以很多特效是實現不了的。如下面

所以必須使用其他的一些方式來實現顏色可變的ProgressBar.

情況一、

不使用ProgressBarControl，而是根據單元格的值使用GDI繪制一個帶背景色的長方形的方式來實現百分比的效果。同時繪制的觸發是在CustomDrawCell的時候。

效果如下：

代碼如下：

 

               private void gdvMarket_CustomDrawCell(object sender, RowCellCustomDrawEventArgs e)
        {
            
            if (e.Column == RangePercent)//漲跌幅對應的列
            {
                DrawProgressBar(e);
            }
        }
        private void DrawProgressBar(DevExpress.XtraGrid.Views.Base.RowCellCustomDrawEventArgs e)
        {
            decimal percent = Convert.ToDecimal(e.CellValue);
            int width= (int)(10*Math.Abs(percent) * e.Bounds.Width / 100);//漲跌幅最大為10%，所以要乘以10來計算比例，沾滿一個單元格為10%
            Rectangle rect = new Rectangle(e.Bounds.X, e.Bounds.Y, width, e.Bounds.Height);
            Brush b = Brushes.Green;
            if (percent < 0)
                b = Brushes.Green;
            else if (percent < 2.5m)
                b = Brushes.Purple;
            else if (percent < 5.0m)
                b = Brushes.Red;
            else if (percent < 7.5m)
                b = Brushes.Yellow;
            e.Graphics.FillRectangle(b, rect);
        }

 

情況二、

注意：注意上面的圖你會發現有個問題：選中行的顏色覆蓋了，我們畫上去的長方形ProgressBar，所以我們要屏蔽系統覆蓋我們操作的流程。

稍微修改一下代碼即可：

            if (e.Column == RangePercent)
            {
                DrawProgressBar(e);
                e.Handled = true;
            }

情況三、

注意：問題又來了！！這個時候由於屏蔽了系統的賦值的操作，導致單元格里面的數值沒有了！看不到百分比了！並且，在單元格獲取到焦點的時候，顯示單元格的數值。

現在要做的就是達到下面的效果：ProgressBar單元格里面應該包括兩個部分：ProgressBar+百分比數值【可以設置為可以編輯、也可以不可以不能編輯，當可以編輯的時候可以輸入數值，一個百分比數值】

通過下面的代碼和設計的修改即可：

       private  void DrawEditor(DevExpress.XtraGrid.Views.Base.RowCellCustomDrawEventArgs e)
        {
            GridCellInfo cell = e.Cell as GridCellInfo;
            Point offset = cell.CellValueRect.Location;
            BaseEditPainter pb = cell.ViewInfo.Painter as BaseEditPainter;
            AppearanceObject savedStyle = cell.ViewInfo.PaintAppearance;
            if (!offset.IsEmpty)
                cell.ViewInfo.Offset(offset.X, offset.Y);
            try
            {
                pb.Draw(new ControlGraphicsInfoArgs(cell.ViewInfo, e.Cache, cell.Bounds));
            }
            finally
            {
                if (!offset.IsEmpty)
                    cell.ViewInfo.Offset(-offset.X, -offset.Y);
            }
        }
        
        private void gdvMarket_CustomDrawCell(object sender, RowCellCustomDrawEventArgs e)
        {
            if (e.Column == RangePercent)
            {
                DrawProgressBar(e);
                e.Handled = true;
                DrawEditor(e);
            }
        }

同時：修改設計【這里也可以通過代碼來修改】

查看效果

情況四、

看到上面的截圖發現現在的效果基本上已經能夠滿足需求了，但是我們發現所有的選中行的前景色被覆蓋了！！原來顯示為紅色或者綠色的前景色在選中之后都變成了黑色。

這里通過設計器或者代碼都可以實現。

EnableAppearanceFocusedCell = False, EnableAppearanceFocusedRow = False

看效果：

情況五、

查看上面效果的時候，看到其他行的背景色都已經修改為我們設置的背景色了，但是ProgressBar的背景色並沒有修改，要怎么樣修改呢？對了先說一下怎么更改選中行的背景色【可能用戶想配置這個選項，所以下面提供代碼的形式】

設置選中行背景色：

        private void gdvMarket_RowCellStyle(object sender, RowCellStyleEventArgs e)
        {
            if (e.RowHandle == gdvMarket.FocusedRowHandle)
            {
                e.Appearance.BackColor = Color.CadetBlue;
            }
        }

ProgressBar的背景色並沒有修改問題的解決辦法：

        private void gdvMarket_CustomDrawCell(object sender, RowCellCustomDrawEventArgs e)
        {
            if (e.Column == RangePercent)
            {
                e.Appearance.DrawBackground(e.Cache, e.Bounds);
                DrawProgressBar(e);          
                DrawEditor(e);
                e.Handled = true;
            }
         }

效果如下：