We inject views. We are using prism and we add view using view injection
I am including the RadTabControl relevant styles that we use in the RD mentioned above, at the end of this post. You can see that in the RadTabItemStyle - we have added this tag :
So, ideally the background of the TabItem should be this ResourceBrush, but for some reason, the TabItem doesn't get this background color.
<
Thickness
x:Key
=
"TabItem_Margin"
>0</
Thickness
>
<
Thickness
x:Key
=
"TabItem_Margin_Selected"
>0</
Thickness
>
<
ControlTemplate
x:Key
=
"MainTabItemTemplate"
TargetType
=
"telerik:RadTabItem"
>
<
Grid
x:Name
=
"wrapper"
>
<
VisualStateManager.VisualStateGroups
>
<
VisualStateGroup
x:Name
=
"CommonStateGroup"
>
<
VisualState
x:Name
=
"Normal"
/>
<
VisualState
x:Name
=
"MouseOver"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
Storyboard.TargetName
=
"MouseOverVisual"
Storyboard.TargetProperty
=
"(UIElement.Opacity)"
To
=
"1"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Selected"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
Storyboard.TargetName
=
"SelectionVisual"
Storyboard.TargetProperty
=
"(UIElement.Opacity)"
To
=
"1"
/>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"HeaderElement"
Storyboard.TargetProperty
=
"Foreground"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"{telerik:Office2013Resource ResourceKey=AccentMainBrush}"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"SelectedMouseOver"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
Storyboard.TargetName
=
"SelectionVisual"
Storyboard.TargetProperty
=
"(UIElement.Opacity)"
To
=
"1"
/>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"SelectionVisual"
Storyboard.TargetProperty
=
"BorderBrush"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"{telerik1:Office2013Resource ResourceKey=AccentMainBrush}"
/>
</
ObjectAnimationUsingKeyFrames
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"HeaderElement"
Storyboard.TargetProperty
=
"Foreground"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"{telerik:Office2013Resource ResourceKey=AccentMainBrush}"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Disabled"
>
<
Storyboard
>
<
DoubleAnimation
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"HeaderElement"
To
=
"0.3"
Duration
=
"0:0:0.1"
/>
<
DoubleAnimation
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"NormalVisual"
To
=
"0"
Duration
=
"0:0:0.1"
/>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"PlacementStates"
>
<
VisualState
x:Name
=
"HorizontalTop"
/>
<
VisualState
x:Name
=
"HorizontalLeft"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"OrientationTransform"
Storyboard.TargetProperty
=
"LayoutTransform"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"180"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"HorizontalRight"
/>
<
VisualState
x:Name
=
"HorizontalBottom"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"OrientationTransform"
Storyboard.TargetProperty
=
"LayoutTransform"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"180"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"VerticalTop"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"OrientationTransform"
Storyboard.TargetProperty
=
"LayoutTransform"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"-90"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"VerticalLeft"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"OrientationTransform"
Storyboard.TargetProperty
=
"LayoutTransform"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"90"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"VerticalRight"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"OrientationTransform"
Storyboard.TargetProperty
=
"LayoutTransform"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"-90"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"VerticalBottom"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"OrientationTransform"
Storyboard.TargetProperty
=
"LayoutTransform"
Duration
=
"0"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"-90"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"FocusStates"
>
<
VisualState
x:Name
=
"Unfocused"
/>
<
VisualState
x:Name
=
"Focused"
/>
</
VisualStateGroup
>
</
VisualStateManager.VisualStateGroups
>
<
Border
x:Name
=
"NormalVisual"
Margin
=
"{StaticResource TabItem_Margin}"
BorderBrush
=
"{TemplateBinding BorderBrush}"
Background
=
"{TemplateBinding Background}"
BorderThickness
=
"{TemplateBinding BorderThickness}"
/>
<
Border
x:Name
=
"MouseOverVisual"
Opacity
=
"0"
Margin
=
"{StaticResource TabItem_Margin}"
BorderBrush
=
"{telerik1:Office2013Resource ResourceKey=AccentMainBrush}"
BorderThickness
=
"{StaticResource TabItem_OuterBorderThickness}"
Background
=
"{telerik1:Office2013Resource ResourceKey=MainBrush}"
CornerRadius
=
"{StaticResource TabItem_OuterCornerRadius}"
/>
<
Border
x:Name
=
"SelectionVisual"
Opacity
=
"0"
Margin
=
"{StaticResource TabItem_Margin_Selected}"
Background
=
"{telerik1:Office2013Resource ResourceKey=MainBrush}"
BorderBrush
=
"{telerik1:Office2013Resource ResourceKey=HighDarkBrush}"
BorderThickness
=
"{StaticResource TabItem_OuterBorderThickness}"
CornerRadius
=
"{StaticResource TabItem_OuterCornerRadius}"
/>
<
telerikPrimitives:LayoutTransformControl
x:Name
=
"OrientationTransform"
>
<
Grid
>
<
ContentControl
x:Name
=
"HeaderElement"
IsTabStop
=
"False"
Content
=
"{TemplateBinding Header}"
ContentTemplate
=
"{TemplateBinding HeaderTemplate}"
Foreground
=
"{TemplateBinding HeaderForeground}"
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
Margin
=
"{TemplateBinding Padding}"
ContentStringFormat
=
"{TemplateBinding HeaderStringFormat}"
ContentTemplateSelector
=
"{TemplateBinding HeaderTemplateSelector}"
SnapsToDevicePixels
=
"True"
/>
<
telerik:RadButton
Grid.Row
=
"0"
Style
=
"{DynamicResource tabCloseButtonStyle}"
/>
</
Grid
>
</
telerikPrimitives:LayoutTransformControl
>
</
Grid
>
</
ControlTemplate
>
<
Style
x:Key
=
"mainTabItemStyle"
TargetType
=
"telerik:RadTabItem"
BasedOn
=
"{StaticResource RadTabItemStyle}"
>
<
Setter
Property
=
"Background"
Value
=
"{telerik:VisualStudio2013Resource ResourceKey=AccentDarkBrush}"
/>
<
Setter
Property
=
"BorderThickness"
Value
=
"1"
/>
<
Setter
Property
=
"Height"
Value
=
"75"
/>
<
Setter
Property
=
"Width"
Value
=
"100"
/>
<
Setter
Property
=
"Margin"
Value
=
"0 0 0.5 0"
/>
<
Setter
Property
=
"Template"
Value
=
"{StaticResource MainTabItemTemplate}"
/>
</
Style
>
<
ControlTemplate
x:Key
=
"TabControlTemplate"
TargetType
=
"telerikNavigation:RadTabControl"
>
<
Grid
>
<
VisualStateManager.VisualStateGroups
>
<
VisualStateGroup
x:Name
=
"CommonStates"
>
<
VisualState
x:Name
=
"Disabled"
/>
<
VisualState
x:Name
=
"Normal"
/>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"DropDownDisplayStates"
>
<
VisualState
x:Name
=
"DropDownButtonCollapsed"
/>
<
VisualState
x:Name
=
"DropDownButtonVisible"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"DropDownButtonElement"
Storyboard.TargetProperty
=
"Visibility"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
Visibility
>Visible</
Visibility
>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"PlacementStates"
>
<
VisualState
x:Name
=
"Left"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"HeaderDockedElement"
Storyboard.TargetProperty
=
"LayoutTransform"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"-90"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"ContentBorder"
Storyboard.TargetProperty
=
"BorderThickness"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
Thickness
>0 1 1 1</
Thickness
>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Right"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"HeaderDockedElement"
Storyboard.TargetProperty
=
"LayoutTransform"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"90"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"ContentBorder"
Storyboard.TargetProperty
=
"BorderThickness"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
Thickness
>1 1 0 1</
Thickness
>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Top"
/>
<
VisualState
x:Name
=
"Bottom"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"HeaderDockedElement"
Storyboard.TargetProperty
=
"LayoutTransform"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
RotateTransform
Angle
=
"180"
/>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"ContentBorder"
Storyboard.TargetProperty
=
"BorderThickness"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
Thickness
>1 1 1 0</
Thickness
>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
</
VisualStateManager.VisualStateGroups
>
<
telerik:RadDockPanel
LastChildFill
=
"True"
>
<
telerikPrimitives:LayoutTransformControl
x:Name
=
"HeaderDockedElement"
telerik:RadDockPanel.Dock
=
"Top"
>
<
Grid
SnapsToDevicePixels
=
"True"
x:Name
=
"grid"
>
<
Border
x:Name
=
"HeaderBackground"
Background
=
"{TemplateBinding HeaderBackground}"
Visibility
=
"{TemplateBinding BackgroundVisibility}"
/>
<!--<Border BorderThickness="0 0 0 2" BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=AccentDarkBrush}"/>-->
<
telerik:RadDockPanel
Panel.ZIndex
=
"10"
>
<
ContentPresenter
Content
=
"{TemplateBinding AdditionalContent}"
telerik:RadDockPanel.Dock
=
"Right"
Margin
=
"0 4 0 2"
/>
<
ToggleButton
x:Name
=
"DropDownButtonElement"
Visibility
=
"Collapsed"
telerik:RadDockPanel.Dock
=
"Right"
Style
=
"{TemplateBinding DropDownButtonStyle}"
ClickMode
=
"Press"
IsChecked
=
"{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
>
<
telerikNavigation:RadContextMenu.ContextMenu
>
<
telerikTabControl:DropDownMenu
x:Name
=
"DropDownMenuElement"
StaysOpen
=
"False"
Placement
=
"Bottom"
Style
=
"{TemplateBinding DropDownStyle}"
ItemTemplate
=
"{TemplateBinding ItemDropDownContentTemplate}"
ItemTemplateSelector
=
"{TemplateBinding ItemDropDownContentTemplateSelector}"
DisplayMemberPath
=
"{TemplateBinding DropDownDisplayMemberPath}"
HorizontalOffset
=
"2"
VerticalOffset
=
"2"
/>
</
telerikNavigation:RadContextMenu.ContextMenu
>
</
ToggleButton
>
<
RepeatButton
x:Name
=
"LeftScrollButtonElement"
Style
=
"{StaticResource ScrollButtonStyle}"
Margin
=
"2 4 2 4"
/>
<
RepeatButton
x:Name
=
"RightScrollButtonElement"
Style
=
"{StaticResource ScrollButtonStyle}"
telerik:RadDockPanel.Dock
=
"Right"
RenderTransformOrigin
=
"0.5 0.5"
Margin
=
"2 4 0 4"
>
<
RepeatButton.RenderTransform
>
<
ScaleTransform
ScaleX
=
"-1"
/>
</
RepeatButton.RenderTransform
>
</
RepeatButton
>
<
ScrollViewer
Style
=
"{StaticResource EmptyScrollViewerStyle}"
VerticalScrollBarVisibility
=
"Disabled"
BorderThickness
=
"0"
IsTabStop
=
"False"
HorizontalScrollBarVisibility
=
"{Binding (ScrollViewer.HorizontalScrollBarVisibility), RelativeSource={RelativeSource TemplatedParent}}"
Margin
=
"0"
x:Name
=
"ScrollViewerElement"
>
<
ItemsPresenter
/>
</
ScrollViewer
>
</
telerik:RadDockPanel
>
</
Grid
>
</
telerikPrimitives:LayoutTransformControl
>
<
Border
x:Name
=
"ContentBorder"
BorderBrush
=
"{TemplateBinding BorderBrush}"
BorderThickness
=
"{Binding RelativeSource={RelativeSource TemplatedParent}, Path=BorderThickness, Mode=TwoWay}"
Background
=
"{TemplateBinding Background}"
Padding
=
"{TemplateBinding Padding}"
>
<
Grid
>
<
ContentPresenter
x:Name
=
"ContentElement"
Visibility
=
"{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsContentPreserved,Converter={StaticResource InvertBoolToVisConverter}}"
ContentTemplate
=
"{TemplateBinding SelectedContentTemplate}"
ContentTemplateSelector
=
"{TemplateBinding SelectedContentTemplateSelector}"
/>
<
Grid
x:Name
=
"ContentElementsPanel"
Visibility
=
"{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsContentPreserved, Converter={StaticResource BoolToVisConverter}}"
/>
</
Grid
>
</
Border
>
</
telerik:RadDockPanel
>
</
Grid
>
<
ControlTemplate.Triggers
>
<
Trigger
Property
=
"HasItems"
Value
=
"False"
>
<
Setter
Property
=
"Visibility"
TargetName
=
"grid"
Value
=
"Collapsed"
/>
</
Trigger
>
<
Trigger
Property
=
"HasItems"
Value
=
"True"
>
<
Setter
Property
=
"Visibility"
TargetName
=
"grid"
Value
=
"Visible"
/>
</
Trigger
>
</
ControlTemplate.Triggers
>
</
ControlTemplate
>
<
Style
x:Key
=
"mainTabControlStyle"
TargetType
=
"telerik:RadTabControl"
BasedOn
=
"{StaticResource RadTabControlStyle}"
>
<
Setter
Property
=
"BorderThickness"
Value
=
"0.5 0 0.5 0.5"
/>
<
Setter
Property
=
"HeaderBackground"
Value
=
"Transparent"
/>
<
Setter
Property
=
"Template"
Value
=
"{StaticResource TabControlTemplate}"
/>
<
Setter
Property
=
"ItemContainerStyle"
Value
=
"{StaticResource mainTabItemStyle}"
/>
</
Style
>
Thanks.