WPF TabControl Databinding

data-binding

Question

Estoy intentando construir una interfaz de usuario WPF que contenga un TabControl y un TextBlock.

Quiero vincular estos dos controles a una colección subyacente de instancias de la siguiente clase:

class PageModel
{
  public string Title {get;set;}
  public string TabCaption {get;set;}
  public FrameworkElement TabContent {get;set}
}

El control de pestañas debe mostrar una pestaña para cada PageModel.

• El encabezado de cada pestaña debe mostrar la propiedad TabCaption
• El contenido de cada pestaña debe ser la propiedad TabContent.

El TextBlock debe mostrar el título de la pestaña actualmente seleccionada.

¿Cómo puedo lograr este resultado?

Answer 1

También encontré otra solución here usando ItemTemplate y ContentTemplate.

También para cualquier novato de WPF como yo, después de algunos dolores de cabeza y frustración me di cuenta de que la colección de modelos de página debe ser un ObservableCollection<PageModel> lugar de una List<PageModel> o cualquier cambio a la lista no se reflejará en las pestañas ( es decir, no puede agregar o eliminar una pestaña si se trata de una lista).

Answer 2

<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}"/>