Search code examples
wpfxamlmvvmuser-controlsdevexpress

DEVEXPRESS MVVM: managing tabs in a DocumentGroup


I'm working with the MVVM pattern, with C# in VS2013.

I have a DocumentGroup in my project and a group of user control (xaml files) in a directory of my project.

<dxd:DocumentGroup Name="documentcontainer" ItemHeight="3*" SelectedTabIndex="0" ItemsSource="{Binding tabsCollection}" AllowMove="False" AllowFloat="False" AllowDrag="False">

</dxd:DocumentGroup>

Im my viewModel there is the define of tabsCollection:

    private ObservableCollection<DocumentPanel> p_tabsCollection;
    public ObservableCollection<DocumentPanel> tabsCollection
    {
        get { return p_tabsCollection; }
        set
        {
            p_tabsCollection = value;
            base.RaisePropertyChangedEvent("tabsCollection");
        }

    }

    private void Initialize() {
        DocumentPanel t = new DocumentPanel( );
        t.Content = Application.LoadComponent(new Uri("View/UC/ucImpianti.xaml", UriKind.Relative)); ;
        p_tabsCollection.Add(t);
    }
  1. is the type of tabsCollection correct?
  2. how can I insert my user control (xaml file) in the documentPanel? (if the type is correct)

I want create some tabs populated with the user control. From my menu, different voices must open different "usercontrol in tabs", so at the start-time there is no tabs: they are created at runtime, when user clicks on the menu.

UPDATED CODE: now it seems correct, but it generates an error/exception when starts..


UPDATE-->SOLUTION

In this way it works:

<dxd:DocumentGroup Name="documentcontainer" ItemHeight="3*" ItemsSource="{Binding tabsCollection}" AllowDrag="False" AllowMove="False" AllowSplitters="False" AllowSizing="False" AllowFloat="False" ClosingBehavior="ImmediatelyRemove" SelectedTabIndex="{Binding SelectedDocumentIndex}" >
    <dxd:DocumentGroup.ItemStyle>
        <Style TargetType="dxd:DocumentPanel">
            <Setter Property="CloseCommand" Value="{Binding CloseCommand}" />
        </Style>
    </dxd:DocumentGroup.ItemStyle>
</dxd:DocumentGroup>

While CloseCommand is the same I posted when I asked this question. The key-to-solution was in the xaml.


Solution

  • You can bind your data-collection to the DockLayoutManager.ItemsSource property as shown in the MVVM Support - Building Dock UI help article. To visualize elements of the ItemsSource collection as layout items, provide templates via the ItemTemplate or ItemTemplateSelector property.