Syncfusion SfDataGrid で編集する際に キーボードの種類(KeyboardType)を変更 した上で、完了ボタン(Done ボタン)を追加して、編集の確定とキーボードを閉じる方法です。
※ この記事の投稿時点の SfDataGrid のバージョンは v15.2.0.46 です。
Editing 機能で Excel のセルのように編集できます。キーボードの種類を指定するには、カスタム GridCellTextViewRenderer
クラスを使います。
さらに、数字のキーパッドの場合、入力を確定する方法・キーボードを閉じる方法がわかりにくいので「完了ボタン」を追加します。このアイデアは「(UITextViewの)キーボードに「閉じる」ボタンを追加する - ながいものには、まかれたくない」から。
public class GridCellTextViewRendererExt : GridCellTextViewRenderer { public override void OnInitializeEditView(DataColumnBase dataColumn, UITextField view) { base.OnInitializeEditView(dataColumn, view); // KeyboardType 変更 view.KeyboardType = UIKeyboardType.NumberPad; // Toolbar 追加 var toolbar = new UIToolbar(new CGRect(0, 0, 60, 44)) { BarStyle = UIBarStyle.Default, Translucent = true }; toolbar.SizeToFit(); var spacer = new UIBarButtonItem(UIBarButtonSystemItem.FlexibleSpace); var doneButton = new UIBarButtonItem(UIBarButtonSystemItem.Done, (o, e) => { view.ResignFirstResponder(); }); doneButton.Clicked += (o, e) => { // 編集を確定する dataColumn.Renderer.DataGrid.EndEdit(); }; toolbar.Items = new[] { spacer, doneButton }; view.InputAccessoryView = toolbar; } }
作成したカスタムレンダラーに差し替えます。
_dataGrid = new SfDataGrid(this); // Add custom renderer _dataGrid.CellRenderers.Remove("TextView"); _dataGrid.CellRenderers.Add("TextView", new GridCellTextViewRendererExt());