Reputation: 11867
I'm styling TabItems of a TabControl. The problem is, the style affects items of nested TabControls. Propagating styles are the only way I know to get to the TabItems. Anyone know how to style the TabItems on just the outer TabControl?
In my case, the inner tabs are defined in plugins, so I can't access them to try this answer.
Here's a demo app of my situation.
MainWindow.xaml
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1"
Title="MainWindow" Height="350" Width="525">
<Grid>
<TabControl ItemsSource="{Binding}">
<TabControl.Resources>
<Style TargetType="TabItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TabItem">
<Border Name="Border" Background="Red">
<ContentPresenter ContentSource="Header"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</TabControl.Resources>
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding TabName}" />
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<ContentControl Content="{Binding TabConent}" />
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
</Grid>
</Window>
MainWindow.xaml.cs
using System.Windows;
using System.Windows.Controls;
using System.Collections.ObjectModel;
namespace WpfApplication1
{
public partial class MainWindow : Window
{
public class TabData
{
public string TabName { get; set; }
public Label TabConent
{
get
{
// In real case, this TabControl from someone else's plugin
var content = new TabControl();
content.Items.Add(new TabItem() { Header = "Nested Tab Item" });
return new Label() { Content = content };
}
}
}
public MainWindow()
{
DataContext = new ObservableCollection<TabData>() { new TabData() { TabName = "Tab Item" } }; ;
InitializeComponent();
}
}
}
Upvotes: 0
Views: 264
Reputation: 9827
Use this, and tell if this is what you want :
<TabControl.Resources>
<Style TargetType="TabItem">
<Style.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=TabControl, AncestorLevel=2}}" Value="{x:Null}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TabItem">
<Border Name="Border" Background="Red">
<ContentPresenter ContentSource="Header"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</TabControl.Resources>
Upvotes: 1