MVVM - UI Tabbed with each Tab has a different View/ViewModel

4 posts, 0 answers
  1. Guillaume
    Guillaume avatar
    39 posts
    Member since:
    Nov 2010

    Posted 21 Feb 2011 Link to this post

    Hello,


    In my project, i have to create an administration interface with a menu. At each clic on this menu, a new tab will open.
    Because, i am in MVVM, each tab is a ViewModel different (which inherit from the same ViewModel base class) and a View different.

    I have define an ItemTemplate for override the header but it's common for all tabs instead of the content is not.
    My TabControl is binded to an ObservableCollection of ViewModel base class.


    I had open your C# example but in it, all tabs have the same content template.


    So, how can i load the right view in interface according to its ViewModel ?

    I use MVVM-Light and many thinks for your help !


    Regards,
    Guillaume
  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 21 Feb 2011 Link to this post

    Hello Guillaume,


    Please excuse me for the unfinished example. Here you can find the modified sample showing the usual use of DataTemplateSelectors. Check it out and let me know how it goes. Thank you for your cooperation.

    Kind regards,
    Petar Mladenov
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  3. DevCraft banner
  4. Guillaume
    Guillaume avatar
    39 posts
    Member since:
    Nov 2010

    Posted 22 Feb 2011 Link to this post

    Hello Petar,

    Thanks for your help.
    I saw your example and try to do same thing but it doesn't work.

    My RabTabControl is like that :
    <telerik:RadTabControl Grid.Row="2"
                                   Margin="0,10,0,0"
                                   BackgroundVisibility="Collapsed"
                                   ItemsSource="{Binding ViewModelsTab}"
                                   SelectedIndex="{Binding SelectedTabIndex}"
                                   ItemTemplate="{StaticResource TabHeaderTemplate}"
                                   ContentTemplateSelector="{StaticResource ViewTemplateSelector}"/>

    The ItemsSource is binded to : 
    public ObservableCollection<TabViewModelBase> ViewModelTabItems

    which is in my ViewModel.

    I have created a class that extends your DataTemplateSelector and overrides the Select method. It is in my App.xaml like that :
    <res:ViewSelector x:Key="ViewTemplateSelector" />

    For testing, in my ViewModel of MainPage (which contains my ObservableCollection), i add a TabViewModelBase to my collection, so i should pass in Select method of ViewSelector but, in debug, my breapoint is never fired.

    Where i'm wrong ?


    Regards,
    Guillaume
  5. Guillaume
    Guillaume avatar
    39 posts
    Member since:
    Nov 2010

    Posted 22 Feb 2011 Link to this post

    Shame on me !

    In xaml, on ItemsSource property, i have put the old name of ObservableCollection.

Back to Top