.net - WPFTabControlでタブを並べ替える

Question

IEやFirefoxと同様に、TabItemのドラッグアンドドロップをサポートするようにWPFTabControlをカスタマイズする簡単な方法はありますか。

Answer 1

ItemsControlでドラッグアンドドロップするためのBeaStollnitzの既存のヘルパーを使用または開始できます。彼女が言及しているように、いくつかの制限がありますが、開始するのに最適な場所であり、おそらく、必要なほとんどすべての機能に対してそのまま機能します。

彼女のDragDropHelperクラスとAdornerクラスをインポートした後、それらをTabControlで使用するのは非常に簡単です（ItemsControlの子孫であるため）。

簡単なドラッグテンプレートの設定と、TabControlのプロパティだけで十分です。ソリューションはデータバインドされたアイテムのドラッグを処理するように設定されているため、TabControl.ItemsSourceを使用する代わりにXAMLでタブが静的に宣言されている場合は、それらのDataContextをそれら自体にバインドできます。

<Window x:Class="Samples.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dd="clr-namespace:DragDropListBox"
    Title="Dragging TabItems"
    Height="300"
    Width="300">

<Window.Resources>
    <DataTemplate x:Key="Local_TabItemDragTemplate">
        <Border CornerRadius="5"
                BorderBrush="Black"
                BorderThickness="2"
                Background="DodgerBlue">
            <TextBlock Margin="5"
                       Text="{Binding Path=Header}" />
        </Border>
    </DataTemplate>
</Window.Resources>

<StackPanel>
    <TabControl dd:DragDropHelper.IsDragSource="true"
                dd:DragDropHelper.IsDropTarget="true"
                dd:DragDropHelper.DragDropTemplate="{StaticResource Local_TabItemDragTemplate}">
        <TabControl.ItemContainerStyle>
            <Style TargetType="{x:Type TabItem}">
                <Setter Property="DataContext"
                        Value="{Binding RelativeSource={RelativeSource Self}}" />
            </Style>
        </TabControl.ItemContainerStyle>
        <TabItem Header="Tab 1" />
        <TabItem Header="Tab 2" />
        <TabItem Header="Tab 3" />
        <TabItem Header="Tab 4" />
    </TabControl>
    <TabControl dd:DragDropHelper.IsDragSource="true"
                dd:DragDropHelper.IsDropTarget="true"
                dd:DragDropHelper.DragDropTemplate="{StaticResource Local_TabItemDragTemplate}">
        <TabControl.ItemContainerStyle>
            <Style TargetType="{x:Type TabItem}">
                <Setter Property="DataContext"
                        Value="{Binding RelativeSource={RelativeSource Self}}" />
            </Style>
        </TabControl.ItemContainerStyle>
        <TabItem Header="Tab 5" />
        <TabItem Header="Tab 6" />
        <TabItem Header="Tab 7" />
        <TabItem Header="Tab 8" />
    </TabControl>
</StackPanel>