{"id":436,"date":"2013-03-16T20:46:19","date_gmt":"2013-03-16T09:46:19","guid":{"rendered":"http:\/\/blog.quppa.net\/?p=436"},"modified":"2013-03-16T20:46:19","modified_gmt":"2013-03-16T09:46:19","slug":"wpf-tooltip-drop-shadows-in-windows-8","status":"publish","type":"post","link":"https:\/\/www.quppa.net\/blog\/2013\/03\/16\/wpf-tooltip-drop-shadows-in-windows-8\/","title":{"rendered":"WPF ToolTip Drop Shadows in Windows 8"},"content":{"rendered":"

The standard ToolTip<\/a> control template for the Windows 8 theme in WPF (\u2018Aero2\u2019) has no drop shadow, whether or not the HasDropShadow property is set. The background colour and margins are also slightly off compared to the native style.<\/p>\n

The following template produces a result that\u2019s closer to the real thing:<\/p>\n

<Style TargetType="{x:Type ToolTip}">\n  <Setter Property="Foreground" Value="#FF575757" \/>\n  <Setter Property="Background" Value="#FFFFFFFF" \/>\n  <Setter Property="Padding" Value="5,1,6,2" \/>\n  <Setter Property="HasDropShadow" Value="{DynamicResource {x:Static SystemParameters.DropShadowKey}}" \/>\n  <Setter Property="Template">\n    <Setter.Value>\n      <ControlTemplate TargetType="{x:Type ToolTip}" xmlns:themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero">\n        <themes:SystemDropShadowChrome Name="Shdw" themes:SystemDropShadowChrome.Color="Transparent" themes:SystemDropShadowChrome.CornerRadius="0" SnapsToDevicePixels="True">\n          <Border Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True">\n            <ContentPresenter TextOptions.TextFormattingMode="Display" Margin="{TemplateBinding Padding}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" \/>\n          <\/Border>\n        <\/themes:SystemDropShadowChrome>\n        <ControlTemplate.Triggers>\n          <Trigger Property="HasDropShadow" Value="True">\n            <Setter TargetName="Shdw" Property="Margin" Value="0,0,5,5" \/>\n            <Setter TargetName="Shdw" Property="themes:SystemDropShadowChrome.Color" Value="#71000000" \/>\n          <\/Trigger>\n        <\/ControlTemplate.Triggers>\n      <\/ControlTemplate>\n    <\/Setter.Value>\n  <\/Setter>\n<\/Style><\/pre>\n
You\u2019ll need to add a reference to PresentationFramework.Aero in your project (note the \u2018themes\u2019 namespace used in the control template).<\/p>\n
\"Screenshot<\/p>\n
The top image shows a standard Windows 8 tooltip, the middle shows the default tooltip appearance for WPF applications running in Windows 8, and the bottom shows a WPF tooltip using the above template. Note that the Win32 and WPF drop shadows are slightly different in appearance. Additionally, the WPF shadow fades in and out with the tooltip, while the Win32 shadow just pops in and out.<\/p>\n
Now, you\u2019ll only want to use this template when the user is running Windows 8, and if the user changes themes you\u2019ll no longer have tooltips that match the native style.<\/p>\n","protected":false},"excerpt":{"rendered":"
The standard ToolTip control template for the Windows 8 theme in WPF (\u2018Aero2\u2019) has no drop shadow, whether or not the HasDropShadow property is set. The background colour and margins are also slightly off compared to the native style. The following template produces a result that\u2019s closer to the real thing: <Style TargetType="{x:Type ToolTip}"> <Setter … Continue reading “WPF ToolTip Drop Shadows in Windows 8”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6,9],"tags":[142,148,152,171,185],"class_list":["post-436","post","type-post","status-publish","format-standard","hentry","category-programming","category-windows","tag-style","tag-themes","tag-tooltip","tag-windows-2","tag-wpf"],"_links":{"self":[{"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/posts\/436","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/comments?post=436"}],"version-history":[{"count":0,"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/posts\/436\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/media?parent=436"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/categories?post=436"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.quppa.net\/blog\/wp-json\/wp\/v2\/tags?post=436"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}