I have custom ContentControl called TabItem
public class TabItem : ContentControl
I have set the ContentTemplate to a dynamic resource coming from a resource dictionary
<TabItem Header="Search" Content="{Binding Path=SearchRibbon}" ContentTemplate="{DynamicResource SearchRibbonTemplate}" />
Using this approach I am utilizing the MVVM design pattern and the Content property successfuly binds to the viewmodel’s… and the program builds successfuly and runs but without the content from within the datatemplate that the contenttemplate should be pulling in.
<DataTemplate x:Key="SearchRibbonTemplate">
<ItemsControl ItemsSource="{Binding}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<TabGroupBox Header="{Binding Path=DisplayName}" Width="100">
<TabButton Width="100" Icon="{Binding Path=TemplateResource}" LargeIcon="{Binding Path=TemplateResource}" Command="{Binding Path=Commands}" />
</TabGroupBox>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
If I use a content control as it is, this approach has always worked. Why wouldn’t a custom contentcontrol not work with the ContentTemplate property?
Cheers.
EDIT
<Style x:Key="RibbonTabItemStyle" TargetType="{x:Type Ribbon_Framework:TabItem}">
<Style.Triggers>
<Trigger Property="Group" Value="{x:Null}">
<Setter Property="BorderBrush" Value="{StaticResource RibbonTopBorderBrush}" />
</Trigger>
<Trigger Property="Selector.IsSelected" Value="False">
<Setter Property="Foreground" Value="{StaticResource TabItemFontBrush}" />
</Trigger>
</Style.Triggers>
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="Height" Value="31" />
<Setter Property="IsMinimized" Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Ribbon_Framework:RibbonTabControl}}, Path=IsMinimized, Mode=OneWay, FallbackValue=False}" />
<Setter Property="IsOpen" Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Ribbon_Framework:RibbonTabControl}}, Path=IsDropDownOpen, Mode=OneWay, FallbackValue=True}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Ribbon_Framework:TabItem}">
<Grid x:Name="grid" Background="#00000000" Height="24" VerticalAlignment="Top" Margin="0,7,0,0">
<Border x:Name="border3" Margin="2,0,0,1" BorderThickness="1,0" Grid.ColumnSpan="2">
<Border.BorderBrush>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#CCFFFFFF" Offset="0" />
<GradientStop Offset="1" Color="#7FFFFFFF" />
</LinearGradientBrush>
</Border.BorderBrush>
<Border x:Name="border4" BorderBrush="{Binding Group.BorderBrush, RelativeSource={RelativeSource TemplatedParent}}" BorderThickness="1,0">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0" />
<GradientStop Color="#00000000" Offset="0.981" />
</LinearGradientBrush>
</Border.OpacityMask>
<Border Background="{Binding Group.Background, RelativeSource={RelativeSource TemplatedParent}}" BorderThickness="0" Margin="0">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#59000000" Offset="0" />
<GradientStop Color="#00000000" Offset="1" />
</LinearGradientBrush>
</Border.OpacityMask>
<Rectangle x:Name="rectangle4" Fill="#3FD2D2D2" StrokeThickness="0">
<Rectangle.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#7F000000" Offset="0" />
<GradientStop Color="#00000000" Offset="1" />
</LinearGradientBrush>
</Rectangle.OpacityMask>
</Rectangle>
</Border>
</Border>
</Border>
<Grid x:Name="selectedGrid" Visibility="Collapsed" Margin="2,0,0,0" Grid.ColumnSpan="1">
<Rectangle x:Name="rectangle" Fill="{StaticResource ActiveTabBackgroundBrush}" Stroke="{x:Null}" StrokeThickness="0" Margin="0" VerticalAlignment="Bottom" Height="1" />
<Rectangle x:Name="rectangle1" Fill="{StaticResource ActiveTabBackgroundBrush}" Stroke="{x:Null}" StrokeThickness="0" Margin="1.8,0" VerticalAlignment="Bottom" Height="1.2" />
<Rectangle x:Name="rectangle2" Fill="{StaticResource ActiveTabBackgroundBrush}" Stroke="{x:Null}" StrokeThickness="0" Margin="2,0" VerticalAlignment="Bottom" Height="2" />
<Border x:Name="border" Margin="1,0,1,2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{StaticResource ActiveTabBackgroundBrush}">
<Border x:Name="border_Copy3" Margin="0" BorderThickness="1,1,1,0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{x:Null}" BorderBrush="{StaticResource ActiveTabBackgroundBrush}">
<Border x:Name="border_Copy4" Margin="0,0,-2,-1" BorderThickness="0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{Binding Group.Background, RelativeSource={RelativeSource TemplatedParent}}" BorderBrush="{x:Null}">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#3F000000" Offset="0" />
<GradientStop Color="#00000000" Offset="0.59" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
</Border>
</Border>
<Border x:Name="border1" HorizontalAlignment="Left" Margin="0" VerticalAlignment="Bottom" Width="2" Height="2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0,0,1,1" CornerRadius="0,0,2,0" />
<Border x:Name="border2" HorizontalAlignment="Right" Margin="0" VerticalAlignment="Bottom" Width="2" Height="2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,0,0,1" CornerRadius="0,0,0,2" />
<Rectangle x:Name="rectangle3" StrokeThickness="0" Margin="7,-7,7,0" VerticalAlignment="Top" Height="14" IsHitTestVisible="False">
<Rectangle.Fill>
<RadialGradientBrush Center="0.498,0.501" GradientOrigin="0.498,0.501" RadiusY="0.464">
<GradientStop Color="#7FFFFFFF" Offset="0" />
<GradientStop Offset="1" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
</Grid>
<Grid x:Name="hoverGrid" Margin="2,0,0,0" Visibility="Collapsed" Grid.ColumnSpan="1">
<Border x:Name="border_Copy" Margin="1,0,1,1" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{x:Null}">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#CC000000" Offset="0" />
<GradientStop Color="#F7FFFFFF" Offset="0.985" />
</LinearGradientBrush>
</Border.OpacityMask>
<Border x:Name="border_Copy1" Margin="0" BorderBrush="{StaticResource ActiveTabBackgroundBrush}" BorderThickness="1,1,1,0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{x:Null}">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#CCFFFFFF" Offset="0" />
<GradientStop Color="#F7FFFFFF" Offset="1" />
</LinearGradientBrush>
</Border.OpacityMask>
<Border x:Name="border_Copy2" Margin="0" BorderBrush="{x:Null}" BorderThickness="0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{StaticResource ActiveTabBackgroundBrush}">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#7FFFFFFF" Offset="0.004" />
<GradientStop Offset="0.5" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
</Border>
</Border>
</Grid>
<Grid x:Name="focusedGrid" Margin="2,0,0,0" Visibility="Collapsed" Grid.ColumnSpan="1">
<Grid.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Offset="1" Color="#19FFFFFF" />
</LinearGradientBrush>
</Grid.OpacityMask>
<Border x:Name="border_Copy5" Margin="1,0,1,1" BorderThickness="1,1,1,0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{StaticResource ButtonHoverOuterBackgroundBrush}" BorderBrush="{StaticResource ButtonHoverOuterBorderBrush}">
<Border x:Name="border_Copy6" Margin="0" BorderBrush="{StaticResource ButtonHoverInnerBorderBrush}" BorderThickness="1,1,1,0" VerticalAlignment="Stretch" CornerRadius="2,2,0,0" Background="{StaticResource ButtonHoverInnerBackgroundBrush}" />
</Border>
</Grid>
<Border x:Name="PART_ContentContainer" HorizontalAlignment="Stretch" Margin="6,2,4,2" VerticalAlignment="Stretch" Padding="15,0,0,0" Grid.ColumnSpan="1">
<Label x:Name="contentPresenter" AutomationProperties.Name="{TemplateBinding Header}" AutomationProperties.AutomationId="{TemplateBinding Name}" Content="{TemplateBinding Header}" Margin="0, -3, 0,0" HorizontalAlignment="Center" VerticalAlignment="Center" Height="Auto" />
</Border>
<Grid x:Name="separatorGrid" Margin="0" Visibility="Collapsed" HorizontalAlignment="Right" Width="2" Grid.Column="1">
<Rectangle x:Name="separatorRectangle1" Fill="{StaticResource RibbonTopBorderBrush}" Stroke="{StaticResource RibbonTopBorderBrush}" Margin="0,0,1,0" HorizontalAlignment="Right" Width="1" Opacity="1" Visibility="Visible">
<Rectangle.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#00000000" Offset="0" />
<GradientStop Color="#E5FFFFFF" Offset="0.382" />
</LinearGradientBrush>
</Rectangle.OpacityMask>
</Rectangle>
<Rectangle x:Name="separatorRectangle2" Fill="{StaticResource ActiveTabBackgroundBrush}" Stroke="{StaticResource ActiveTabBackgroundBrush}" HorizontalAlignment="Right" Margin="0" Width="1" Opacity="1" Visibility="Visible">
<Rectangle.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#00000000" Offset="0" />
<GradientStop Color="#BFFFFFFF" Offset="0.329" />
</LinearGradientBrush>
</Rectangle.OpacityMask>
</Rectangle>
</Grid>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Opacity" TargetName="contentPresenter" Value="0.5" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasRightGroupBorder" Value="False" />
<Condition Property="HasLeftGroupBorder" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="BorderThickness" TargetName="border3" Value="1,0,0,0" />
<Setter Property="BorderThickness" TargetName="border4" Value="1,0,0,0" />
<Setter Property="Margin" TargetName="rectangle4" Value="0" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasLeftGroupBorder" Value="False" />
<Condition Property="HasRightGroupBorder" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="BorderThickness" TargetName="border4" Value="0,0,1,0" />
<Setter Property="BorderThickness" TargetName="border3" Value="0,0,1,0" />
<Setter Property="Margin" TargetName="rectangle4" Value="0" />
<Setter Property="Margin" TargetName="border3" Value="0,0,0,1" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="HasLeftGroupBorder" Value="False" />
<Condition Property="HasRightGroupBorder" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="BorderThickness" TargetName="border4" Value="0,0,0,0" />
<Setter Property="BorderThickness" TargetName="border3" Value="0,0,0,0" />
<Setter Property="Margin" TargetName="rectangle4" Value="0" />
<Setter Property="Margin" TargetName="border3" Value="0,0,0,1" />
</MultiTrigger>
<Trigger Property="Group" Value="{x:Null}">
<Setter Property="Visibility" TargetName="border3" Value="Collapsed" />
<Setter Property="Margin" TargetName="separatorGrid" Value="-1,0,0,1" />
<Setter Property="Visibility" TargetName="border_Copy3" Value="Collapsed" />
<Setter Property="Visibility" TargetName="rectangle3" Value="Collapsed" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected" Value="True" />
<Condition Property="IsMinimized" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="selectedGrid" Value="Visible" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="Selector.IsSelected" Value="False" />
<Condition Property="IsMinimized" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="hoverGrid" Value="Visible" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="IsMinimized" Value="True" />
<Condition Property="IsOpen" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="hoverGrid" Value="Visible" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected" Value="True" />
<Condition Property="IsMinimized" Value="True" />
<Condition Property="IsOpen" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="hoverGrid" Value="Visible" />
<Setter Property="Background" TargetName="grid" Value="#00000000" />
</MultiTrigger>
<Trigger Property="IsSeparatorVisible" Value="True">
<Setter Property="Visibility" TargetName="separatorGrid" Value="Visible" />
<Setter Property="Margin" TargetName="PART_ContentContainer" Value="6,2" />
<Setter Property="Margin" TargetName="hoverGrid" Value="2,0" />
<Setter Property="Margin" TargetName="selectedGrid" Value="2,0" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Indent" Value="12" />
<Setter Property="Foreground" Value="{StaticResource TabItemSelectedFontBrush}" />
<Setter Property="FontFamily" Value="{StaticResource DefaultFontFamily}" />
<Setter Property="FontSize" Value="{StaticResource DefaultFontSize}" />
<Setter Property="Margin" Value="0" />
<Setter Property="BorderBrush" Value="{Binding Group.BorderBrush, RelativeSource={RelativeSource Self}}" />
<Setter Property="FocusVisualStyle" Value="{StaticResource ControlStyleEmptyFocus}" />
</Style>
After correspondence with one of the developers that build the Fluent Ribbon library that I’m revamping, he noted that in order to achieve this design it will take more then just modifying the ContentPresenter and a full rework would be necessary. This being the case, he had suggested that building a list of ViewModels that derrive from each other’s control will provide the design I am look for.
Thanks for everyones answers, but the difficult way seems to be the easy way in this scenario.
Cheers.