C1 WPF C1FlexGrid設置樣式技巧：單元格設置背景色

<ComponentOne Studio for WPF下載>

對於C1FlexGrid，如何給單元格設置樣式（包括前景色，背景色）是提出最多的問題。本文就經過示例介紹如何給C1FlexGrid設置特定單元格的樣式。一般狀況，咱們經過C1FlexGrid的CellFactory實現樣式的設置，經過重寫ApplyCellStyles方法來實現。

數據綁定

首先，咱們須要對c1flexgrid進行數據綁定顯示數據。在這裏，咱們假設綁定一個DataTable，代碼以下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

DataTable dt = new DataTable(); dt.Columns.Add("CurrencyCode", typeof(int)); dt.Columns.Add("Industry", typeof(string)); dt.Columns.Add("Market", typeof(string)); dt.Columns.Add("Sector", typeof(int)); dt.Columns.Add("Total", typeof(double)); dt.Columns.Add("SecurityType", typeof(string)); dt.Rows.Add(1, "Ind1", "M1", 100, null, "type1"); dt.Rows.Add(2, "Ind2", "M2", 200, null, "type2"); dt.Rows.Add(3, "Ind3", "M3", 300, 12345678.1234567, "type3"); dt.Rows.Add(4, "Ind4", "M4", 400, 12345678.1234567, "type4"); dt.Rows.Add(5, "Ind5", "M5", 500, 12345678.1234567, "type5"); dt.Rows.Add(6, "Ind6", "M6", 600, 12345678.1234567, "type6"); dt.Rows.Add(7, "Ind7", "M7", 700, 12345678.1234567, "type7"); dt.Rows.Add(8, "Ind8", "M8", 800, 12345678.1234567, "type8"); dt.Rows.Add(9, "Ind9", "M9", 900, 12345678.1234567, "type9");   flex.ItemsSource = dt.AsDataView();

設置CellFactory

自定義一個MyCellFactory類繼承CellFactory，而且設置給C1FlexGrid。代碼以下：

1	flex.CellFactory = new MyCellFactory();

重寫ApplyCellStyles

經過重寫CellFactory的ApplyCellStyles方法，來實現指定單元格的樣式設置。經過bdr拿到單元格的TextBlock，而且設置TextBlock的文字樣式（好比FontWeight,FontSize)。以及bdr設置背景色。代碼參考：

1 2 3 4 5 6 7 8 9 10 11 12

public override void ApplyCellStyles(C1FlexGrid grid, CellType cellType, CellRange range, Border bdr) { var columnindex = range.Column; var rowindex = range.Row; if ((columnindex == 2) && (rowindex == 3)) { //set the customizations on the cell when it is not selected bdr.Background = new SolidColorBrush(Colors.Red); bdr.BorderBrush = Brushes.Blue; bdr.BorderThickness = new Thickness(1); } }

這個時候運行代碼，就發現column=2, row=3的單元格的樣式已經改變，如圖：

代碼改進

這個時候樣式已經設置完成。可是當選擇到指定的單元格的時候，這個樣式會保持不變。有的用戶就但願本來的Selection 的樣式可以保留。咱們經過改進代碼來實現這個需求：這個時候，咱們須要添加一個判斷條件，來判斷指定單元格是否被選擇。判斷條件：

1	if (columnindex == grid.Selection.Column && rowindex == grid.Selection.Row)

若是指定單元格被選擇，就將背景色設置爲選擇背景色。這個時候的改進方法以下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

public override void ApplyCellStyles(C1FlexGrid grid, CellType cellType, CellRange range, Border bdr) { var columnindex = range.Column; var rowindex = range.Row;   //check if the cell is selected or not if ((columnindex == 2) && (rowindex == 3)) { if (columnindex == grid.Selection.Column && rowindex == grid.Selection.Row) { //set a different backcolor and border brush //when the cell is selected //leave the remaining customizations as it is bdr.Background = grid.SelectionBackground; } else { bdr.Background = new SolidColorBrush(Colors.Red); bdr.BorderBrush = Brushes.Blue; bdr.BorderThickness = new Thickness(1); } }   }

至此，就實現了指定單元格的背景色設置。

本文的示例請下載：Wpf_Flex_CellstyleOnCell.zip 

PS: 關於ComponentOne，這些產品你能夠關注>>

本文轉載自葡萄城