WPF ContentControl Styling - wpf

Question

How can I apply a style to the content of a contentcontrol. For example:
<Window.Resources>
<Controls:DataGrid x:Key="PersonDataGrid" AutoGenerateColumns="False" ItemsSource="{Binding .}" x:Shared="False">
<Controls:DataGrid.Columns>
<Controls:DataGridTextColumn Header="First Name" Binding="{Binding Path=FirstName}" IsReadOnly="True"/>
<Controls:DataGridTextColumn Header="Last Name" Binding="{Binding Path=LastName}" IsReadOnly="True"/>
</Controls:DataGrid.Columns>
</Controls:DataGrid>
</Window.Resources>
<StackPanel>
<ContentControl Content="{StaticResource PersonDataGrid}" DataContext="{Binding Path=Customers}" Style="DataGridStyle1"></ContentControl>
<ContentControl Content="{StaticResource PersonDataGrid}" DataContext="{Binding Path=Employees}" Style="DataGridStyle2"></ContentControl>
</StackPanel>

Answer 1

EDIT 2: It looks like you're trying to apply a different Style to each of your DataGrids. To do this, you're going to need to define their specific Style inside the Resources Section of each ContentControl. If the styles are defined elsewhere, you can always create a new style based on the style defined elsewhere as shown below
The first ContentControl's DockPanel's Background will be Black. The second's will be Blue.
<Window.Resources>
<Style TargetType="DockPanel" x:Key="DockStyle1">
<Setter Property="Background" Value="Black" />
</Style>
<Style TargetType="DockPanel" x:Key="DockStyle2">
<Setter Property="Background" Value="Blue" />
</Style>
<DockPanel x:Key="MyDockPanel">
<Rectangle Fill="Green" DockPanel.Dock="Top" Height="20" Width="50" />
<Rectangle Fill="Red" DockPanel.Dock="Top" Height="20" Width="20" />
<Rectangle Fill="Yellow" DockPanel.Dock="Bottom" Height="20" Width="50" />
</DockPanel>
</Window.Resources>
<StackPanel>
<StackPanel>
<ContentControl Content="{StaticResource MyDockPanel}">
<ContentControl.Resources>
<Style TargetType="{x:Type DockPanel}" BasedOn="{StaticResource DockStyle1}" />
</ContentControl.Resources>
</ContentControl>
<ContentControl Content="{StaticResource MyDockPanel}">
<ContentControl.Resources>
<Style TargetType="DockPanel" BasedOn="{StaticResource DockStyle2}" />
</ContentControl.Resources>
</ContentControl>
</StackPanel>
</StackPanel>
EDIT 3 - For your example, I think you want something like this (I can't test this however as I don't have access to your 'Controls' namespace):
<Window.Resources>
<Controls:DataGrid x:Key="PersonDataGrid" AutoGenerateColumns="False" ItemsSource="{Binding .}" x:Shared="False">
<Controls:DataGrid.Columns>
<Controls:DataGridTextColumn Header="First Name" Binding="{Binding Path=FirstName}" IsReadOnly="True"/>
<Controls:DataGridTextColumn Header="Last Name" Binding="{Binding Path=LastName}" IsReadOnly="True"/>
</Controls:DataGrid.Columns>
</Controls:DataGrid>
</Window.Resources>
<StackPanel>
<ContentControl Content="{StaticResource PersonDataGrid}" DataContext="{Binding Path=Customers}">
<ContentControl.Resources>
<Style TargetType="{x:Type Controls:DataGrid}" BasedOn="{StaticResource DataGridStyle1}" />
</ContentControl.Resources>
</ContentControl>
<ContentControl Content="{StaticResource PersonDataGrid}" DataContext="{Binding Path=Employees}">
<ContentControl.Resources>
<Style TargetType="{x:Type Controls:DataGrid}" BasedOn="{StaticResource DataGridStyle2}" />
</ContentControl.Resources>
</ContentControl>
</StackPanel>
Unfortunately, you cannot Style DataGridTextColumns as stated in Why can't I style a DataGridTextColumn?
Instead, I generally set the CellStyle of a DataGridTextColumn to 'style' it:
<Style TargetType="DataGridCell" x:Key="DataGridCenteredText">
<Setter Property="TextBlock.TextAlignment" Value="Center" />
</Style>
<DataGridTextColumn Header="Centered Text" CellStyle="{StaticResource DataGridCenteredText}" Binding="{Binding Path=MyData}" />
I think you'll need to define the CellStyle on a per column basis however (I can't think of any reason why you wouldn't anyway.)