拖放操作通常涉及两个参与方：拖动对象所源自的拖动源和接收放置对象的拖放目标。 拖动源和放置目标可能是相同应用程序或不同应用程序中的 UI 元素。
我这里实现的是对TabControl的Tab页面进行拖放，以达成类似Chrome浏览器的拖放功能。
对拖放相关事件研究后发现，最终只需要在拖动源事件处理程序中调用 DoDragDrop 方法启动拖动操作，然后在拖放目标上，响应Drop事件。启动拖放操作的拖动源事件通常是 MouseMove事件，另外需要判断鼠标左键是否为按下状态。另外，最好判断一下鼠标移动的距离是否大于最小拖动距离（在我没有添加这个检查之前，双击也会触发拖动事件）。
除了正常拖动（将Tab页从一个TabControl 拖动到另一个 TabControl 中），考虑将Tab页拖动到窗口之外的情况（浏览器在这种情况下会创建一个新的窗口来显示这个Tab页），我这里采用类似的方式，创建一个预设的子窗口来显示该Tab页面。
此外，当Tab页面在原TabControl内部拖动时，根据拖动位置，调整Tab页面的顺序。
我这里对原生的TabControl进行了继承封装了几个响应事件，轻量化的实现了拖放效果。
TabControlDragable.cs
cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
namespace WpfLibrary;
public class TabControlDragable : TabControl
{
public TabControlDragable()
{
AddHandler(MouseLeftButtonDownEvent, new MouseButtonEventHandler(OnMouseLeftButtonDown), true);
AddHandler(MouseLeftButtonUpEvent, new MouseButtonEventHandler(OnMouseLeftButtonUp), true);
AddHandler(MouseMoveEvent, new MouseEventHandler(OnMouseMove), true);
AddHandler(DropEvent, new DragEventHandler(OnDrop), true);
MinWidth = 100;
MinHeight = 100;
AllowDrop = true;
}
private bool IsDraging = false;
private object? DragData;
private Point DragStartPosition;
private void OnMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
Point p = e.GetPosition(this);
DragData = DragUtility.GetDataObjectFromItemsControl(this, p);
if (DragData != null)
{
DragStartPosition = p;
}
e.Handled = true;
}
private void OnMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
ResetState();
e.Handled = true;
}
private void OnMouseMove(object sender, MouseEventArgs e)
{
if (DragData == null || DragData is not TabItem)
{
return;
}
Point currentPosition = e.GetPosition(this);
if (e.LeftButton == MouseButtonState.Pressed && !IsDraging
&& ((Math.Abs(currentPosition.X - DragStartPosition.X) > SystemParameters.MinimumHorizontalDragDistance) || (Math.Abs(currentPosition.Y - DragStartPosition.Y) > SystemParameters.MinimumVerticalDragDistance)))
{
DataObject dataObject = new DataObject();
dataObject.SetData("DragData", DragData);
var effects = DragDrop.DoDragDrop(this, dataObject, DragDropEffects.Move);
if (effects == DragDropEffects.None)
{
if (Items.Count != 1)
{
var tabItem = DragData as TabItem;
var parentWindow = DragUtility.GetParentWindow(tabItem);
Items.Remove(tabItem);
ChildWindow newChildWindow = new ChildWindow();
if (parentWindow is ChildWindow)
{
newChildWindow.Owner = parentWindow.Owner;
}
else
{
newChildWindow.Owner = parentWindow;
}
newChildWindow.DataContext = parentWindow?.DataContext;
var tabControl = new TabControlDragable();
newChildWindow.MyGrid.Children.Add(tabControl);
tabControl.Items.Add(tabItem);
newChildWindow.Show();
}
}
ResetState();
}
e.Handled = true;
}
private int MeasureIndex(TabControl targetTabControl, Point point)
{
double preWidth = 0.0;
for (var i = 0; i < targetTabControl.Items.Count; i++)
{
var item = targetTabControl.Items[i] as TabItem;
if (item == null)
{
continue;
}
if (point.Y > item.ActualHeight)
{
return targetTabControl.Items.Count;
}
if (point.X < preWidth + item.ActualWidth / 2)
{
return i;
}
else
{
preWidth += item.ActualWidth;
}
}
return targetTabControl.Items.Count;
}
private void OnDrop(object sender, DragEventArgs e)
{
var tabItem = e.Data.GetData("DragData") as TabItem;
var parentTabControl = tabItem?.Parent as TabControl;
if (tabItem == null || parentTabControl == null)
{
return;
}
var point = e.GetPosition(this);
int index = MeasureIndex(this, point);
if (this != parentTabControl)
{
var parentWindow = DragUtility.GetParentWindow(parentTabControl);
if (parentTabControl.Items.Count == 1)
{
var childWindow = parentWindow as ChildWindow;
if (childWindow != null)
{
parentTabControl.Items.Remove(tabItem);
this.Items.Insert(index, tabItem);
this.SelectedItem = tabItem;
childWindow?.Close();
}
}
else
{
parentTabControl.Items.Remove(tabItem);
this.Items.Insert(index, tabItem);
this.SelectedItem = tabItem;
}
}
else if (index < parentTabControl.Items.IndexOf(tabItem))
{
parentTabControl.Items.Remove(tabItem);
parentTabControl.Items.Insert(index, tabItem);
parentTabControl.SelectedItem = tabItem;
}
else if (index > parentTabControl.Items.IndexOf(tabItem))
{
parentTabControl.Items.Remove(tabItem);
parentTabControl.Items.Insert(index - 1, tabItem);
parentTabControl.SelectedItem = tabItem;
}
e.Handled = true;
}
private void ResetState()
{
IsDraging = false;
DragData = null;
}
}使用起来也很简单，只需要将TabControl 替换为 TabControlDragable 即可，事件已经绑定好了。
MainWindow.xaml
XML
<Window x:Class="WpfLibraryTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfLibraryTest"
xmlns:wpfLibrary="clr-namespace:WpfLibrary;assembly=WpfLibrary"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<wpfLibrary:TabControlDragable Grid.Row="0" x:Name="tabControl1">
<TabItem Header="tabControl1Item1">
<DataGrid ItemsSource="{Binding Path=Accounts}" IsReadOnly="True"></DataGrid>
</TabItem>
<TabItem Header="tabControl1Item2">
<DataGrid ItemsSource="{Binding Path=Accounts2}" IsReadOnly="True"></DataGrid>
</TabItem>
<TabItem Header="tabControl1Item3">
<DataGrid ItemsSource="{Binding Path=Accounts3}" IsReadOnly="True"></DataGrid>
</TabItem>
</wpfLibrary:TabControlDragable>
<wpfLibrary:TabControlDragable Grid.Row="1" x:Name="tabControl2">
<TabItem Header="tabControl2Item1">
<DataGrid ItemsSource="{Binding Path=Accounts}" IsReadOnly="True"></DataGrid>
</TabItem>
<TabItem Header="tabControl2Item2">
<DataGrid ItemsSource="{Binding Path=Accounts2}" IsReadOnly="True"></DataGrid>
</TabItem>
<TabItem Header="tabControl2Item3">
<DataGrid ItemsSource="{Binding Path=Accounts3}" IsReadOnly="True"></DataGrid>
</TabItem>
</wpfLibrary:TabControlDragable>
</Grid>
</Window>