Articles in this section
Category / Section

How to add dock child in WPF DockingManager by drag and drop from other controls?

1 min read

WPF DockingManager has built in support to drag and drop Dock child from one DockingManager to another. You can also configure child dock controls by drag and drop from other controls.

For example, consider you need to add Document child by drag and drop of ListViewItem from ListView and it can be achieved by handling Drop event in DockingManager. 

XAML

<syncfusion:DockingManager x:Name="clientdockingManager" IsVS2010DraggingEnabled="True"
                           Drop="clientdockingManager_Drop"  IsEnableHotTracking="True"  EnableScrollableSidePanel="True" ContainerMode="TDI" PersistState="false" AllowDrop="True" UseDocumentContainer="True">
  <ListView Margin="10,50,10,10" Name="lstView" BorderBrush="WhiteSmoke"
            syncfusion:DockingManager.SideInDockedMode="Left"
            syncfusion:DockingManager.State="Dock" AllowDrop="True"
            syncfusion:DockingManager.DesiredWidthInDockedMode="350"
            syncfusion:DockingManager.Header="ListView" PreviewMouseLeftButtonDown="lstView_PreviewMouseLeftButtonDown" MouseMove="lstView_MouseMove" DragEnter="lstView_DragEnter" Drop="lstView_Drop">
    <ListView.View>
      <GridView>
        <GridViewColumn Header="Title" Width="80" DisplayMemberBinding="{Binding Title}" />
        <GridViewColumn Header="Note" Width="150" DisplayMemberBinding="{Binding Note}" />
      </GridView>
    </ListView.View>
  </ListView>
 
  <!--Document Area-->
  <Grid syncfusion:DockingManager.State="Document"
        syncfusion:DockingManager.Header="Docking Manager" syncfusion:DockingManager.DesiredWidthInFloatingMode="150" >
    <FlowDocumentScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
      <FlowDocument>
        <Paragraph  FontSize="14" FontFamily="Segoe UI" >
          This sample illustrates the Linked Manager support in Docking Manager.
          The windows belonging to one docking Manager can be dragged and dropped to other Docking Manager.
        </Paragraph>
      </FlowDocument>
    </FlowDocumentScrollViewer>
    <!--Remaining Client Area-->
  </Grid>
</syncfusion:DockingManager>

C#

/// <summary> 
/// Invoked when Drop some control on the DockingManager 
/// </summary>   
private void clientdockingManager_Drop(object sender, DragEventArgs e) 
{ 
  ContentControl CC = new ContentControl(); 
  if (item != null) 
  { 
    CC.Content = new TextBlock() { Text = item.Note }; 
    DockingManager.SetState(CC, DockState.Document); 
    DockingManager.SetHeader(CC, item.Title); 
    this.clientdockingManager.Children.Add(CC); 
  } 
  isdragenter = false; 
} 

 

Adding child using drag and drop option in WPF DockingManager

View sample in GitHub.

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied