WPF中ToolTip的自定义

来源:互联网 发布:自动化编程软件有哪些 编辑:程序博客网 时间:2024/05/17 23:17
ToolTip或者PopUp这个控件在做界面时会经常用到。如何对ToolTip进行自定义呢?

1.首先自定义tooltip的controlTemplate,完全清除系统默认效果, 如下:
[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <ControlTemplate x:Key ="TooltipTemplate" TargetType="ToolTip">  
  2.               <ContentPresenter x :Name="contentPresenter" Height="{TemplateBinding Height }" Width="{ TemplateBinding Width}" ContentTemplate="{TemplateBinding ContentTemplate }" ></ContentPresenter>  
  3.           </ControlTemplate>  

2.自定义tooltip的contentTemplate, 这样可以专注于tooltip的界面呈现, 而不关心tooltip要显示的字符串, 如下:
 
[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <Style x :Key="ToolTipStyle" TargetType="ToolTip">  
  2.                 <Setter Property ="IsOpen" Value="False">  
  3.                 </Setter>  
  4.                  
  5.                 <Setter Property ="ContentTemplate">  
  6.                     <Setter.Value>  
  7.                         <DataTemplate>  
  8.                             <Border x :Name="errorBorder" Background="#CC595959" BorderBrush="#99000000" BorderThickness="1" CornerRadius ="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin ="0" MaxWidth="320">  
  9.                                 <Border.Effect>  
  10.                                     <DropShadowEffect BlurRadius ="4" ShadowDepth="0"/>  
  11.                                 </Border.Effect>  
  12.                                 <Grid>  
  13.                                     <Grid.ColumnDefinitions>  
  14.                                         <ColumnDefinition Width ="Auto"/>  
  15.                                         <ColumnDefinition Width ="*"/>  
  16.                                     </Grid.ColumnDefinitions>  
  17.                                     <Border Margin ="16,16,8,16" VerticalAlignment="Top">  
  18.                                         <Path x :Name="path1" Grid.ColumnSpan="1" Data="M9.0789473,12.870737 L10.927632,12.870737 10.927632,14.5 9.0789473,14.5 z M9.0000001,5.9999999 L11,5.9999999 11,7.994543 10.526316,12.308322 9.4802633,12.308322 9.0000001,7.994543 z M9.9647158,1.8074455 C9.5912184,1.7923756 9.2860216,2.1402843 9.2860216,2.1402845 9.2860216,2.1402843 2.5977592,14.8926 2.2227221,15.46075 1.8476844,16.028899 2.5562553,16.218284 2.5562553,16.218284 2.5562553,16.218284 16.2035,16.218284 17.18278,16.218284 18.162063,16.218284 17.870029,15.460751 17.870029,15.460751 17.870029,15.460751 11.056506,2.8352754 10.494117,2.1197443 10.31837,1.8961406 10.134488,1.8142953 9.9647158,1.8074455 z M9.9331295,0.00021409988 C10.317457,0.0076069832 10.762559,0.20740509 11.244278,0.77299643 12.785778,2.5828881 19.97391,16.249695 19.97391,16.249695 19.97391,16.249695 20.318179,17.954408 18.505573,17.985971 16.692966,18.017535 1.5982747,17.985971 1.5982747,17.985971 1.5982747,17.985971 -0.27740097,18.206807 0.03512764,16.028899 0.3476572,13.850991 8.5362361,0.89893103 8.536236,0.8989315 8.5362361,0.89893103 9.0876089,-0.016049385 9.9331295,0.00021409988 z" Height="17" Stretch="Fill" Width="20" Visibility="Visible" Fill ="Red"/>  
  19.                                     </Border>  
  20.                                     <TextBlock x :Name="textBlock" Text="{TemplateBinding Content }" Margin="0,14,10,14" FontSize="14" Grid.Column ="1" TextWrapping="Wrap" Foreground="Red"/>  
  21.                                 </Grid>  
  22.                             </Border>  
  23.                         </DataTemplate>  
  24.                     </Setter.Value>  
  25.                 </Setter>  
  26.   
  27.                 <Style.Triggers>  
  28.                     <Trigger Property ="IsOpen" Value="True">  
  29.                         <Trigger.EnterActions>  
  30.                             <BeginStoryboard>  
  31.                                 <Storyboard>  
  32.                                     <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Duration="0:0:3">  
  33.                                         <DiscreteObjectKeyFrame KeyTime ="0:0:0">  
  34.                                             <DiscreteObjectKeyFrame.Value>  
  35.                                                 <Visibility> Visible</Visibility >  
  36.                                             </DiscreteObjectKeyFrame.Value>  
  37.                                         </DiscreteObjectKeyFrame>  
  38.                                         <DiscreteObjectKeyFrame KeyTime ="0:0:3">  
  39.                                            <DiscreteObjectKeyFrame.Value>  
  40.                                                 <Visibility> Hidden</Visibility >  
  41.                                            </DiscreteObjectKeyFrame.Value>  
  42.                                         </DiscreteObjectKeyFrame>  
  43.                                     </ObjectAnimationUsingKeyFrames>  
  44.                                 </Storyboard>  
  45.                             </BeginStoryboard>  
  46.                         </Trigger.EnterActions>  
  47.                     </Trigger>  
  48.                 </Style.Triggers>  
  49.             </Style>  

3.应用Tooltip的style,如下:
[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <Button Content ="TestButton">  
  2.         < Button.ToolTip>  
  3.             < ToolTip Style ="{ DynamicResource ToolTipStyle}" Content="This is a button"></ ToolTip >  
  4.         </ Button.ToolTip>  
  5.     </ Button>  

4.以上style使用时的注意事项:

因为Animation的设置值优先于本地设置值,所以会出现ToolTip在动画结束时永远隐藏。
因此在需要打开tooltip时,首先要在动画开始时设置Visibility为Visible,第二要触发IsOpen=True则必须先IsOpen=False, 因为在Tooltip隐藏后并没有设置IsOpen=False。

代码如下:
[csharp] view plaincopy在CODE上查看代码片派生到我的代码片
  1. _toolTip.Style = ToolTipStyle;  
  2.                         _toolTip.PlacementTarget = this.AssociatedObject;  
  3.                         _toolTip.Placement = PlacementMode.Bottom;  
  4.                         _toolTip.Content = toolTipText;  
  5.   
  6.                         //must set false first to trigger storyboard  
  7.                         _toolTip.IsOpen = false;  
  8.                         _toolTip.IsOpen = true;  
  9.                         _toolTip.StaysOpen = false;  



5.ToolTip的bug

对于ToolTip的显示延迟、显示时间长度、是否保持显示、显示时的位置等等,通用的做法都是通过ToolTipService来进行统一设置。比如:

[csharp] view plaincopy在CODE上查看代码片派生到我的代码片
  1. ToolTipService.InitialShowDelay="1000"  
  2. ToolTipService.ShowDuration="7000"  
  3. ToolTipService.BetweenShowDelay="2000"  
  4. ToolTipService.Placement="Right"   
  5. ToolTipService.PlacementRectangle="50,0,0,0"  
  6. ToolTipService.HorizontalOffset="10"   
  7. ToolTipService.VerticalOffset="20"  
  8. ToolTipService.HasDropShadow="false"  
  9. ToolTipService.ShowOnDisabled="true"   
  10. ToolTipService.IsEnabled="true"  


但是,我发现在TextBox的PreviewInput事件里去弹出tooltip时, 以上的ToolTipService设置并没有起到效果,Tooltip的弹出位置和显示时间还是默认的, 即跟随鼠标显示,默认5s。
这个时候就需要对ToolTip的相关属性进行设置。

            _toolTip.Style = ToolTipStyle;
            _toolTip.PlacementTarget = this.AssociatedObject;
            _toolTip.Placement = PlacementMode.Bottom;

当然,当我们toolTip和ToolTipService都设置相关属性时, ToolTipService的设置优先。

0 0
原创粉丝点击