Category / Section
How to change the background color for editing cell
2 mins read
SfDataGrid allows you to customize the background color for editing cell by customizing the cell renderer associated to the edited grid cell.
Refer the below code example in which GridCellNumericRenderer is customized and the OnInitializeEditView method is overridden to customize the background color of the editing cell.
NumericColumnRenderer
public class NumericColumnRenderer : GridCellNumericRenderer { public NumericColumnRenderer() { } public override void OnInitializeEditView(DataColumnBase dataColumn, SFNumericTextBox view) { base.OnInitializeEditView(dataColumn, view); view.BackgroundColor = UIColor.Cyan; } }
MyViewController:
In MyViewController, the existing GridCellNumericRenderer has to be removed from SfDataGrid.CellRenderers collection and the customized NumericCellRenderer has to be added to the CellRenderer collection.
public class MyViewController:UIViewController { SfDataGrid dataGrid; ViewModel viewModel; public MyViewController() { dataGrid = new SfDataGrid(); viewModel = new ViewModel(); } public override void ViewDidLoad() { base.ViewDidLoad(); this.View.BackgroundColor = UIColor.White; dataGrid.ItemsSource = viewModel.OrdersInfo; dataGrid.AutoGenerateColumns = false; dataGrid.AllowEditing = true; dataGrid.EditTapAction = TapAction.OnTap; dataGrid.CellRenderers.Remove("Numeric"); dataGrid.CellRenderers.Add("Numeric", new NumericColumnRenderer()); var numericColumn = new GridNumericColumn(); numericColumn.MappingName = "OrderID"; numericColumn.AllowEditing = true; dataGrid.Columns.Add(numericColumn); this.View.AddSubview(dataGrid); } public override void ViewDidLayoutSubviews() { dataGrid.Frame = new CGRect(0, 50, View.Frame.Width, View.Frame.Height - 20); base.ViewDidLayoutSubviews(); } }
Screenshot:
Sample Link: How to change the background color for editing cell?