Hi,
I need to create Tabs inside a tab control dynamically. Each Tab is a usercontrol with respective data. I guess it is simple if we use ItemTemplates. But I am not able to figure out how to make it work. Can anyone provide me with a simple sample application which does it.
If anyone can explain it using the Prism that would be great.
Thanks
Hello,
You do not actually need the ItemTemplate. The ItemTemplate is used to apply a DataTemplate to the items of the items control - in this case it will be the tab items. As your requirement is to template the content of the selected tab as another XamTabControl, you need the ContentTemplate of the XamTabControl. Below you can find a simple code snippet of this :
<igWindows:XamTabControl ItemsSource="{Binding}" >
<igWindows:XamTabControl.ContentTemplate>
<DataTemplate>
<igWindows:XamTabControl ItemsSource="{Binding Interests}"/>
</DataTemplate>
</igWindows:XamTabControl.ContentTemplate>
</igWindows:XamTabControl>
Hello Andre,
Thank you for your post. I have been looking into it, but it seems like that I am missing something in your scenario, so if this is still an issue for you, could you please send an isolated sample project, where the issue is reproduced, so I can investigate it further for you.
Looking forward for your reply.
Stefan, what specifically is missing. I have a ViewModel and corresponding UserControl that hosts a XamTabControl. Within this 'main' ViewModel I define the OvservableCollection (the following structure encapsulating information about the tab):
public class TabModel { public TabModel(string tabname, ViewModelBase vm) { this.TabName = tabname; this.ViewModel = vm; } public string TabName { get; set; } public ViewModelBase ViewModel { get; set; } }
Two parameters for binding - TabName (bound to tab header) and ViewModel (BaseViewModel class instance that will be passed into the tab's content UserControl for loading data). On the Xaml side I'm binding the ItemSource of the tab control to the ObservableCollection but I am unsure how to bind the viewmodel so that it loads the correct user control based on the ViewModel type.Typically this is done defining DataTemplate that will associate ViewModel with the user control. Similar to this:
<TabControl.Resources> <DataTemplate DataType="{x:Type vm:ViewModel1}"> <uc:UserControlView1/> </DataTemplate> <DataTemplate DataType="{x:Type vm:ViewModel2}"> <uc:UserControlView2/> </DataTemplate> </TabControl.Resources>
However in this case this isn't happening - I am seeing the tabs with correct headers but no content user control. Can you provide the best way to accomplish this? A sample would be appreciated.
Andre
I have been looking into the sample and I tested it with the RTM of version 10.2 and the issue you described occurred there. I also tested it with teh latest service relase of 10.2 (10.2.20102.2350) and the issue was fixed there, so I can suggest you download it by logging to our web site and going to Account \Keys & Downloads.
Hope this helps you.
I upgraded to SR 2350 as you recommended but I still get the same issue. Updated project is attached.
http://www.flickr.com/photos/andrebii/9417802590/
The problem had nothing to do with version of the controls. I did manage to find my mistake and refactored the code to get it working and binding correctly. I should have used a collection of ViewModels in my ObservableCollection and slightly modified Xaml. Working code is attached for those interested in easy way to get Tabs working.
Thank you for your feedback. I am glad that you resolved your issue and I believe that other community members may benefit from this as well.
Thanks again.