How to restrict the dockability of child window to client area in WPF DockingManager?
This article describes about how to restrict the docking abilities of the desired element, while trying to place the element in the Client area. If the element is dropped over the Client Area, the element is moved to its previous position in WPF DockingManager. The following code illustrate the same,
Mainwindow.xaml:
<syncfusion:DockingManager x:Name="dockingmanager"> <syncfusion:DockingManager.ClientControl> <ContentControl Name="ClientArea" syncfusion:DockingManager.DesiredWidthInDockedMode="700" syncfusion:DockingManager.SideInDockedMode="Left"/> </syncfusion:DockingManager.ClientControl> <ContentControl x:Name="Media" syncfusion:DockingManager.Header="Dock1" syncfusion:DockingManager.SideInDockedMode= "Bottom" /> <ContentControl x:Name="Timeline" syncfusion:DockingManager.Header="Dock2" syncfusion:DockingManager.SideInDockedMode="Bottom" /> <ContentControl syncfusion:DockingManager.Header="Dock3" syncfusion:DockingManager.DesiredWidthInDockedMode="300" syncfusion:DockingManager.SideInDockedMode="Right" Name="Properties"/> <ContentControl x:Name="playlist" syncfusion:DockingManager.Header="Dock4" syncfusion:DockingManager.DesiredWidthInDockedMode="240" syncfusion:DockingManager.SideInDockedMode= "Tabbed" syncfusion:DockingManager.TargetNameInDockedMode="Properties" /> </syncfusion:DockingManager>
Mainwindow.cs:
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
dockingmanager.PreviewMouseDown += Dockingmanager_PreviewMouseDown;
dockingmanager.PreviewMouseUp += Dockingmanager_PreviewMouseUp;
dockingmanager.PreviewMouseMove += Dockingmanager_PreviewMouseMove;
}
bool isMouseDown = false;
bool isDragging = false;
Point mouseDownPoint;
Point mousePoint;
DockedElementTabbedHost draggedelement = null;
List<FrameworkElement> tabs = null;
private void Dockingmanager_PreviewMouseUp(object sender, MouseButtonEventArgs e)
{
if (draggedelement != null && tabs != null)
{
foreach(var element in tabs)
{
if (DockingManager.GetDockAbility(element as FrameworkElement) == DockAbility.None)
DockingManager.SetState(element as FrameworkElement, DockState.Dock);
DockingManager.SetDockAbility(element as FrameworkElement, DockAbility.All);
}
}
isMouseDown = false;
isDragging = false;
tabs = null;
draggedelement = null;
}
internal bool IsPointInsideElement(UIElement element)
{
Point pt = Mouse.GetPosition(element);
Point point = element.TranslatePoint(new Point(0, 0), this.dockingmanager);
return pt.X > -5 && pt.Y > -5 && pt.X < point.X + element.RenderSize.Width && pt.Y < point.Y + element.RenderSize.Height;
}
private void Dockingmanager_PreviewMouseMove(object sender, MouseEventArgs e)
{
if (isMouseDown)
{
mousePoint = e.GetPosition(e.OriginalSource as IInputElement);
draggedelement = VisualUtils.FindAncestor(dockingmanager.ActiveWindow, typeof(DockedElementTabbedHost)) as DockedElementTabbedHost;
if (Math.Abs(mousePoint.X - mouseDownPoint.X) > 4 || Math.Abs(mousePoint.Y - mouseDownPoint.Y) > 4)
{
isDragging = true;
}
if (isDragging)
{
if (draggedelement != null && draggedelement.TabChildren != null && draggedelement.TabChildren.Count > 0)
{
tabs = new List<FrameworkElement>(draggedelement.TabChildren);
if (tabs != null)
{
if (IsPointInsideElement(ClientArea))
{
foreach (var element in tabs)
{
DockingManager.SetDockAbility(element as FrameworkElement, DockAbility.None);
}
}
else if (!IsPointInsideElement(ClientArea))
{
foreach (var element in tabs)
{
DockingManager.SetDockAbility(element as FrameworkElement, DockAbility.All);
}
}
}
}
}
}
}
private void Dockingmanager_PreviewMouseDown(object sender, MouseButtonEventArgs e)
{
isMouseDown = true;
mouseDownPoint = e.GetPosition(e.OriginalSource as IInputElement);
}
}
Conclusion
I hope you enjoyed learning about how to restrict the dockability of child window to client area in WPF DockingManager.
You can refer to our WPF Docking Manager feature tour page to know about its other groundbreaking feature representations. You can also explore documentation to understand how to create and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!