Dock Layout Manager: Performance Enhancements
- 4 minutes to read
This topic contains recommendations that help you to improve DockLayoutManager performance.
#Iterate Over Multiple Panels
The DockLayoutManager updates its layout after you do the following operations:
- Add or remove a Panel or a Group.
- Close or hide a Panel or a Group.
- Make a Panel or a Group floating.
When you perform these operations in a multi-thread loop, wrap them with the DockLayoutManager.BeginUpdate()
and DockLayoutManager.EndUpdate()
methods to reduce operation processing time. In this instance, the DockLayoutManager updates its layout only after the last iteration.
#Add Panels To DockItem
The code sample below creates LayoutPanels and adds them to the LayoutGroup.
using DevExpress.Mvvm;
using System.Collections.ObjectModel;
// ...
public class ViewModel : ViewModelBase {
public ICustomService DockLayoutManagerService { get { return this.GetService<ICustomService>(); } }
public ObservableCollection<DataItem> Source {
get { return GetValue<ObservableCollection<DataItem>>(); }
set { SetValue(value); }
}
// ...
void AddNew() {
DockLayoutManagerService.BeginUpdate();
for (int i = 0; i < 30; i++) {
Source.Add(new DataItem() { Name = "Name" + i.ToString(), Value = i, TargetName = "host" });
}
DockLayoutManagerService.EndUpdate();
}
}
using DevExpress.Mvvm;
using DevExpress.Xpf.Docking;
namespace DockingThreads {
public class DataItem : BindableBase, IMVVMDockingProperties {
public string Name {
get { return GetValue<string>(); }
set { SetValue(value); }
}
public int Value {
get { return GetValue<int>(); }
set { SetValue(value); }
}
public bool IsHidden {
get { return GetValue<bool>(); }
set { SetValue(value); }
}
public string TargetName { get; set; }
public override string ToString() {
return Name;
}
}
}
using DevExpress.Mvvm.UI;
using DevExpress.Xpf.Docking;
namespace DockingThreads
{
public interface ICustomService {
void BeginUpdate();
void EndUpdate();
}
public class CustomService : ServiceBaseGeneric<DockLayoutManager>, ICustomService {
public void BeginUpdate() {
this.AssociatedObject.BeginUpdate();
}
public void EndUpdate() {
this.AssociatedObject.EndUpdate();
}
}
}
#Change the Panel Type to Autohidden
The code sample below creates LayoutGroups and hides them on the left side of the application.
using DevExpress.Mvvm;
// ...
void HideAll() {
DockLayoutManagerService.BeginUpdate();
Source.ToList().ForEach(x => x.IsHidden = true);
DockLayoutManagerService.EndUpdate();
}
using DevExpress.Mvvm;
using DevExpress.Xpf.Docking;
namespace DockingThreads {
public class DataItem : BindableBase, IMVVMDockingProperties {
public string Name {
get { return GetValue<string>(); }
set { SetValue(value); }
}
public int Value {
get { return GetValue<int>(); }
set { SetValue(value); }
}
public bool IsHidden {
get { return GetValue<bool>(); }
set { SetValue(value); }
}
public string TargetName { get; set; }
public override string ToString() {
return Name;
}
}
}
using DevExpress.Mvvm.UI;
using DevExpress.Xpf.Docking;
namespace DockingThreads
{
public interface ICustomService {
void BeginUpdate();
void EndUpdate();
}
public class CustomService : ServiceBaseGeneric<DockLayoutManager>, ICustomService {
public void BeginUpdate() {
this.AssociatedObject.BeginUpdate();
}
public void EndUpdate() {
this.AssociatedObject.EndUpdate();
}
}
}
#Dock / Undock Operations
This section describes how to speed up dock, undock, and drag and drop operations.
#Logical Layout Structure
When you dock/undock a panel, the visual tree of its child elements is rebuilt. To preserve the structure of the logical tree and increase the speed of dock/undock operations, set the DockLayoutManager.LogicalTreeStructure property to Optimized.
<dx:ThemedWindow ...
xmlns:dxdo="http://schemas.devexpress.com/winfx/2008/xaml/docking"
xmlns:dxcore="http://schemas.devexpress.com/winfx/2008/xaml/core">
<Grid>
<dxdo:DockLayoutManager LogicalTreeStructure="Optimized">
<!-- ... -->
</dxdo:DockLayoutManager>
</Grid>
</dx:ThemedWindow>
#Drag and Drop
Application performance decreases when you drag and drop a panel with complex content. To improve performance, disable the ShowContentWhenDragging option so that only the panel border is displayed during the drag-and-drop operation.
<dx:ThemedWindow ...
xmlns:dxdo="http://schemas.devexpress.com/winfx/2008/xaml/docking"
xmlns:dxcore="http://schemas.devexpress.com/winfx/2008/xaml/core">
<Grid>
<dxdo:DockLayoutManager ShowContentWhenDragging="False">
<!-- ... -->
</dxdo:DockLayoutManager>
</Grid>
</dx:ThemedWindow>
#Cache Tabs
Application performance decreases when you switch between DocumentGroup tabs with complex child items. Use the TabContentCacheMode property to cache opened tabs and improve DockLayoutManager performance.
<dx:ThemedWindow
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:dxdo="http://schemas.devexpress.com/winfx/2008/xaml/docking">
<dxdo:DockLayoutManager>
<dxdo:LayoutGroup>
<dxdo:DocumentGroup TabContentCacheMode="CacheTabsOnSelecting">
<dxdo:DocumentPanel Caption="Panel1">
<dxsample:UserControl1 />
</dxdo:DocumentPanel>
<dxdo:DocumentPanel Caption="Panel2">
<dxsample:UserControl1 />
</dxdo:DocumentPanel>
</dxdo:DocumentGroup>
</dxdo:LayoutGroup>
</dxdo:DockLayoutManager>
</dx:ThemedWindow>