WPF TabControl Databinding
28,510
Solution 1
<TabControl x:Name="_tabControl" ItemsSource="{Binding PageModels}">
<TabControl.ItemContainerStyle>
<Style TargetType="TabItem">
<Setter Property="Header" Value="{Binding TabCaption}"/>
<Setter Property="Content" Value="{Binding TabContent}"/>
</Style>
</TabControl.ItemContainerStyle>
</TabControl>
<TextBlock Text="{Binding SelectedItem.Title, ElementName=_tabControl}"/>
Solution 2
I also found another solution to this here using ItemTemplate and ContentTemplate.
Also for any WPF newbies like me, after some headaches and frustration I realized that the collection of page models needs to be an ObservableCollection<PageModel>
instead of a List<PageModel>
or any changes to the list will not be reflected by the tabs (i.e. you can't add or remove a tab if it's a list).
Author by
mackenir
Updated on September 29, 2020Comments
-
mackenir over 3 years
I'm trying to build a WPF user interface containing a TabControl, and a TextBlock.
I want to bind these two controls to an underlying collection of instances of the following class:
class PageModel { public string Title {get;set;} public string TabCaption {get;set;} public FrameworkElement TabContent {get;set} }
The tab control should display a tab for each PageModel.
- Each tab's header should display the TabCaption property
- Each tab's content should be the TabContent property.
The TextBlock should display the Title of the currently selected tab.
How can I achieve this result?