WPF tooltip位置，增加箭头，圆角设置，样式修改

最新推荐文章于 2024-11-24 23:42:08 发布

原创最新推荐文章于 2024-11-24 23:42:08 发布 · 3k 阅读

4 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#wpf

博客分享了WPF中ToolTip相关设置的代码。包括修改ToolTip相对鼠标的位置，通过设置VerticalOffset和HorizontalOffset实现；增加箭头，在样式里添加自定义三角形的path；设置圆角，修改样式里Border的CornerRadius属性；还介绍了样式修改方法，在xaml前添加特定内容。

先贴代码

<Window.Resources>
        <FontFamily x:Key="PingFangSCRegular">/WpfApplication2;Component/Fonts/#PingFang SC Regular</FontFamily>
        <Style x:Key="MyToolTipStyle" TargetType="ToolTip">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <StackPanel>
                            <Path HorizontalAlignment="Right" VerticalAlignment="Center" Data="M 6 0 L 0 6 L 12 6 Z" Fill="#E6333333" Margin="0,0,10,0"/>
                            <Border CornerRadius="2" Background="#E6333333" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <TextBlock  Text="{TemplateBinding ContentControl.Content}" Foreground="White" FontFamily="{StaticResource PingFangSCRegular}" LineHeight="20" Margin="6"/>
                            </Border>
                        </StackPanel>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Name="btnTest"  Content="Button" HorizontalAlignment="Left" Margin="180,96,0,0" VerticalAlignment="Top" Width="21" Height="18" Click="btnTest_Click">
            <Button.ToolTip>
                <ToolTip Name="aaa" Style ="{DynamicResource MyToolTipStyle}" Content="按钮提示按钮提示按钮提示按钮提示" VerticalOffset="-10" HorizontalOffset="-180"/>
            </Button.ToolTip>
        </Button>
    </Grid>

1.tooltip相对位置修改：
参考了：https://www.cnblogs.com/greenteaone/archive/2010/12/15/1906890.html
VerticalOffset="-10" HorizontalOffset="-180" 这两个是相对于鼠标的位置修改
2.增加箭头：

<Path HorizontalAlignment="Right" VerticalAlignment="Center" Data="M 6 0 L 0 6 L 12 6 Z" Fill="#E6333333" Margin="0,0,10,0"/>

在样式里面增加了一个path，就是图形，自定义了一个三角形，看上去和箭头一样，具体的path data的定义，可以参考：
https://blog.csdn.net/feiying008/article/details/13094539
3.圆角设置：样式里面的Border的属性CornerRadius=“2”
4.样式修改：之前没接触过样式，后来百度学习了下，发现就是在xaml最前面增加如下内容

<Window.Resources>
        <Style x:Key="MyToolTipStyle" TargetType="ToolTip">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        //style的内容
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>