Change color of titlebar when two toolbarWindos are floating in HostingWindow

Comments (6)

Posted 7 years ago by Actipro Software Support - Cleveland, OH, USA

Hello,

The protected virtual DockSite.InitializeFloatingWindow method is called when a WPF Window is created to contain a floating dock host. At the time that method is called, a WindowChrome instance should already be attached to the window. WindowChrome lets you set a StyleKey which is a resource key in Application.Resources to use as an alternate Window Style. That's the only way you'd be able to customize the appearance.

Actipro Software Support

Posted 7 years ago by Emir Dizdarevic

Thanks for the answer not sure, if I understand the whole concept. This is what I have tried:

<system:Boolean x:Key="{x:Static themes:AssetResourceKeys.WindowHasOuterGlowBooleanKey}">True</system:Boolean>
<system:Double x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabItemSpacingNormalDoubleKey}">-1</system:Double>
<system:Double x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemSpacingNormalDoubleKey}">-1</system:Double>
<shared:ElementChromeBorderStyle x:Key="{x:Static themes:AssetResourceKeys.StandardMdiElementChromeBorderStyleKey}">None</shared:ElementChromeBorderStyle>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.AutoHideTabItemBorderNormalCornerRadiusKey}">3,3,0,0</CornerRadius>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarBorderNormalCornerRadiusKey}">2</CornerRadius>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.RaftingWindowBorderNormalCornerRadiusKey}">2</CornerRadius>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabControlBorderHighlightedCornerRadiusKey}">3</CornerRadius>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabItemBorderNormalCornerRadiusKey}">3,3,0,0</CornerRadius>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBorderNormalCornerRadiusKey}">3,3,0,0</CornerRadius>
<CornerRadius x:Key="{x:Static themes:AssetResourceKeys.WindowBorderNormalCornerRadiusKey}">2</CornerRadius>
<system:String x:Key="{x:Static themes:AssetResourceKeys.ThemeNameStringKey}">AeroNormalColor</system:String>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.AutoHideTabItemMarginNormalThicknessKey}">0,0,-1,0</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.StandardMdiBorderNormalThicknessKey}">0</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabControlBorderNormalThicknessKey}">1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabControlHeaderBottomMarginNormalThicknessKey}">4,-1,4,0</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabControlHeaderTopMarginNormalThicknessKey}">4,0,4,-1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabControlPaddingNormalThicknessKey}">4</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabItemBorderNormalThicknessKey}">1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabItemBottomMarginNormalThicknessKey}">0,1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.TabbedMdiContainerTabItemTopMarginNormalThicknessKey}">0,1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabControlBorderNormalThicknessKey}">1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabControlHeaderBottomMarginNormalThicknessKey}">0,1,0,0</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabControlHeaderTopMarginNormalThicknessKey}">0,1,0,2</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBottomMarginNormalThicknessKey}">0,1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemTopMarginNormalThicknessKey}">0,1</Thickness>
<Thickness x:Key="{x:Static themes:AssetResourceKeys.WindowResizeBorderNormalThicknessKey}">0.5</Thickness>

<!--

BRUSHES

-->

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerBackgroundNormalBrushKey}" themes:TintGroup.Name="DockingWindowContainer"
Color="{DynamicResource ToolWindowBackgroundColor}" />

<LinearGradientBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarBackgroundActiveBrushKey}" themes:TintGroup.Name="DockingWindowContainerTitleBar"
StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="{DynamicResource ComboBoxHighlightBackground}" Offset="0.08" />
<GradientStop Color="{DynamicResource ComboBoxHighlightBackground}" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarBackgroundInactiveBrushKey}" themes:TintGroup.Name="DockingWindowContainerTitleBar"
StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="{DynamicResource TabBackgroundColor}" Offset="0.08" />
<GradientStop Color="{DynamicResource TabBackgroundColor}" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarForegroundActiveBrushKey}" themes:TintGroup.Name="DockingWindowContainerTitleBar"
Color="{DynamicResource ComboBoxHighlightText}" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarForegroundInactiveBrushKey}" themes:TintGroup.Name="DockingWindowContainerTitleBar"
Color="{DynamicResource ComboBoxHighlightText}" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarGlyphBackgroundActiveBrushKey}" themes:TintGroup.Name="DockingWindowContainerTitleBar"
Color="{DynamicResource ComboBoxHighlightText}" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowContainerTitleBarGlyphBackgroundInactiveBrushKey}" themes:TintGroup.Name="DockingWindowContainerTitleBar"
Color="{DynamicResource ComboBoxHighlightText}" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.DockingWindowPreviewBackgroundNormalBrushKey}" themes:TintGroup.Name="DockingWindowPreview"
Color="{DynamicResource ComboBoxHighlightText}" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabControlForegroundNormalBrushKey}" themes:TintGroup.Name="ToolWindowContainerTabItem"
Color="LightGreen" />
<LinearGradientBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBackgroundHoverBrushKey}" themes:TintGroup.Name="ToolWindowContainerTabItem"
StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="LightGreen" Offset="0" />
<GradientStop Color="Blue" Offset="0.5" />
<GradientStop Color="Green" Offset="0.51" />
<GradientStop Color="#FFEAF6FD" Offset="0.95" />
<GradientStop Color="#FFFAFDFE" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<LinearGradientBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBackgroundNormalBrushKey}" themes:TintGroup.Name="ToolWindowContainerTabItem"
StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="LightGreen" Offset="0" />
<GradientStop Color="LightGreen" Offset="0.5" />
<GradientStop Color="LightGreen" Offset="0.51" />
<GradientStop Color="LightGreen" Offset="0.95" />
<GradientStop Color="LightGreen" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBackgroundSelectedBrushKey}" themes:TintGroup.Name="ToolWindowContainerTabItem"
Color="Green" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBorderHoverBrushKey}" themes:TintGroup.Name="ToolWindowContainerTabItem"
Color="Blue" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.ToolWindowContainerTabItemBorderNormalBrushKey}" themes:TintGroup.Name="ToolWindowContainerTabItem"
Color="MediumVioletRed" />

<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.WorkspaceVeryDarkBackgroundNormalBrushKey}" themes:TintGroup.Name="Workspace"
Color="{DynamicResource TabBackgroundColor}" />
<SolidColorBrush PresentationOptions:Freeze="True" x:Key="{x:Static themes:AssetResourceKeys.WorkspaceVeryDarkForegroundNormalBrushKey}" themes:TintGroup.Name="Workspace"
Color="{DynamicResource TabBackgroundColor}" />

I have tried adding this as a global resource for my application, and it works for the docksite and toolwindows.

Posted 7 years ago by Actipro Software Support - Cleveland, OH, USA

Hello,

Sorry, I might have misunderstood what you meant. Please clarify which of the following you are trying to do. Do you wish to alter the appearance of:

1) ToolWindowContainer title bars everywhere in the app.

2) ToolWindowContainer title bars only on floating dock hosts.

3) The floating dock host title bar that appears when two floating tool windows are docked next to each other (two ToolWindowContainers with a splitter in between) in a floating dock host.

I had thought you meant #3, which is the toughest to handle, but perhaps you mean #2 instead?

Actipro Software Support

Posted 7 years ago by Emir Dizdarevic

Yes, you are correct I am trying to do number three. My problem is that I already have a style, and styling of toolwindows works fine. I am not sure how I can reach the virtual Docksite.initializeFloatingWindow. Because I only have a usercontroller that has a docksite, and I create the toolwindows from code behind. I have tried adding a style that styles the window from the user control without any luck.

This is my xaml code:

<local:DisplayElement x:Class="Simrad.ViewManagement.ViewManager.DockingMultiViewControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Simrad.ViewManagement.ViewManager"
xmlns:docking="http://schemas.actiprosoftware.com/winfx/xaml/docking"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<local:DisplayElement.Resources>
<BooleanToVisibilityConverter x:Key="BoolToVisibilityConverter"/>
</local:DisplayElement.Resources>
<Grid x:Name="MultiViewMainGrid">
<Grid.RowDefinitions>
<RowDefinition Height="18" x:Name="RowMenuDefinition"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Menu x:Name="MenuViewItem" Visibility="Visible">
<MenuItem Header="Options" >

</MenuItem>
</MenuItem>
</Menu>
<Grid x:Name="ContentHolder" Grid.Row="1">

<docking:DockSite x:Name="dockSite" />
</Grid>

I have tried to change the local:DisplayElement.resources to target Window, but again without any luck.

Posted 7 years ago by Actipro Software Support - Cleveland, OH, USA

Hello,

Per above, #3 is not an easy thing in general. A WindowChrome instance is used to make the window chrome and its title bar in that scenario. You could possibly override resources like "AssetResourceKeys.WindowTitleBarBackgroundActiveBrushKey" but take careful note that doing so will affect any other windows that have our WindowChrome applied.

The only way to specifically affect your scenario is to make a completely custom Window Style/Template and set it in InitializeFloatingWindow. In WPF you can't apply a Style to a Window without setting it specifically on that instance. When we make a floated dock host (that can contain one or more of our docking windows), we create a new WPF Window to contain that floated dock host. That's when the DockSite.InitializeFloatingWindow method is called. You could make a class that inherits DockSite and override that method. Then use an instance of that class in place of the DockSite in your DisplayElement.

Your DockSite.InitializeFloatingWindow method implementation can look at the Window that is passed and call WindowChrome.GetChrome on it to get the WindowChrome instance we set, and set the StyleKey property, like:

protected override void InitializeFloatingWindow(Window window) {
	var chrome = WindowChrome.GetChrome(window);
	if (chrome != null)
		chrome.StyleKey = "CustomStyleKey";
}

This effectively will tell our WindowChrome to use an alternate Style that targets Window. That Style must have the exact string Key "CustomStyleKey" (you could change it to something else if you change it in the code above) and must be in your Application.Resources. Really there's a lot that goes into making a chromed Window style so you would be best off to clone/modify ours as a starting point if you have our default XAML styles/templates.

Actipro Software Support

Posted 7 years ago by Emir Dizdarevic

Thanks for the answer, but I found out that I already had the resources in place and all I had to do is to add this:

The latest build of this product (v24.1.1) was released 2 months ago, which was after the last post in this thread.

Comments (6)

Add Comment