Syncfusion SfDataGrid でセルの背景色を変える方法です。
※ この記事の投稿時点の SfDataGrid のバージョンは v15.2.0.46 です。
セルの背景色の変更は GridCell
クラスを継承したクラスを GridColumn
クラス UserCellType
プロパティに指定します。背景色以外も自由にカスタマイズできます。
ちなみに、行全体の背景色を変えるには DataGridStyle
クラスが使えます(Styles 参照)。
次のようにユーザー定義のセルを作ります。
public class ColoredCell : GridCell { UILabel _label; public ColoredCell() { _label = new UILabel { Font = UIFont.SystemFontOfSize(20) }; Add(_label); CanRenderUnLoad = false; } protected override void UnLoad() { RemoveFromSuperview(); } public override void Draw(CGRect rect) { _label.Font = DataColumn.GridColumn.RecordFont; _label.TextColor = DataColumn.Renderer.DataGrid.GridStyle.GetRecordForegroundColor(); _label.TextAlignment = UITextAlignment.Center; base.Draw(rect); } public override void LayoutSubviews() { base.LayoutSubviews(); var valueText = DataColumn.CellValue.ToString(); _label.Frame = new CGRect(0, Bounds.Top, Bounds.Width, Bounds.Height); _label.Font = DataColumn.GridColumn.RecordFont; _label.TextAlignment = UITextAlignment.Center; _label.Text = valueText; // セルの値が true のとき背景色を変える if (bool.TryParse(valueText, out var result) && result) { _label.BackgroundColor = UIColor.Orange; } } protected override void Dispose(bool disposing) { if (_label != null) { _label.Dispose(); _label = null; } base.Dispose(disposing); } }
GridColumn.UserCellType
に設定します。
var col = new GridTextColumn { // ... }; col.UserCellType = typeof(ColoredCell); _dataGrid.Columns.Add(col);