Sample code to show how to use Avalondock in an MVVM application [closed]

Answer 1

there is an Example App in the CodePlex Source of AvalonDock - it's not included in the normal download. You'll need to go to the Source Control page and click on 'Download'.

Additionally, I've written an example App, that you can also use to get started, I wrote a quick blog post describing it and put it on GitHub.

Basically, you can set the LayoutItemContainerStyle to bridge the gap between the View and your ViewModel, for example:

<Window ...
  xmlns:dock="http://schemas.xceed.com/wpf/xaml/avalondock"
  xmlns:dockctrl="clr-namespace:Xceed.Wpf.AvalonDock.Controls;assembly=Xceed.Wpf.AvalonDock"
  >
  ...
  <dock:DockingManager DataContext="{Binding DockManagerViewModel}"
                       DocumentsSource="{Binding Documents}" >

    <dock:DockingManager.LayoutItemContainerStyle>
      <!-- you can add additional bindings from the layoutitem to the DockWindowViewModel -->
      <Style TargetType="{x:Type dockctrl:LayoutItem}">
        <Setter Property="Title" Value="{Binding Model.Title}" />
        <Setter Property="CloseCommand" Value="{Binding Model.CloseCommand}" />
        <Setter Property="CanClose" Value="{Binding Model.CanClose}" />
      </Style>
    </dock:DockingManager.LayoutItemContainerStyle>

  </dock:DockingManager>

</Window>

In this example, DockManagerViewModel has a property 'Documents' with a collection of ViewModels that have a Title, CloseCommand and CanClose property.