|
SfDataGrid allows you to customize the drag and drop indicators by writing a custom style for SfDataGrid. Assign the new style to the SfDataGrid.GridStyle property. To show a line indicator instead of the default arrow indicators, you need to remove the default indicator by overriding the style as the default indicators are arranged with a specific width. Now you can show your custom view as indicators using the SfDataGrid.RowColumnIndexToPoint method in the SfDataGrid.QueryRowDragging event. When dragging is started, you need to add the custom view using AddSubview method and remove the it when the dragging is ended using RemoveFromSuperview method. The below code illustrates how to place the custom view instead of Drag and Drop icon. public class MyViewController : UIViewController
{
UIView view;
SfDataGrid dataGrid;
ViewModel viewModel;
private bool isIndicatorDisplay = false;
public MyViewController()
{
viewModel = new ViewModel();
dataGrid = new SfDataGrid();
dataGrid.ItemsSource = viewModel.OrdersInfo;
dataGrid.AllowDraggingRow = true;
dataGrid.GridStyle = new CustomGridStyle();
createIndicator();
View.AddSubview(dataGrid);
View.AddSubview(view);
dataGrid.QueryRowDragging += DataGrid_QueryRowDragging;
}
private async void DataGrid_QueryRowDragging(object sender, QueryRowDraggingEventArgs e)
{
if ((e.Reason == QueryRowDraggingReason.DragStarted && !isIndicatorDisplay) || ((e.Reason == QueryRowDraggingReason.Dragging) && isIndicatorDisplay))
{
view.BackgroundColor = UIColor.Black;
if (!View.Subviews.Contains(view))
View.AddSubviews(view);
var point = dataGrid.RowColumnIndexToPoint(new RowColumnIndex(e.To, 0));
view.Frame = new CoreGraphics.CGRect(0, point.Y, this.dataGrid.Frame.Width, 2);
isIndicatorDisplay = true;
}
else if (e.Reason == QueryRowDraggingReason.DragEnded)
{
view.BackgroundColor = UIColor.Green;
await Task.Delay(300);
view.RemoveFromSuperview();
isIndicatorDisplay = false;
}
else
{
view.BackgroundColor = UIColor.Green;
await Task.Delay(2000);
view.RemoveFromSuperview();
isIndicatorDisplay = false;
}
}
public override void ViewDidLayoutSubviews()
{
base.ViewDidLayoutSubviews();
dataGrid.Frame = new CoreGraphics.CGRect(0, 0, this.View.Frame.Width, this.View.Frame.Height);
}
private void createIndicator()
{
view = new UIView();
view.BackgroundColor = UIColor.Black;
}
}
The below code example illustrates how to customize the drag and drop icon. public class CustomGridStyle : DataGridStyle
{
public CustomGridStyle()
{
}
public override UIImage GetRowDragDownIndicator()
{
return null;
}
public override UIImage GetRowDragUpIndicator()
{
return null;
}
}
On executing the above code, the below output will be obtained.
Sample Link: How to place line indicator instead of arrows while Drag and Drop in SfDataGrid?
|
2X faster development
The ultimate Xamarin UI toolkit to boost your development speed.
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
